https://github.com/vercel/chatbot

A full-featured, hackable Next.js AI chatbot built by Vercel
https://github.com/vercel/chatbot

ai chatgpt nextjs react redis shadcn-ui vercel

Last synced: 2 days ago
JSON representation

A full-featured, hackable Next.js AI chatbot built by Vercel

• Host: GitHub
• URL: https://github.com/vercel/chatbot
• Owner: vercel
• License: other
• Created: 2023-05-19T16:36:23.000Z (almost 3 years ago)
• Default Branch: main
• Last Pushed: 2026-03-03T15:57:25.000Z (4 days ago)
• Last Synced: 2026-03-03T20:10:42.895Z (4 days ago)
• Topics: ai, chatgpt, nextjs, react, redis, shadcn-ui, vercel
• Language: TypeScript
• Homepage: https://chatbot.ai-sdk.dev
• Size: 15.3 MB
• Stars: 19,783
• Watchers: 147
• Forks: 6,373
• Open Issues: 73
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

• awesome - vercel/chatbot - A full-featured, hackable Next.js AI chatbot built by Vercel (TypeScript)
• awesome-ccamel - vercel/chatbot - A full-featured, hackable Next.js AI chatbot built by Vercel (TypeScript)

README

          


  

  
Chatbot






    Chatbot (formerly AI Chatbot) is a free, open-source template built with Next.js and the AI SDK that helps you quickly build powerful chatbot applications.





  Read Docs ·

  Features ·

  Model Providers ·

  Deploy Your Own ·

  Running locally






## Features

- [Next.js](https://nextjs.org) App Router

  - Advanced routing for seamless navigation and performance

  - React Server Components (RSCs) and Server Actions for server-side rendering and increased performance

- [AI SDK](https://ai-sdk.dev/docs/introduction)

  - Unified API for generating text, structured objects, and tool calls with LLMs

  - Hooks for building dynamic chat and generative user interfaces

  - Supports OpenAI, Anthropic, Google, xAI, and other model providers via AI Gateway

- [shadcn/ui](https://ui.shadcn.com)

  - Styling with [Tailwind CSS](https://tailwindcss.com)

  - Component primitives from [Radix UI](https://radix-ui.com) for accessibility and flexibility

- Data Persistence

  - [Neon Serverless Postgres](https://vercel.com/marketplace/neon) for saving chat history and user data

  - [Vercel Blob](https://vercel.com/storage/blob) for efficient file storage

- [Auth.js](https://authjs.dev)

  - Simple and secure authentication

## Model Providers

This template uses the [Vercel AI Gateway](https://vercel.com/docs/ai-gateway) to access multiple AI models through a unified interface. The default model is [OpenAI](https://openai.com) GPT-4.1 Mini, with support for Anthropic, Google, and xAI models.

### AI Gateway Authentication

**For Vercel deployments**: Authentication is handled automatically via OIDC tokens.

**For non-Vercel deployments**: You need to provide an AI Gateway API key by setting the `AI_GATEWAY_API_KEY` environment variable in your `.env.local` file.

With the [AI SDK](https://ai-sdk.dev/docs/introduction), you can also switch to direct LLM providers like [OpenAI](https://openai.com), [Anthropic](https://anthropic.com), [Cohere](https://cohere.com/), and [many more](https://ai-sdk.dev/providers/ai-sdk-providers) with just a few lines of code.

## Deploy Your Own

You can deploy your own version of Chatbot to Vercel with one click:

[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/templates/next.js/chatbot)

## Running locally

You will need to use the environment variables [defined in `.env.example`](.env.example) to run Chatbot. It's recommended you use [Vercel Environment Variables](https://vercel.com/docs/projects/environment-variables) for this, but a `.env` file is all that is necessary.

> Note: You should not commit your `.env` file or it will expose secrets that will allow others to control access to your various AI and authentication provider accounts.

1. Install Vercel CLI: `npm i -g vercel`

2. Link local instance with Vercel and GitHub accounts (creates `.vercel` directory): `vercel link`

3. Download your environment variables: `vercel env pull`

```bash

pnpm install

pnpm db:migrate # Setup database or apply latest database changes

pnpm dev

```

Your app template should now be running on [localhost:3000](http://localhost:3000).