Architecture overview
Birthday Wall separates concerns cleanly across two hosted services:
The Next.js App Router handles all page rendering and exposes API routes under
/api/. Server-side routes use the service role Supabase key exclusively — your database credentials are never sent to the browser. Public read operations use the anon key, which is safe to expose.
An optional admin subdomain rewrite lets you access the admin panel at admin.<your-domain> in addition to the default /admin path.
Prerequisites
Before you begin, make sure you have the following:- Node.js 18 or later — required to run and build the Next.js application locally
- A Supabase account — the free tier is sufficient; no credit card required
- A Vercel account — the free hobby plan covers personal birthday sites with no usage concerns
- A GitHub account — Vercel deploys directly from a GitHub repository
Deployment steps
Follow these three pages in order to go from a fresh fork to a live site:1
Create and configure a Supabase project
Create your Supabase project, run the database migrations, and collect your API credentials.Set up Supabase →
2
Set environment variables
Configure the five required environment variables for both local development and your Vercel deployment.Configure environment variables →
3
Deploy to Vercel
Import your repository into Vercel, add the environment variables, and click Deploy.Deploy to Vercel →
The countdown timer, radio, report, and games pages all work without a Supabase connection. Only the wish wall — the
/write page and the messages display — requires a database. If you skip the Supabase setup, those features will return errors but the rest of the site remains fully functional.