You've grasped some of the core LLM concepts. Now for the exciting part: setting up your local development environment and getting hands-on with the Vercel AI SDK. This is where you really get your hands dirty and prepare to build the cool AI features we've been talking about, like automatic summarization and building intelligent chatbots.
You will get the starter project running locally, securely configure the Vercel AI Gateway, and confirm everything works so you're ready to start coding AI in the next lesson.
Let's go!
Prerequisites Check
Before starting, ensure you have Git, Node.js (v20+), and pnpm installed. If you missed any, check the prerequisites section at the beginning of the course for installation links.
First, grab the starter project code. This repository contains all the files and setup needed for the course. Open your terminal (or command prompt) and run this command to clone it:
bash
This copies the project files to your computer.
Now, move into the project directory you just cloned. Use the cd (change directory) command:
bash
Your terminal prompt should now show you're inside the build-an-ai-app-starter-sep-25 folder.
Next, install the necessary libraries (AI SDK, Next.js, etc.). This project uses pnpm for fast and efficient package management. Run:
bash
Using npm or Yarn?
While
pnpmis recommended for this project (due to the lockfile), you can try usingnpm installoryarn install. Be aware you might encounter slight differences if dependency versions vary. To install pnpm globally, run:npm install -g pnpm.
This might take a minute or two.
AI models are accessed through API endpoints and typically this means you need to setup individual accounts and secure API keys for each provider. The Vercel AI Gateway simplifies this and allows you to access models from multiple providers through a single endpoint.
Why Use AI Gateway?
- Free $5 credit: Get started without needing an OpenAI account or dealing with their credit requirements
- One endpoint, multiple providers: Switch between OpenAI, Anthropic, Google, and others without code changes
- Automatic failover: If one provider fails, requests automatically retry with another
- Cost tracking: Monitor spending across all providers in one place
- Rate limit handling: Built-in retry logic and request queuing
- Bring your own keys: Use your existing provider API keys if needed
You have two options for authentication with the AI Gateway:
This method uses secure OIDC federation and is ideal for projects deployed to Vercel.
1. Install the Vercel CLI
Install the Vercel CLI globally:
bash
This will allow you to use the vc command in your terminal and manage your Vercel projects.
2. Deploy your Project
Deploying your project will both create and deploy your project to Vercel:
bash
Note that if you have an existing project already deployed to Vercel, you can use the vc link command to vc link your project.
3. Enable OIDC and Get your Token
Once your project is deployed, enable OIDC in your project settings:
Then get your token by running:
bash
Check .env.local to see your OIDC token:
bash
OIDC tokens are only valid for 12 hours. You have two options:
- Manual refresh: Run
vc env pullagain to get a new token- Automatic refresh: Use
vc devto run your application locally - it automatically refreshes the OIDC token when it runs
If you prefer using a persistent API key instead of OIDC tokens, you can create one directly in the Vercel dashboard:
1. Create an API Key
2. Configure your Environment
Create or update your .env.local file:
text
Which method should I use?
- OIDC (Option A): Best for production deployments and team projects. More secure but requires token refresh.
- API Key (Option B): Simpler for local development and learning. Persistent but requires careful key management.
Let's verify your setup. The project has a simple script (env-check.ts) to confirm your authentication is configured correctly. Run it:
bash
You should see this in your terminal:
If using OIDC (Option A):
text
If using API Key (Option B):
text
Token/Key Management
- OIDC tokens: Need refreshing every 12 hours. Run
vc env pullagain or usevc devfor automatic refresh- API keys: Persistent and don't expire, but keep them secure and rotate periodically for best security practices
Setup Checklist
env-check.ts shows undefined or errors: Check your .env.local file name (leading dot, no extra extensions). For OIDC, the key name must be VERCEL_OIDC_TOKEN. For API Key, it must be AI_GATEWAY_API_KEY. Ensure you're running the command from the root of the build-an-ai-app-starter-sep-25 directory.node_modules and pnpm-lock.yaml, then run pnpm install again. If issues persist, check your Node.js and pnpm versions or seek help.Congratulations! Your development environment is set up and ready.
Now you'll write and run code that uses the AI SDK to interact with an LLM and perform a practical task: extracting structured data from text. Time to start building.
Mark this chapter as finished to continue
Mark this chapter as finished to continue