# Chat SDK adds web adapter support

**Published:** May 8, 2026 | **Authors:** Ben Sabic, Josh Singh

---

You can now build chat UIs that connect to Chat SDK with the new [web adapter](https://chat-sdk.dev/adapters/web). Build in-product assistants, support agents, or any other browser-based chat experience.

Define the bot on your server:

**lib/bot.ts**
```typescript
import { Chat } from "chat";
import { createWebAdapter } from "@chat-adapter/web";
const bot = new Chat({
  userName: "mybot",
  adapters: {
    web: createWebAdapter({
      userName: "mybot",
      getUser: (req) => ({ id: getUserIdFromCookie(req) }),
    }),
  },
});
bot.onDirectMessage(async (thread, message) => {
  await thread.post(`You said: ${message.text}`);
});
```

Then stream replies to the browser with a preconfigured [`@ai-sdk/react`](https://www.npmjs.com/package/@ai-sdk/react) `useChat` hook:

**app/chat/page.tsx**
```tsx
import { useChat } from "@chat-adapter/web/react";

const { messages, sendMessage, status } = useChat();
```

Read the [documentation](https://chat-sdk.dev/adapters/web) to get started, browse the [directory](https://chat-sdk.dev/adapters), or build your own [adapter](https://chat-sdk.dev/docs/contributing/building).

**The Complete Guide to Chat SDK**
Learn how Chat SDK works end-to-end: from core concepts to building your first chatbot to deploying it across platforms.
[Read the guide](https://vercel.com/kb/guide/the-complete-guide-to-chat-sdk)

---

📚 **More updates:** [View all changelog entries](/changelog/sitemap.md) | [Blog](/blog/sitemap.md)