Skip to content
Tesseron

All examples

All six examples live in examples/. Each is a complete, runnable Todo app, intentionally simple so the Tesseron-specific code is easy to read.

vanilla-todo Zero-framework baseline. Start here.
node-todo Headless Node service. No browser.
express-todo HTTP REST + MCP on the same Node process.
react-todo React 18 + `@tesseron/react` hooks.
svelte-todo Svelte 5 runes (`$state`, `$derived`).
vue-todo Vue 3 composition API.

Feature matrix

Section titled “Feature matrix”
Featurevanillanodeexpressreactsveltevue
Basic actions✅✅✅✅✅✅
Subscribable resources✅✅✅✅✅✅
Annotations (destructive, requiresConfirmation, readOnly)✅✅✅✅✅✅
Zod input validation✅✅✅✅✅✅
ctx.confirm (in clearCompleted)✅✅✅✅✅✅
ctx.elicit with schema (in renameTodo)✅✅✅✅✅✅
ctx.progress (in importTodos)✅✅✅✅✅✅
ctx.sample (in suggestTodos)✅✅✅✅✅✅
Framework hooks✗-✗✅✗✗
Runs in the browser✅✗✗✅✅✅
Runs in Node✗✅✅✗✗✗
Parallel REST API✗✗✅✗✗✗
Section titled “Recommended reading order”
  1. vanilla-todo - plain DOM, no framework. The SDK's builder API with nothing in the way.
  2. node-todo - the same action declarations on Node. Proves nothing's tied to the browser.
  3. express-todo - adds a REST API next to Tesseron. Shows the "same state, two channels" pattern.
  4. react-todo - hooks-based integration.
  5. svelte-todo - mutation via $state runes.
  6. vue-todo - mutation via ref().value / computed().

Running any of them

Section titled “Running any of them”
Terminal window
git clone https://github.com/BrainBlend-AI/tesseron
cd tesseron
pnpm install
pnpm --filter <example-name> dev

Then claim the session from your agent - see the quickstart if you haven't already.