Next.js 58: Production Checklist & Deployment
easy⏱ 5 mincoursenextjs
git push, build, deploy
Vercel watches your connected repository. Every push to a branch builds a preview deployment; pushes to main build and promote to production. There is no server to provision — the platform detects Next.js automatically and runs next build for you, then serves the output from its edge network.
# .env.local — never commit this file
DATABASE_URL=postgres://user:pass@host/db
NEXT_PUBLIC_API_URL=https://api.example.com
# Vercel dashboard -> Project -> Settings -> Environment Variables
# mirrors .env.local for Production / Preview / Development
Caching layers, stacked
Production Next.js caches at several levels at once: the Router Cache on the client avoids re-fetching pages you have already visited, the Full Route Cache stores rendered static routes on the server, the Data Cache persists individual fetch results across requests and deploys, and a CDN in front of all of it caches responses close to your users. Together they are why a well-configured app feels instant.
Gate the deploy button
The CHECKLIST array now has its final env item, and allDone is wired to items.every(it => it.done) so Deploy only enables once every item is checked. Uncheck one item and confirm Deploy disables immediately — then check it again and watch the pipeline run.
What you shipped
Scoped CSS, a global theme, optimized images and self-hosted fonts, per-page metadata (static and dynamic), a generated sitemap and robots file, code-split heavy widgets, the right runtime per route, and environment-aware config — that is a genuinely production-ready Next.js app. Nice work getting here.