aiautomators.io
All posts
claudeagentschat sdkcookbook

Connect Claude Managed Agents to Vercel's Chat SDK with This Cookbook

August 28, 2026 · AI Automators

Anthropic has published a new cookbook in its claude-quickstarts repo showing how to connect a Claude Managed Agent to Vercel's Chat SDK. The pitch is simple: the Chat SDK owns the chat interface, and a Managed Agent owns the actual work. If you've ever wanted to give a Claude-powered agent a proper chat window without stitching together your own frontend, session handling, and streaming, this is a working reference to copy from.

What it actually does

The demo is a research analyst that lives in a browser chat window. Vercel's Chat SDK provides the chat surface. One Claude Managed Agents session runs per conversation, doing the research and streaming its reply token by token. As the agent works, a live feed shows the tool calls it makes, and each turn's tool calls stay in the transcript as a collapsible trace. So you can see not just the answer, but what the agent did to get there.

The division of labour is the interesting part. The Chat SDK is described as a universal chat layer: one type-safe handler with 15+ adapters covering Slack, Teams, Discord, WhatsApp and more. This particular demo uses the web adapter, which means there's no chat platform to register with. No Slack or WhatsApp app, no webhook to verify, no tunnel, and the only credential you need is Anthropic auth. Managed Agents is the piece behind the chat: it handles the tool loop, sandboxed web research, session state, and optional memory stores, all server-side.

The wiring is neat. The server stores nothing itself. The `useChat` conversation ID from the Chat SDK is used directly as a Managed Agents session ID, so the agent's own session becomes the source of truth for the conversation. That's a sensible pattern that avoids duplicating state between your chat layer and your agent.

Why this matters for builders

Most people building agent chat experiences end up rebuilding the same plumbing: a message list, streaming responses, showing tool calls, keeping conversation history, and handling one session per user thread. This cookbook hands you a version of all of that where the heavy lifting sits on the server side inside Managed Agents, and the frontend concerns sit inside the Chat SDK.

The web-adapter-only setup is a smart way to learn. Because you skip registering a Slack or WhatsApp app, you avoid the usual onboarding friction of webhooks, verification, and tunnels just to see the thing run locally. You can get an agent talking in a browser first, then, in principle, swap in a different adapter later since the Chat SDK is built to support many surfaces from the same handler. The repo includes the structure you'd expect for that: `setup`, `src`, and `web` directories, a `.env.example`, a `CLAUDE.md`, and a `skill.md`.

A couple of things are worth being clear-eyed about. The cookbook demonstrates the web adapter specifically, so while the Chat SDK advertises 15+ adapters, this example doesn't walk through configuring Slack or WhatsApp end to end. And Managed Agents is Anthropic's own agent runtime, so this is a Claude-first pattern, not a model-agnostic framework. If your architecture is committed to another provider, this isn't a drop-in.

Where it fits versus other approaches

If you're used to building chatbots and agents with orchestration tools like n8n, Make, or Zapier, the mental model here is different. Those tools connect triggers and actions across apps with visual workflows. This cookbook is code-first and centred on a single persistent agent conversation with server-side tool use and streaming. The two aren't mutually exclusive: you might use an automation platform to route events or fan out results, while a Managed Agent handles the interactive, multi-turn research part in the chat window.

Compared to rolling your own agent loop against the OpenAI or Anthropic APIs, the appeal of Managed Agents is that the tool loop, sandboxed web research, and session state are managed for you rather than something you maintain. Pairing that with the Chat SDK means you're also not hand-building the chat surface. The trade-off, as always with managed runtimes, is that you're leaning on a specific provider's abstractions and hosting model rather than owning every layer yourself.

The honest summary: this is a starting point, not a product. It's a concrete, runnable example that shows a clean pattern for giving a Claude agent a chat interface, with visible tool traces and session state handled for you. If that's roughly the shape of what you're building, cloning the repo and reading through `src` and `web` will save you a lot of guesswork about how the pieces connect.

If you'd like help adapting this pattern to your own product or connecting it to the platforms your customers actually use, browse the provider directory to find someone who can put it to work.

Find the right expert

Browse our directory of vetted AI automation providers.

Browse providers