---
title: Chat SDK
product: vercel
url: /docs/chat-sdk
canonical_url: "https://vercel.com/docs/chat-sdk"
last_updated: 2018-10-20
type: conceptual
prerequisites:
  []
related:
  - /docs/ai-gateway/authentication-and-byok
  - /docs/ai-gateway/models-and-providers
  - /docs/chat-sdk/quickstart
  - /docs/chat-sdk/adapters
  - /docs/functions
summary: Build bots for Slack and other chat platforms with Chat SDK, and deploy them on Vercel.
install_vercel_plugin: npx plugins add vercel/vercel-plugin
---

# Chat SDK

## Build bots for chat platforms

Build bots for Slack, Teams, and more with one TypeScript API, and deploy them on Vercel.

#### Handle messages

**lib/bot.ts**

```typescript filename="lib/bot.ts"
import { Chat } from 'chat';
import { createSlackAdapter } from '@chat-adapter/slack';
import { createRedisState } from '@chat-adapter/state-redis';
import { connectSlackAdapter } from '@vercel/connect/chat';

export const bot = new Chat({
  userName: 'my-bot',
  adapters: {
    slack: createSlackAdapter({
      ...connectSlackAdapter('slack/my-bot'),
    }),
  },
  state: createRedisState(),
});

bot.onNewMention(async (thread) => {
  await thread.subscribe();
  await thread.post('Hello! Reply here to chat.');
});

bot.onSubscribedMessage(async (thread, message) => {
  await thread.post(message.text);
});
```

**lib/bot.js**

```javascript filename="lib/bot.js"
import { Chat } from 'chat';
import { createSlackAdapter } from '@chat-adapter/slack';
import { createRedisState } from '@chat-adapter/state-redis';
import { connectSlackAdapter } from '@vercel/connect/chat';

export const bot = new Chat({
  userName: 'my-bot',
  adapters: {
    slack: createSlackAdapter({
      ...connectSlackAdapter('slack/my-bot'),
    }),
  },
  state: createRedisState(),
});

bot.onNewMention(async (thread) => {
  await thread.subscribe();
  await thread.post('Hello! Reply here to chat.');
});

bot.onSubscribedMessage(async (thread, message) => {
  await thread.post(message.text);
});
```

#### Stream AI

**lib/bot.ts**

```typescript filename="lib/bot.ts"
import { streamText } from 'ai';

const model = process.env.AI_GATEWAY_MODEL;
if (!model) throw new Error('Set AI_GATEWAY_MODEL.');

bot.onNewMention(async (thread, message) => {
  const result = streamText({
    model,
    prompt: message.text,
    abortSignal: thread.signal,
  });
  await thread.post(result.textStream);
});
```

**lib/bot.js**

```javascript filename="lib/bot.js"
import { streamText } from 'ai';

const model = process.env.AI_GATEWAY_MODEL;
if (!model) throw new Error('Set AI_GATEWAY_MODEL.');

bot.onNewMention(async (thread, message) => {
  const result = streamText({
    model,
    prompt: message.text,
    abortSignal: thread.signal,
  });
  await thread.post(result.textStream);
});
```

