Next.js Environment Variables: Server vs. Browser
Next.js environment variables separate server secrets from public browser config. Use them for API keys or database strings. The key footgun is exposing secrets by forgetting to prefix browser-accessible variables with `NEXT_PUBLIC_`.
Next.js uses environment variables to inject configuration without hardcoding it. The core model is a strict separation: default variables are server-side only, while variables prefixed with `NEXT_PUBLIC_` are exposed to the browser. This is crucial for managing API keys and database URLs. The most common mistake is accidentally exposing a server-side secret to the client by forgetting the required `NEXT_PUBLIC_` prefix, making it visible in the browser's JavaScript bundle.
Read the original → nextjs.org
- #nextjs
- #environment-variables
- #security
- #configuration
Get five bites like this every day.
Tezvyn delivers a daily feed of 60-second tech bites with quizzes to lock in what you learn.