Spaces:
Running
Running
MingruiZhang
commited on
Commit
•
2189691
1
Parent(s):
3ba9c0c
Create README.md
Browse files
README.md
ADDED
@@ -0,0 +1,71 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
1 |
+
<a href="https://chat.vercel.ai/">
|
2 |
+
<img alt="Next.js 14 and App Router-ready AI chatbot." src="https://chat.vercel.ai/opengraph-image.png">
|
3 |
+
<h1 align="center">Next.js AI Chatbot</h1>
|
4 |
+
</a>
|
5 |
+
|
6 |
+
<p align="center">
|
7 |
+
An open-source AI chatbot app template built with Next.js, the Vercel AI SDK, OpenAI, and Vercel KV.
|
8 |
+
</p>
|
9 |
+
|
10 |
+
<p align="center">
|
11 |
+
<a href="#features"><strong>Features</strong></a> ·
|
12 |
+
<a href="#model-providers"><strong>Model Providers</strong></a> ·
|
13 |
+
<a href="#deploy-your-own"><strong>Deploy Your Own</strong></a> ·
|
14 |
+
<a href="#running-locally"><strong>Running locally</strong></a> ·
|
15 |
+
<a href="#authors"><strong>Authors</strong></a>
|
16 |
+
</p>
|
17 |
+
<br/>
|
18 |
+
|
19 |
+
## Features
|
20 |
+
|
21 |
+
- [Next.js](https://nextjs.org) App Router
|
22 |
+
- React Server Components (RSCs), Suspense, and Server Actions
|
23 |
+
- [Vercel AI SDK](https://sdk.vercel.ai/docs) for streaming chat UI
|
24 |
+
- Support for OpenAI (default), Anthropic, Cohere, Hugging Face, or custom AI chat models and/or LangChain
|
25 |
+
- [shadcn/ui](https://ui.shadcn.com)
|
26 |
+
- Styling with [Tailwind CSS](https://tailwindcss.com)
|
27 |
+
- [Radix UI](https://radix-ui.com) for headless component primitives
|
28 |
+
- Icons from [Phosphor Icons](https://phosphoricons.com)
|
29 |
+
- Chat History, rate limiting, and session storage with [Vercel KV](https://vercel.com/storage/kv)
|
30 |
+
- [NextAuth.js](https://github.com/nextauthjs/next-auth) for authentication
|
31 |
+
|
32 |
+
## Model Providers
|
33 |
+
|
34 |
+
This template ships with OpenAI `gpt-3.5-turbo` as the default. However, thanks to the [Vercel AI SDK](https://sdk.vercel.ai/docs), you can switch LLM providers to [Anthropic](https://anthropic.com), [Cohere](https://cohere.com/), [Hugging Face](https://huggingface.co), or using [LangChain](https://js.langchain.com) with just a few lines of code.
|
35 |
+
|
36 |
+
## Deploy Your Own
|
37 |
+
|
38 |
+
You can deploy your own version of the Next.js AI Chatbot to Vercel with one click:
|
39 |
+
|
40 |
+
[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?demo-title=Next.js+Chat&demo-description=A+full-featured%2C+hackable+Next.js+AI+chatbot+built+by+Vercel+Labs&demo-url=https%3A%2F%2Fchat.vercel.ai%2F&demo-image=%2F%2Fimages.ctfassets.net%2Fe5382hct74si%2F4aVPvWuTmBvzM5cEdRdqeW%2F4234f9baf160f68ffb385a43c3527645%2FCleanShot_2023-06-16_at_17.09.21.png&project-name=Next.js+Chat&repository-name=nextjs-chat&repository-url=https%3A%2F%2Fgithub.com%2Fvercel-labs%2Fai-chatbot&from=templates&skippable-integrations=1&env=OPENAI_API_KEY%2CAUTH_GITHUB_ID%2CAUTH_GITHUB_SECRET%2CAUTH_SECRET&envDescription=How+to+get+these+env+vars&envLink=https%3A%2F%2Fgithub.com%2Fvercel-labs%2Fai-chatbot%2Fblob%2Fmain%2F.env.example&teamCreateStatus=hidden&stores=[{"type":"kv"}])
|
41 |
+
|
42 |
+
## Creating a KV Database Instance
|
43 |
+
|
44 |
+
Follow the steps outlined in the [quick start guide](https://vercel.com/docs/storage/vercel-kv/quickstart#create-a-kv-database) provided by Vercel. This guide will assist you in creating and configuring your KV database instance on Vercel, enabling your application to interact with it.
|
45 |
+
|
46 |
+
Remember to update your environment variables (`KV_URL`, `KV_REST_API_URL`, `KV_REST_API_TOKEN`, `KV_REST_API_READ_ONLY_TOKEN`) in the `.env` file with the appropriate credentials provided during the KV database setup.
|
47 |
+
|
48 |
+
## Running locally
|
49 |
+
|
50 |
+
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.
|
51 |
+
|
52 |
+
> Note: You should not commit your `.env` file or it will expose secrets that will allow others to control access to your various OpenAI and authentication provider accounts.
|
53 |
+
|
54 |
+
1. Install Vercel CLI: `npm i -g vercel`
|
55 |
+
2. Link local instance with Vercel and GitHub accounts (creates `.vercel` directory): `vercel link`
|
56 |
+
3. Download your environment variables: `vercel env pull`
|
57 |
+
|
58 |
+
```bash
|
59 |
+
pnpm install
|
60 |
+
pnpm dev
|
61 |
+
```
|
62 |
+
|
63 |
+
Your app template should now be running on [localhost:3000](http://localhost:3000/).
|
64 |
+
|
65 |
+
## Authors
|
66 |
+
|
67 |
+
This library is created by [Vercel](https://vercel.com) and [Next.js](https://nextjs.org) team members, with contributions from:
|
68 |
+
|
69 |
+
- Jared Palmer ([@jaredpalmer](https://twitter.com/jaredpalmer)) - [Vercel](https://vercel.com)
|
70 |
+
- Shu Ding ([@shuding\_](https://twitter.com/shuding_)) - [Vercel](https://vercel.com)
|
71 |
+
- shadcn ([@shadcn](https://twitter.com/shadcn)) - [Vercel](https://vercel.com)
|