Quickstart

Building chat directly into your own frontend? Follow Frontend chat with your own authentication to set up identities, an organization proxy token, and a same-origin streaming proxy.

Tilde is designed for agents to build more agents. Choose Agentic workflow to work through your coding agent, or For humans to follow the same steps yourself.

This guide shows you how to build and test a signed ChatKit endpoint using Next.js and the Vercel AI SDK. A completed Hello World agent is available for reference.

Agentic workflow
For humans

Connect your coding agent

Connect the client where your coding agent runs to Tilde’s global MCP server.

Connect your coding agent

Choose your client and complete its setup.

Ask it to build the example

Send this prompt to the connected agent.

Build the Hello World agent

Open in Cursor

Any project that includes a tilde.state.yaml file is instantly deployable to your Tilde account.Use the

button in a project’s README.md, or import the file manually. See Terraform to learn more.

Create the app

You need Node.js 22 or newer, pnpm 10, a Tilde account, and an OpenAI API key.

pnpm create [email protected] hello-world-agent --ts --eslint --app --no-src-dir --no-tailwind --use-pnpm
cd hello-world-agent
pnpm add @ai-sdk/openai ai @trytilde/sdk @trytilde/sdk-vercel-ai-node
pnpm add -D openbot
touch .env.local

Create the agent endpoint

Create app/api/hello-world/route.ts. You can compare it with the completed route in the examples repository.

app/api/hello-world/route.ts

import { openai } from "@ai-sdk/openai";
import {
  chatKitEndpoint,
  convertToAiSdkMessages,
  createClient,
} from "@trytilde/sdk-vercel-ai-node";
import {
  consumeStream,
  convertToModelMessages,
  streamText,
} from "ai";

export const POST = chatKitEndpoint({
  client: createClient({
    apiKey: process.env.TILDE_API_KEY!,
    orgId: process.env.TILDE_ORG_ID!,
    teamId: process.env.TILDE_TEAM_ID!,
  }),
  webhookSigningKey: process.env.TILDE_WEBHOOK_SIGNING_KEY!,
  async handler(request, context) {
    const history = await context.session.history();
    const messages = await convertToAiSdkMessages({
      messages: [...history.items, ...context.messages],
      chatkit: context.chatkit,
    });
    const result = streamText({
      abortSignal: request.signal,
      messages: await convertToModelMessages(messages),
      model: openai("gpt-5.5"),
      system: "You are a helpful assistant. Keep your answers concise.",
    });

    return result.toUIMessageStreamResponse({
      consumeSseStream: consumeStream,
      originalMessages: messages,
    });
  },
});

Change the system instruction to change what your agent does. Keep the signed chatKitEndpoint wrapper and ChatKit history conversion.

Create the agent in Tilde

Open Tilde, select your workspace, and go to ChatKit → Agents.
Click Register agent and name it Hello World.
Enable Local running endpoint and enter api/hello-world as the endpoint path.
Click Register, then copy the one-time API key and webhook signing key.

Configure the environment

Set these values in .env.local.Find the organization and team IDs under Settings → Team settings → General information.

.env.local

TILDE_API_KEY=
TILDE_ORG_ID=
TILDE_TEAM_ID=
TILDE_WEBHOOK_SIGNING_KEY=

Run your app through a Dev Tunnel

Sign in to Tilde before opening the tunnel. The login flow asks you to select the workspace containing Hello World. Then start your app’s development process through the tunnel. Replace pnpm dev with the command you normally use to run your app locally.The tunnel gives your local agent a public HTTPS endpoint, allowing Tilde to deliver messages, webhooks, and tool invocations while you develop. For ChatKit, chatKitEndpoint verifies Tilde’s webhook signature and rejects requests without a valid signature.

pnpm exec openbot auth login
pnpm exec openbot tunnel -- pnpm dev

The Dev Tunnel exposes every page and API route served by your local app—not only the agent endpoint—to the public internet. Disable any unneeded or unsecured routes before starting the tunnel, or protect them with authentication and use the tunnel with caution.

Test the agent

Open ChatKit workspace, select the workspace where you registered Hello World, start a session with the agent, and send:

Say hello in one sentence.

Get started

Identities

Product features

Guides

Connect your coding agent

Continue exploring

Connect third-party services and custom tools to your agent

Provision a skill registry so your agent can discover and update skills

Trigger your agent from third-party events outside regular chats

Create a shared brain for one or more agents

Deploy to production and manage multiple development environments

Connect your coding agent

​Continue exploring

Connect third-party services and custom tools to your agent

Provision a skill registry so your agent can discover and update skills

Trigger your agent from third-party events outside regular chats

Create a shared brain for one or more agents

Deploy to production and manage multiple development environments

Continue exploring