2f:I[748432,["/vc-ap-vercel-templates/_next/static/immutable/chunks/2vhfrite5-ffx.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/05p05zti_rn-6.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/0ue9o08vzcj81.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/2-c9-j3hbb6_5.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/210s95qhzs-kd.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/425x3l6qw83ka.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/1xbz0505g72br.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/1d1c70gp_t7ak.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/3702j97f9tiud.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/15kid0fc4rbwi.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/0cxf4qpb5soyw.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/1icgfdp-j4khl.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/1w1qp7xynodi1.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/3avfw6gu8sdho.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/1g66byldwxk9w.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/3xtdbyzvu_spv.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/1tpfwo4utcu8-.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/2al5u4gvohhh-.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/2pl22y-arv8ha.js"],"NavigationMarker"] 30:I[939773,["/vc-ap-vercel-templates/_next/static/immutable/chunks/2vhfrite5-ffx.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/05p05zti_rn-6.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/0ue9o08vzcj81.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/2-c9-j3hbb6_5.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/210s95qhzs-kd.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/425x3l6qw83ka.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/1xbz0505g72br.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/1d1c70gp_t7ak.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/3702j97f9tiud.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/15kid0fc4rbwi.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/0cxf4qpb5soyw.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/1icgfdp-j4khl.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/1w1qp7xynodi1.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/3avfw6gu8sdho.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/1g66byldwxk9w.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/3xtdbyzvu_spv.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/1tpfwo4utcu8-.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/2al5u4gvohhh-.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/2pl22y-arv8ha.js"],"TrackedSuspenseFallbackMarker"] 31:I[57106,["/vc-ap-vercel-templates/_next/static/immutable/chunks/2vhfrite5-ffx.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/05p05zti_rn-6.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/0ue9o08vzcj81.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/2-c9-j3hbb6_5.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/210s95qhzs-kd.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/425x3l6qw83ka.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/1xbz0505g72br.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/1d1c70gp_t7ak.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/3702j97f9tiud.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/15kid0fc4rbwi.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/0cxf4qpb5soyw.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/1icgfdp-j4khl.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/1w1qp7xynodi1.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/3avfw6gu8sdho.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/1g66byldwxk9w.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/3xtdbyzvu_spv.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/1tpfwo4utcu8-.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/2al5u4gvohhh-.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/2pl22y-arv8ha.js"],"ButtonLink"] 32:I[939773,["/vc-ap-vercel-templates/_next/static/immutable/chunks/2vhfrite5-ffx.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/05p05zti_rn-6.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/0ue9o08vzcj81.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/2-c9-j3hbb6_5.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/210s95qhzs-kd.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/425x3l6qw83ka.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/1xbz0505g72br.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/1d1c70gp_t7ak.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/3702j97f9tiud.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/15kid0fc4rbwi.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/0cxf4qpb5soyw.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/1icgfdp-j4khl.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/1w1qp7xynodi1.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/3avfw6gu8sdho.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/1g66byldwxk9w.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/3xtdbyzvu_spv.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/1tpfwo4utcu8-.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/2al5u4gvohhh-.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/2pl22y-arv8ha.js"],"TrackedSuspenseContentMarker"] 33:I[382422,["/vc-ap-vercel-templates/_next/static/immutable/chunks/2vhfrite5-ffx.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/05p05zti_rn-6.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/0ue9o08vzcj81.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/2-c9-j3hbb6_5.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/210s95qhzs-kd.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/425x3l6qw83ka.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/1xbz0505g72br.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/1d1c70gp_t7ak.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/3702j97f9tiud.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/15kid0fc4rbwi.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/0cxf4qpb5soyw.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/1icgfdp-j4khl.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/1w1qp7xynodi1.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/3avfw6gu8sdho.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/1g66byldwxk9w.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/3xtdbyzvu_spv.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/1tpfwo4utcu8-.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/2al5u4gvohhh-.js","/vc-ap-vercel-templates/_next/static/immutable/chunks/2pl22y-arv8ha.js"],"TemplateDetailsHeroButtonsClient"] 34:Td58,# 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. Models are configured in `lib/ai/models.ts` with per-model provider routing. Included models: Mistral, Moonshot, DeepSeek, OpenAI, and xAI. ### 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). 2a:[["$","$L2f",null,{"label":"TemplateDetailsPage","phase":"content"}],["$","div",null,{"className":"grid justify-items-start px-6 lg:px-0","children":["$","div",null,{"className":"mx-auto","children":[["$","div",null,{"className":"mt-16 grid w-[calc(100vw-3rem)] max-w-3xl gap-8","children":[["$","div",null,{"className":"flex flex-col gap-4 pt-2","data-testid":"templates/hero","children":["$","div",null,{"className":"items-left flex flex-col justify-between gap-8 text-pretty md:flex-row","children":[["$","div",null,{"className":"flex flex-col gap-2","children":[["$","h1",null,{"className":"text-2xl font-semibold tracking-tight","children":"Natural Language Postgres"}],["$","p",null,{"className":"m-0 text-sm text-gray-900","children":"An Next.js application that allows you to query a PostgreSQL database with natural language."}]]}],["$","div",null,{"children":["$","$11",null,{"fallback":["$","$L30",null,{"boundaryId":"suspense-template-details-hero-buttons","name":"template-details-hero-buttons","hasExplicitName":true,"children":[["$","span",null,{"className":"rounded-[5px] after:animate-loading-skeleton block relative overflow-hidden invisible after:content-[\"\"] after:absolute after:inset-0 after:right-[-200%] after:bg-gradient-to-r after:from-[var(--ds-gray-100)] after:via-[var(--ds-gray-200)] after:to-[var(--ds-gray-100)] after:bg-[length:50%_100%] after:bg-[position:0_0] after:visible","data-geist-skeleton":"","data-testid":"legacy/skeleton","data-version":"v1","children":["$","$L31",null,{"href":"#","children":"Deploy"}]}],["$","span",null,{"className":"rounded-[5px] after:animate-loading-skeleton block relative overflow-hidden invisible after:content-[\"\"] after:absolute after:inset-0 after:right-[-200%] after:bg-gradient-to-r after:from-[var(--ds-gray-100)] after:via-[var(--ds-gray-200)] after:to-[var(--ds-gray-100)] after:bg-[length:50%_100%] after:bg-[position:0_0] after:visible","data-geist-skeleton":"","data-testid":"legacy/skeleton","data-version":"v1","children":["$","$L31",null,{"href":"#","children":"View Demo"}]}]]}],"children":["$","$L32",null,{"boundaryId":"suspense-template-details-hero-buttons","name":"template-details-hero-buttons","hasExplicitName":true,"children":["$","$L33",null,{"fields":{"name":"Natural Language Postgres","description":"An Next.js application that allows you to query a PostgreSQL database with natural language.","slug":"natural-language-postgres","githubUrl":"https://github.com/vercel-labs/natural-language-postgres","demoUrl":"https://natural-language-postgres.vercel.app/","publisher":"▲ Vercel","thumbnail":{"metadata":{"tags":[],"concepts":[]},"sys":{"space":{"sys":{"type":"Link","linkType":"Space","id":"e5382hct74si"}},"id":"5u3P1D0sUzQ3Dn3HMB6eO2","type":"Asset","createdAt":"2024-10-16T19:01:41.966Z","updatedAt":"2024-10-16T19:01:41.966Z","environment":{"sys":{"id":"master","type":"Link","linkType":"Environment"}},"publishedVersion":4,"revision":1,"locale":"en-US"},"fields":{"title":"natural-language-postgres-thumbnail","description":"","file":{"url":"//images.ctfassets.net/e5382hct74si/5u3P1D0sUzQ3Dn3HMB6eO2/d69fac8182bb9c08e58321e6db62e7b3/Next.js___Google_Gemini_Chatbot__youtube_.png","details":{"size":51622,"image":{"width":1280,"height":720}},"fileName":"Next.js + Google Gemini Chatbot (youtube).png","contentType":"image/png"}}},"framework":["Next.js"],"type":["AI"],"css":["Tailwind","Radix UI"],"database":["Postgres"],"relatedTemplates":[{"metadata":{"tags":[],"concepts":[]},"sys":{"space":{"sys":{"type":"Link","linkType":"Space","id":"e5382hct74si"}},"id":"472Bf8ZS7aHlq4V8F1kDZg","type":"Entry","createdAt":"2023-06-16T22:16:25.441Z","updatedAt":"2026-06-28T19:53:27.138Z","environment":{"sys":{"id":"master","type":"Link","linkType":"Environment"}},"publishedVersion":106,"revision":32,"contentType":{"sys":{"type":"Link","linkType":"ContentType","id":"templates"}},"locale":"en-US"},"fields":{"hasBeenReviewed":true,"name":"Chatbot","description":"A full-featured, hackable Next.js AI chatbot built by Vercel","slug":"chatbot","order":3,"githubUrl":"https://github.com/vercel/chatbot","overview":"$34","demoUrl":"https://chatbot.ai-sdk.dev/demo","publisher":"▲ Vercel","thumbnail":{"metadata":{"tags":[],"concepts":[]},"sys":{"space":{"sys":{"type":"Link","linkType":"Space","id":"e5382hct74si"}},"id":"4cmiDM859wtut7XeG0iFYq","type":"Asset","createdAt":"2024-11-04T21:07:45.147Z","updatedAt":"2024-11-04T21:15:38.477Z","environment":{"sys":{"id":"master","type":"Link","linkType":"Environment"}},"publishedVersion":9,"revision":2,"locale":"en-US"},"fields":{"title":"ai-chatbot-3-0","description":"","file":{"url":"//images.ctfassets.net/e5382hct74si/4cmiDM859wtut7XeG0iFYq/953f071e4556b8a07bcab042f3a08db3/Untitled_design__17_.png","details":{"size":102671,"image":{"width":1200,"height":630}},"fileName":"Untitled design (17).png","contentType":"image/png"}}},"metaTitle":"Next.js AI Chatbot Templates & Starters","framework":["Next.js"],"type":["AI","Authentication"],"css":["Tailwind"],"database":["Vercel Blob","Postgres"],"auth":["NextAuth.js"],"relatedTemplates":[{"sys":{"type":"Link","linkType":"Entry","id":"5uVM4gkE0VYmNdUOYHiLEe"}},{"sys":{"type":"Link","linkType":"Entry","id":"6EdUIxQhnDggm8XSKcDzy6"}},{"sys":{"type":"Link","linkType":"Entry","id":"25lExhOPDFoDXUJtlpTUHi"}}],"integrationsOptional":true,"requiredEnvs":["AUTH_SECRET"],"requiredEnvsDescription":"Set a random secret to use for authentication.","products":[{"type":"integration","protocol":"storage","productSlug":"neon","integrationSlug":"neon"},{"type":"integration","protocol":"storage","productSlug":"upstash-kv","integrationSlug":"upstash"},{"type":"blob"}]}},{"metadata":{"tags":[],"concepts":[]},"sys":{"space":{"sys":{"type":"Link","linkType":"Space","id":"e5382hct74si"}},"id":"67DEZZdaMTokcWv3a7ZfAp","type":"Entry","createdAt":"2024-03-27T19:48:24.958Z","updatedAt":"2024-03-27T19:48:24.958Z","environment":{"sys":{"id":"master","type":"Link","linkType":"Environment"}},"publishedVersion":93,"revision":1,"contentType":{"sys":{"type":"Link","linkType":"ContentType","id":"templates"}},"locale":"en-US"},"fields":{"name":"Upstash Vector + Vercel AI SDK Starter","slug":"upstash-vector-vercel-ai-sdk-starter","publisher":"Upstash","thumbnail":{"metadata":{"tags":[],"concepts":[]},"sys":{"space":{"sys":{"type":"Link","linkType":"Space","id":"e5382hct74si"}},"id":"1V2VN1pDmuOnCFcpKLlrFX","type":"Asset","createdAt":"2024-03-27T19:48:09.229Z","updatedAt":"2024-03-27T19:48:09.229Z","environment":{"sys":{"id":"master","type":"Link","linkType":"Environment"}},"publishedVersion":4,"revision":1,"locale":"en-US"},"fields":{"title":"DegreeGuru: A RAG Chatbot Built with Vercel AI SDK + Upstash Vector","description":"DegreeGuru is a RAG chatbot for expert answers on university degrees. Built with Vercel AI SDK and Upstash Vector.","file":{"url":"//images.ctfassets.net/e5382hct74si/1V2VN1pDmuOnCFcpKLlrFX/b00dcec86a22598023c8177dc54e652f/degreeguru-rag-chatbot-vercel-upstash.png","details":{"size":186013,"image":{"width":2400,"height":1256}},"fileName":"degreeguru-rag-chatbot-vercel-upstash.png","contentType":"image/png"}}},"description":"A RAG chatbot starter for expert answers on university degrees. Built using Vercel AI SDK, LangChain, Upstash Vector, and OpenAI.","metaTitle":"Upstash Vector + Vercel AI SDK Starter","framework":["Next.js"],"type":["AI"],"css":["Tailwind"],"database":["Upstash"],"relatedTemplates":["$2a:1:props:children:props:children:0:props:children:0:props:children:props:children:1:props:children:props:children:props:children:props:fields:relatedTemplates:0",{"sys":{"type":"Link","linkType":"Entry","id":"iwFT8yMri2ZlxxGAvnsmp"}},{"sys":{"type":"Link","linkType":"Entry","id":"5uVM4gkE0VYmNdUOYHiLEe"}}],"githubUrl":"https://github.com/upstash/degree-guru","demoUrl":"https://degreeguru.vercel.app/","integrationsOptional":true,"requiredEnvs":["UPSTASH_REDIS_REST_URL","UPSTASH_REDIS_REST_TOKEN","UPSTASH_VECTOR_REST_URL","UPSTASH_VECTOR_REST_TOKEN","OPENAI_API_KEY"],"requiredEnvsDescription":"See the .env.example.local file to learn how to get these env vars:","requiredEnvsLink":"https://github.com/upstash/degree-guru/blob/master/.env.local.example"}}],"deployUrl":"https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2Fvercel-labs%2Fnatural-language-postgres&env=OPENAI_API_KEY&envDescription=Learn%20more%20about%20how%20to%20get%20the%20API%20Keys%20for%20the%20application&envLink=https%3A%2F%2Fgithub.com%2Fvercel-labs%2Fnatural-language-postgres%2Fblob%2Fmain%2F.env.example&demo-title=Natural%20Language%20Postgres&demo-description=Query%20PostgreSQL%20database%20using%20natural%20language%20and%20visualize%20results%20with%20Next.js%20and%20AI%20SDK.&demo-url=https%3A%2F%2Fnatural-language-postgres.vercel.app&stores=%5B%7B%22type%22%3A%22postgres%22%7D%5D","integrationsOptional":true,"requiredEnvs":["OPENAI_API_KEY"],"cdnRoutingRuleHref":"","firewallRuleHref":"","thumbnailUrl":"//images.ctfassets.net/e5382hct74si/5u3P1D0sUzQ3Dn3HMB6eO2/d69fac8182bb9c08e58321e6db62e7b3/Next.js___Google_Gemini_Chatbot__youtube_.png"}}]}]}]}]]}]}],"$L35","$L36"]}],"$L37"]}]}]]