Skip to main content

What is Kog?

Kog is a language and framework for building user interfaces on microcontrollers (ESP32-class devices with touch displays) using the React Native you already know.

import { useState } from 'react';
import { View, Text, Pressable, StyleSheet } from 'react-native';

export function Counter() {
  const [count, setCount] = useState(0);
  return (
    <View style={styles.row}>
      <Text style={styles.label}>{count}</Text>
      <Pressable onPress={() => setCount(count + 1)}>
        <Text>+1</Text>
      </Pressable>
    </View>
  );
}

const styles = StyleSheet.create({
  row:   { flexDirection: 'row', gap: 8, alignItems: 'center' },
  label: { color: '#222', fontSize: 16 },
});

That component runs on a $10 board, rendered by LVGL, the industry-standard embedded graphics library. You get sub-second hot reload while you develop and over-the-air updates when you ship.

Looks like React Native, runs like Svelte​

Kog keeps React Native's surface: TSX (or plain JSX; see the switcher on any code block), hooks, StyleSheet.create, Animated, Platform, and components named View, Text, Image, Pressable, FlatList, imported from 'react-native'. There is no CSS and no DOM, just as in React Native, and every place Kog can't match React Native is listed in Coming from React Native. But there is no virtual DOM and no reconciler on the device. The Kog compiler rewrites your components at build time so that:

  • each component's body runs once, when it mounts;
  • every dynamic expression in your JSX becomes a tiny effect subscribed to exactly the state it reads;
  • updating state runs only those effects, each of which calls one native LVGL setter.

LVGL widgets are retained objects that keep their own state, so this model maps onto them perfectly: no tree diffing, no re-renders, no garbage-collection churn during animation. The result fits comfortably where React itself never could. See Thinking in Kog for the handful of places the behavior differs from React (they're improvements, mostly).

The toolchain is just npm​

You never install ESP-IDF, CMake, a C compiler, or Python. The native runtime (LVGL + a tiny JS engine + the Kog host layer) ships as prebuilt firmware images that the CLI downloads and flashes over pure Node serial. Your app compiles to compact bytecode that pushes to the device over USB in under a second.

No hardware yet? The simulator is the same runtime compiled for your desktop. Everything works identically, including hot reload, the component library, and even GPIO via virtual pins.

Where to next​

Project status

Kog is under active initial development. These docs describe the v1 surface; pages for features still landing are marked accordingly.