beat

Pulse-native JSX framework for direct-DOM client-rendered SPA applications.
Fine-grained rendering with explicit routing and async primitives.

Documentation

Scaffold

Start a new app with the scaffolder:

pnpm dlx @ochairo/beat-create my-app

Use the showcases template for a full-featured app with routing, crypto dashboard, kanban board, and spreadsheet:

pnpm dlx @ochairo/beat-create my-app --template showcases

That command scaffolds a Vite + TypeScript starter already configured for Beat's JSX runtime and Vite plugin.

Example

import { component } from "@ochairo/beat";
import { pulse } from "@ochairo/pulse";

const counter = pulse(0);

const onclick = (value) => {
  counter.set(counter.get() + value);
};

export const App = component(() => {
  return (
    <main>
      <header class="header">
        <h1 class="title">Counter app</h1>
      </header>
      <section class="counter">
        <button class="button" onClick={() => onclick(-1)}>
          -
        </button>
        <strong class="result">{counter}</strong>
        <button class="button" onClick={() => onclick(1)}>
          +
        </button>
      </section>
    </main>
  );
});