01 / The interface

Ajo

A small, composable way to build interfaces that feel alive.

Write your interface in JSX. Use a plain function for a view, or a JavaScript generator when it needs state. Ajo keeps the component’s state and lifecycle in the same place as its rendering logic.

Read the guide View source

An example

import type { Stateful } from 'ajo'

const Counter: Stateful = function* () {
  let count = 0

  while (true) yield (
    <button set:onclick={() => this.next(() => count++)}>
      Count: {count}
    </button>
  )
}

JSX with an automatic Ajo runtime

Generator components and explicit updates

Server rendering and DOM reconciliation

Part of the whole

Ajo Kit gives these components routes, server data and a place in a full application.

Explore the platform