---
title: "Vercel AI Gateway Embeddings Demo"
description: "A simple Next.js chatbot app to demonstrate the use of embedding models for RAG through the Vercel AI Gateway. "
url: "https://vercel.com/templates/next.js/vercel-ai-gateway-embeddings-demo"
links:
  repository: "https://github.com/vercel-labs/ai-gateway-embeddings-demo/tree/main"
  demo: "https://ai-gateway-embeddings-demo.labs.vercel.dev/"
  deploy: "https://vercel.com/new/clone?demo-title=Vercel+AI+Gateway+Embeddings+Demo&demo-description=A+simple+Next.js+chatbot+app+to+demonstrate+the+use+of+embedding+models+for+RAG+through+the+Vercel+AI+Gateway.+&demo-url=https%3A%2F%2Fai-gateway-embeddings-demo.labs.vercel.dev%2F&project-name=Vercel+AI+Gateway+Embeddings+Demo&repository-name=vercel-ai-gateway-embeddings-demo&repository-url=https%3A%2F%2Fgithub.com%2Fvercel-labs%2Fai-gateway-embeddings-demo&amp%3Bproject-name=ai-gateway-embeddings&amp%3Brepository-name=ai-gateway-embeddings&amp%3Bdemo-title=AI+Gateway+Embeddings+Demo&amp%3Bdemo-description=A+simple+Next.js+chatbot+app+to+demonstrate+the+use+of+embedding+models+for+RAG+through+the+Vercel+AI+Gateway&amp%3Bdemo-url=https%3A%2F%2Fai-gateway-embeddings-demo.labs.vercel.dev&amp%3Bproducts=%5B%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%5D&demo-image=%2F%2Fimages.ctfassets.net%2Fe5382hct74si%2F5eGwZXHCYjHYWDASXfextn%2F7275d202880d90912a47204b6d3775c5%2Flight.png"
---

# Vercel AI Gateway Embeddings Demo

A simple Next.js chatbot app to demonstrate the use of embedding models for RAG through the Vercel AI Gateway.

A simple [Next.js](https://nextjs.org) chatbot app to demonstrate the use of embedding models for RAG through the Vercel AI Gateway.

Paste any facts or docs into the chat and this app will chunk them, generate embeddings via the Vercel AI Gateway, and store them as vectors in Neon. When you ask a question, your query is embedded and the app performs a cosine-similarity search to pull the most relevant chunks. The model then answers using only the retrieved snippets, demonstrating semantic retrieval (RAG).

## Getting Started

### Setup

[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2Fvercel-labs%2Fai-gateway-embeddings-demo&project-name=ai-gateway-embeddings&repository-name=ai-gateway-embeddings&demo-title=AI%20Gateway%20Embeddings%20Demo&demo-description=A%20simple%20Next.js%20chatbot%20app%20to%20demonstrate%20the%20use%20of%20embedding%20models%20for%20RAG%20through%20the%20Vercel%20AI%20Gateway&demo-url=https%3A%2F%2Fai-gateway-embeddings-demo.labs.vercel.dev&stores=%5B%7B%22type%22%3A%22integration%22%2C%22integrationSlug%22%3A%22neon%22%2C%22productSlug%22%3A%22neon%22%2C%22protocol%22%3A%22storage%22%7D%5D)

1. Clone this repository with the Deploy button above
1. Install the [Vercel CLI](https://vercel.com/docs/cli) if you don't already have it (`pnpm i -g vercel`)
1. Clone the repository you created above: `git clone <repo-url>`
1. Link it to a Vercel project: `vc link` or `vc deploy`
1. Pull environment variables with `vc env pull`
1. Install packages with `pnpm i` (or `npm i` or `yarn i`)
1. Run the development server with `vc dev` and open http://localhost:3000 to try the chatbot

### FAQ

1. If you prefer running your local development server directly rather than using `vc dev`, you'll need to run `vc env pull` to fetch the project's OIDC authentication token locally
   1. the token expires every 12h, so you'll need to re-run this command periodically.
   1. if you use `vc dev` it will auto-refresh the token for you, so you don't need to fetch it manually
1. If you're linking to an existing, older project, you may need to enable the OIDC token feature in your project settings.
   1. visit the project settings page (rightmost tab in your project's dashboard)
   1. search for 'OIDC' in settings
   1. toggle the button under "Secure Backend Access with OIDC Federation" to Enabled and click the "Save" button
1. See [this page](https://vercel.com/docs/ai-gateway/pricing) to learn how AI Gateway billing works 

## Authors

This repository is maintained by the [Vercel](https://vercel.com) team and community contributors. 

Contributions are welcome! Feel free to open issues or submit pull requests to enhance functionality or fix bugs.

## Related Templates

### [Fal Image Generator](https://vercel.com/templates/next.js/fal-image-generator)

An open-source AI image generator built with Next.js, the AI SDK, and Fal.

### [Vercel x Groq Chatbot](https://vercel.com/templates/next.js/vercel-x-groq-chatbot)

An open-source AI chatbot built with Next.js, the AI SDK, and Groq.

### [Vercel AI Gateway Demo](https://vercel.com/templates/next.js/vercel-ai-gateway-demo)

An open-source AI chatbot built with Next.js, the AI SDK, and the AI Gateway.

---

## Additional documentation

The [Vercel Knowledge Base](https://vercel.com/kb) contains guides and answers to common questions about Vercel, including deployment, framework configuration, domains, caching, and troubleshooting.