Skip to main content

Documentation Index

Fetch the complete documentation index at: https://help.helloazhenweb.top/llms.txt

Use this file to discover all available pages before exploring further.

Vercel is the recommended hosting platform for Birthday Wall because it is purpose-built for Next.js, handles the build and runtime automatically, and offers a generous free hobby plan that is more than sufficient for a personal birthday site. This page walks you through every step from GitHub push to live URL.

​
Local development

Before deploying, you can run Birthday Wall locally to verify your configuration: 
npm install
npm run dev
The dev server starts at http://localhost:3000. To test a production build locally before pushing: 
npm run build && npm run start
If the build succeeds locally with your .env.local in place, the Vercel deployment will succeed too.

​
Deploying to Vercel

1

Push your fork to GitHub

Make sure your repository is pushed to GitHub (or GitLab / Bitbucket — Vercel supports all three). Vercel needs access to the repository to pull source code and set up automatic deployments.
git add .
git commit -m "initial setup"
git push origin main
2

Import the repository into Vercel

  1. Log in to vercel.com and click Add New… → Project.
  2. Under Import Git Repository, click Continue with GitHub (or your Git provider) and authorize Vercel if prompted.
  3. Find your Birthday Wall repository in the list and click Import.
3

Confirm the framework preset

Vercel automatically detects Next.js projects and sets the correct build configuration:
  • Framework Preset: Next.js
  • Build Command: next build
  • Output Directory: .next
  • Install Command: npm install
You do not need to change any of these settings.
4

Add environment variables

Before clicking Deploy, scroll down to the Environment Variables section and add all five required variables:
VariableValue
NEXT_PUBLIC_SUPABASE_URLYour Supabase project URL
NEXT_PUBLIC_SUPABASE_ANON_KEYYour Supabase anon key
SUPABASE_SERVICE_ROLE_KEYYour Supabase service role key
NEXT_PUBLIC_SITE_URLLeave as a placeholder for now — you will update it after the first deploy
ADMIN_PASSWORDYour chosen admin panel password
See the environment variables page for descriptions of each variable and where to find the Supabase values.
5

Deploy

Click Deploy. Vercel clones your repository, runs npm install, then next build, and publishes the result. The first build typically takes two to three minutes.When the deployment finishes, Vercel shows a Congratulations screen with your live URL (e.g. https://birthday-wall-abc123.vercel.app).
6

Set NEXT_PUBLIC_SITE_URL and redeploy

Copy the production URL Vercel just assigned to your project. Then:
  1. Go to Project Settings → Environment Variables.
  2. Edit NEXT_PUBLIC_SITE_URL and paste the production URL as its value.
  3. Trigger a redeployment: go to the Deployments tab, find the latest deployment, click the … menu, and select Redeploy.
This ensures auth redirects and any absolute URL generation point to your actual domain.
7

(Optional) Add a custom domain

If you want the site to live at a custom domain (e.g. happy-birthday-alex.com):
  1. In your Vercel project, go to Settings → Domains.
  2. Enter your domain name and click Add.
  3. Follow the instructions to add the DNS records at your domain registrar (Vercel provides the exact records to create).
  4. Update NEXT_PUBLIC_SITE_URL to your custom domain and redeploy.
Vercel automatically provisions and renews a TLS certificate for your domain.

​
Automatic deployments

Once your project is connected to GitHub, Vercel automatically deploys every push to the main branch as a new production deployment. Every push to other branches gets a unique preview URL, so you can review changes before they go live.

​
Admin subdomain (optional)

Birthday Wall supports an optional admin subdomain. Requests to admin.<your-domain> are automatically routed to the /admin panel. If you want to access the admin panel via a subdomain:
  1. In Vercel, go to Settings → Domains.
  2. Add admin.<your-domain> as an additional domain and follow the DNS instructions.
The rewrite happens automatically — no code changes are required.
The free Vercel hobby plan is fully sufficient for a personal birthday site. There are no bandwidth or build minute concerns for typical personal use.