Follow-up Guide
Adding AI to Your Website
From Static Resume to Interactive Experience
Turn your personal website into an AI-powered experience. Add a chat widget, job fit assessment, and cost protection—all in an afternoon.
45 min
7 modules
22 parts
Guide Modules
1
Understanding the Architecture
The three components every AI feature needs and how they connect.
5 min•3 parts
2
Setting Up Your AI Context
Creating the data file that tells AI everything about you.
8 min•3 parts
3
Creating the Chat API Route
Building a Next.js API route that connects to OpenRouter.
8 min•3 parts
4
Building the Fit Assessment
A job-matching tool for recruiters to evaluate candidate fit.
8 min•3 parts
5
Cost Protection
Rate limiting, conversation caps, and friendly messages.
8 min•4 parts
6
The Candidate Page UI
Making AI features visible and approachable.
5 min•3 parts
7
Deployment & Testing
Environment variables, testing checklist, and cost monitoring.
5 min•3 parts
What You'll Build
- ✓AI Chat Widget that answers questions about your background
- ✓Fit Assessment tool for recruiters to evaluate job match
- ✓Rate limiting and cost protection to prevent runaway API costs
- ✓Friendly messages that convert rate-limited users into email leads
Prerequisite: This guide assumes you've completed Your Website in an Afternoon or have an existing Next.js site deployed on Vercel.