Skip to content

Quickstart (5 minutes)

Prereqs. Node ≥ 20. Claude Code installed.

  1. Install the Claude Code plugin. It bundles the MCP gateway and auto-registers it as an MCP server.

    /plugin marketplace add BrainBlend-AI/tesseron
    /plugin install tesseron@tesseron

    Restart Claude Code after installation. The gateway now runs whenever the plugin is enabled; no separate process to manage.

  2. Add the SDK to your app.

    Terminal window
    pnpm add @tesseron/web zod
  3. Declare an app and one action.

    src/main.ts
    import { tesseron } from '@tesseron/web';
    import { z } from 'zod';
    tesseron.app({ id: 'notes', name: 'My Notes App' });
    tesseron
    .action('createNote')
    .describe('Create a new note with a title and body')
    .input(z.object({
    title: z.string().min(1),
    body: z.string().default(''),
    }))
    .handler(({ title, body }) => {
    const note = { id: crypto.randomUUID(), title, body, createdAt: Date.now() };
    store.add(note); // whatever "add" means in your app
    return note;
    });
    await tesseron.connect();

    tesseron.connect() opens the WebSocket and resolves once the gateway returns a welcome with a claimCode.

  4. Claim the session from Claude. Open your app - the gateway prints a 6-character claim code to its stderr (and you can surface it in your UI too). Tell Claude:

    "Claim Tesseron session AB3X-7K"

    Claude calls the built-in tesseron__claim_session tool, the gateway marks the session claimed, and a notifications/tools/list_changed event fires.

  5. Call your action. The tool list now contains notes__createNote. Ask Claude:

    "Create a note titled 'Groceries' with body 'eggs, milk, bread'."

    The handler runs inside your tab. The new note appears in your UI, reactively. Claude sees the returned object as the tool result.