Going live on Vercel
Today Mangrove Kitchen leaves your laptop. You connect the GitHub repository to Vercel, give it the environment variables, point Supabase sign-in at the live address, and practise the two moves every owner needs: redeploy and roll back.
By the end you can
- Import a GitHub repository into Vercel and set its environment variables
- Update Supabase's Site URL and Redirect URLs for the live address
- Use preview links, read the logs and roll back a bad deploy
- Run a launch checklist and handle a leaked key
The everyday picture
A tailor sews at home, fits each new design on a dummy in the back room, and only then puts it in the shop window. If a customer finds a loose seam, the old design goes back in the window while the new one is fixed.
Your laptop is the home workshop, a preview link is the back room, production is the shop window, and a rollback puts the old design back.
Import, add variables, deploy
Vercel builds your site from GitHub and serves it. Screens as of 2026; menus move, so look for the named setting.
- Sign in to Vercel with GitHub. Click Add New, then Project.
- Find your repository under Import Git Repository and click Import. If it is missing, give Vercel access to that one repository when GitHub asks.
- Vercel detects Next.js. Leave the build settings as they are.
- Open Environment Variables and add the three names from your
.env.local, typing the values from your password manager or the Supabase dashboard. - Click Deploy. In a minute or two you get an address like
mangrove-kitchen.vercel.app.
Each variable can apply to Production, Preview and Development. Tick Production and Preview for all three. Remember the rule from lw-04: the secret key never gets a NEXT_PUBLIC_ name.
A variable is read when a deployment is built. So after changing one, redeploy: open Deployments, the latest one, the three-dot menu, then Redeploy.
Quick check
You fix a typo in NEXT_PUBLIC_SUPABASE_URL in Vercel's settings. Ten minutes later the live site still fails the same way. Why?
Variables are read into a deployment when it is built, so the live one keeps the old value until you redeploy. Putting the value in the repository is never needed and, for secrets, a leak.