Keep the bot setup from **Handle messages** and replace its handlers with this example. Add the `streamText` import, install `ai`, configure [AI Gateway authentication](/docs/ai-gateway/authentication-and-byok), and set `AI_GATEWAY_MODEL` to a [model ID](/docs/ai-gateway/models-and-providers). See [streaming responses](https://chat-sdk.dev/docs/streaming).

#### Add actions

**lib/bot.ts**

```typescript filename="lib/bot.ts"
import { Actions, Button, Card } from 'chat';

bot.onNewMention(async (thread) => {
  await thread.post(Card({
    title: 'Meet your bot',
    children: [Actions([
      Button({ id: 'hello', label: 'Say hello' }),
    ])],
  }));
});

bot.onAction('hello', async ({ thread }) => {
  if (thread) await thread.post('Hello again!');
});
```

**lib/bot.js**

```javascript filename="lib/bot.js"
import { Actions, Button, Card } from 'chat';

bot.onNewMention(async (thread) => {
  await thread.post(Card({
    title: 'Meet your bot',
    children: [Actions([
      Button({ id: 'hello', label: 'Say hello' }),
    ])],
  }));
});

bot.onAction('hello', async ({ thread }) => {
  if (thread) await thread.post('Hello again!');
});
```

Keep the bot setup from **Handle messages** and replace its handlers with this example. Add the shown imports to `lib/bot.ts` or `lib/bot.js`. See the [cards](https://chat-sdk.dev/docs/cards) and [action handlers](https://chat-sdk.dev/docs/actions) guides.

The **Handle messages** example connects to Slack through Vercel Connect, stores subscriptions in Redis, and echoes replies in mentioned threads. Use your connector UID in place of `slack/my-bot` and set `REDIS_URL` for shared state. Follow the [Chat SDK quickstart](/docs/chat-sdk/quickstart) to scaffold the bot with `create-chat-sdk`, connect Slack through Vercel Connect, and deploy it on Vercel.

## Handle conversations across platforms

Chat SDK separates your bot's behavior from the platform that delivers each event:

- **Event handlers** respond to mentions, subscribed messages, and interactions such as button clicks.
- **Platform adapters** connect your bot to services such as Slack, Discord, and Microsoft Teams. Each adapter translates platform events and outgoing messages into the shared API.
- **State adapters** store thread subscriptions, coordinate concurrent processing, and deduplicate events. Use persistent shared storage, such as Redis or PostgreSQL, when deploying to Vercel.

A bot can use multiple platform adapters with the same handlers. Supported features vary by platform; use the [adapters guide](/docs/chat-sdk/adapters) to choose platform and state adapters and check their capabilities.

## Deploy on Vercel

Expose your bot's webhook through a [Vercel Function](/docs/functions). With Next.js, a Route Handler passes incoming requests to the platform adapter and uses `after` to finish processing after sending the webhook response.

The function's [maximum duration](/docs/functions/configuring-functions/duration) still applies to this processing. Use [Workflows](/docs/workflows) for work that must survive interruptions or wait for an external event, such as a human approval.

For a complete example with environment variables, persistent Redis state, and webhook configuration, follow the [quickstart](/docs/chat-sdk/quickstart).

## Add AI, credentials, and durable tasks

Chat SDK handles messaging and interactions. You can build a bot without a language model, or combine it with other tools:

| Tool | Use it to |
| --- | --- |
| [AI SDK](/docs/ai-sdk) and [AI Gateway](/docs/ai-gateway) | Generate responses, call tools, and stream model output into chat. Follow the [AI Gateway and AI SDK guide](/kb/guide/ai-gateway-and-ai-sdk). |
| [Vercel Connect](/docs/connect/frameworks/chat-sdk) | Resolve provider credentials at runtime and receive supported platform events through Connect triggers. |
| [eve](/docs/chat-sdk/eve) | Run messages through an eve agent while keeping Chat SDK adapters and event handlers. |
| [Workflows](/docs/workflows) | Run durable tasks and pause for human input. Follow the [human-in-the-loop guide](/kb/guide/human-in-the-loop-with-chat-sdk-and-workflow-sdk). |

Persistent Chat SDK state keeps track of subscriptions and coordinates event processing. Workflows provides durable execution for the tasks your bot starts.

## Build with an AI coding agent

Install the [Chat SDK skill](https://chat-sdk.dev/docs#ai-coding-agents) to give your coding agent guidance on SDK APIs, adapter patterns, and project conventions:

```bash filename="Terminal"
pnpx skills add vercel/chat
```

The skill uses the documentation bundled in `node_modules/chat/docs`, along with adapter guides and starter templates.

For guidance across the Vercel platform, install the [Vercel Plugin](/docs/agent-resources/vercel-plugin). It includes the Chat SDK skill, specialist agents, and slash commands:

```bash filename="Terminal"
pnpx plugins add vercel/vercel-plugin
```

See the [plugin setup guide](/docs/agent-resources/vercel-plugin#getting-started) for prerequisites and supported tools.

## Start with a template

- [Knowledge Agent](/templates/nuxt/chat-sdk-knowledge-agent): Build a knowledge bot with Nuxt, PostgreSQL, and Chat SDK.
- [Community Agent](/templates/next.js/chat-sdk-community-agent): Build a Slack community agent with a Next.js admin interface.

## Next steps

- [Build and deploy your first Slack bot](/docs/chat-sdk/quickstart)
- [Explore the complete guide to Chat SDK](/kb/guide/the-complete-guide-to-chat-sdk)
- [Choose platform and state adapters](/docs/chat-sdk/adapters)
- [Use an eve agent with Chat SDK](/docs/chat-sdk/eve)
- [Read the Chat SDK API and platform documentation](https://chat-sdk.dev/docs)


---

[View full sitemap](/docs/sitemap)


If you find anything wrong or missing or can't find something, submit feedback by reading https://vercel.com/feedback.md to improve Vercel.