https://github.com/tqmvt/react-ai-chatbot

ai chatbot in react
https://github.com/tqmvt/react-ai-chatbot

ai chatbot react typescript

Last synced: about 2 months ago
JSON representation

ai chatbot in react

• Host: GitHub
• URL: https://github.com/tqmvt/react-ai-chatbot
• Owner: tqmvt
• License: other
• Created: 2024-05-15T19:37:27.000Z (7 months ago)
• Default Branch: main
• Last Pushed: 2024-05-15T19:48:49.000Z (7 months ago)
• Last Synced: 2024-05-16T07:13:56.286Z (7 months ago)
• Topics: ai, chatbot, react, typescript
• Language: TypeScript
• Homepage:
• Size: 1.56 MB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Next.js AI Chatbot

An open-source AI chatbot app template built with Next.js, the Vercel AI SDK, OpenAI, and Vercel KV.

## Features

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

- React Server Components (RSCs), Suspense, and Server Actions

- [Vercel AI SDK](https://sdk.vercel.ai/docs) for streaming chat UI

- Support for OpenAI (default), Anthropic, Hugging Face, or custom AI chat models and/or LangChain

- Edge runtime-ready

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

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

  - [Radix UI](https://radix-ui.com) for headless component primitives

  - Icons from [Phosphor Icons](https://phosphoricons.com)

- Chat History, rate limiting, and session storage with [Vercel KV](https://vercel.com/storage/kv)

- [NextAuth.js](https://github.com/nextauthjs/next-auth) for authentication

## Model Providers

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), [Hugging Face](https://huggingface.co), or using [LangChain](https://js.langchain.com) with just a few lines of code.

## 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/concepts/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 OpenAI 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/).