62 lines
3.9 KiB
Markdown
62 lines
3.9 KiB
Markdown
<a href="https://chat.vercel.ai/">
|
|
<img alt="Next.js 14 and App Router-ready AI chatbot." src="app/(chat)/opengraph-image.png">
|
|
<h1 align="center">Chat SDK</h1>
|
|
</a>
|
|
|
|
<p align="center">
|
|
Chat SDK is a free, open-source template built with Next.js and the AI SDK that helps you quickly build powerful chatbot applications.
|
|
</p>
|
|
|
|
<p align="center">
|
|
<a href="https://chat-sdk.dev"><strong>Read Docs</strong></a> ·
|
|
<a href="#features"><strong>Features</strong></a> ·
|
|
<a href="#model-providers"><strong>Model Providers</strong></a> ·
|
|
<a href="#deploy-your-own"><strong>Deploy Your Own</strong></a> ·
|
|
<a href="#running-locally"><strong>Running locally</strong></a>
|
|
</p>
|
|
<br/>
|
|
|
|
## 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://sdk.vercel.ai/docs)
|
|
- Unified API for generating text, structured objects, and tool calls with LLMs
|
|
- Hooks for building dynamic chat and generative user interfaces
|
|
- Supports xAI (default), OpenAI, Fireworks, and other model providers
|
|
- [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
|
|
- [Vercel Postgres powered by Neon](https://vercel.com/storage/postgres) for saving chat history and user data
|
|
- [Vercel Blob](https://vercel.com/storage/blob) for efficient file storage
|
|
- [NextAuth.js](https://github.com/nextauthjs/next-auth)
|
|
- Simple and secure authentication
|
|
|
|
## Model Providers
|
|
|
|
This template ships with [xAI](https://x.ai) `grok-2-1212` as the default chat model. However, with the [AI SDK](https://sdk.vercel.ai/docs), you can switch LLM providers to [OpenAI](https://openai.com), [Anthropic](https://anthropic.com), [Cohere](https://cohere.com/), and [many more](https://sdk.vercel.ai/providers/ai-sdk-providers) with just a few lines of code.
|
|
|
|
## Deploy Your Own
|
|
|
|
You can deploy your own version of the Next.js AI Chatbot to Vercel with one click:
|
|
|
|
[](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2Fvercel%2Fai-chatbot&env=AUTH_SECRET&envDescription=Generate%20a%20random%20secret%20to%20use%20for%20authentication&envLink=https%3A%2F%2Fgenerate-secret.vercel.app%2F32&project-name=my-awesome-chatbot&repository-name=my-awesome-chatbot&demo-title=AI%20Chatbot&demo-description=An%20Open-Source%20AI%20Chatbot%20Template%20Built%20With%20Next.js%20and%20the%20AI%20SDK%20by%20Vercel&demo-url=https%3A%2F%2Fchat.vercel.ai&products=%5B%7B%22type%22%3A%22integration%22%2C%22protocol%22%3A%22ai%22%2C%22productSlug%22%3A%22grok%22%2C%22integrationSlug%22%3A%22xai%22%7D%2C%7B%22type%22%3A%22integration%22%2C%22protocol%22%3A%22ai%22%2C%22productSlug%22%3A%22api-key%22%2C%22integrationSlug%22%3A%22groq%22%7D%2C%7B%22type%22%3A%22integration%22%2C%22protocol%22%3A%22storage%22%2C%22productSlug%22%3A%22neon%22%2C%22integrationSlug%22%3A%22neon%22%7D%2C%7B%22type%22%3A%22blob%22%7D%5D)
|
|
|
|
## Running locally
|
|
|
|
You will need to use the environment variables [defined in `.env.example`](.env.example) to run Next.js AI 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 dev
|
|
```
|
|
|
|
Your app template should now be running on [localhost:3000](http://localhost:3000).
|