This tutorial introduces TanStack AI, an ecosystem of strongly typed libraries for adding AI capabilities to applications. It uses TanStack Start, React bindings, and the Vercel AI Gateway adapter to build a chat endpoint that sends messages to a selected model, illustrated with Anthropic’s Claude Opus 5. The initial implementation returns a complete JSON response, while a small change switches the endpoint to Server-Sent Events so the interface can display generated text as it arrives. The React `useChat` hook tracks messages, sends prompts, exposes loading state, and forwards conversation history for follow-up requests. The article then adds persistence through `@tanstack/ai-persistence`, which defines storage contracts for messages, runs, interrupts, and metadata while allowing the application to provide its own database implementation. An AI Skill can generate Drizzle schema and store code, although the author says a dedicated CLI would ultimately be preferable. Server middleware persists threads and accepts thread and run identifiers, while a GET handler reconstructs saved conversations after a page reload. The article stresses that the authorization callback must verify access before returning a transcript; the example returns `true` only as a placeholder. Finally, an in-memory stream buffers active responses so a disconnected client can resume an interrupted SSE response. The author says this approach works locally or with a consistently identified runtime such as a Cloudflare Durable Object, but production deployments spanning instances or restarts may need a durable stream backend. A second part is planned to cover structured output and streaming.
