What is Next.js environment variables?
Why Interviewers Ask This
Foundational questions like this help interviewers calibrate the rest of the interview. A confident, accurate answer signals that you have solid Next.js basics — a prerequisite for any developer role.
Answer
Next.js has a specific system for managing environment variables across different environments. Files: .env.local — local development, git-ignored (secrets); .env.development — development environment; .env.production — production environment; .env — all environments. Precedence (highest to lowest): .env.local → .env.development/.env.production → .env. Server-only variables: only accessible in Server Components, API routes, middleware, and server-side functions. Never exposed to the browser: DATABASE_URL=postgres://...; process.env.DATABASE_URL. Public (browser-accessible) variables: prefix with NEXT_PUBLIC_ — bundled into client-side JavaScript: NEXT_PUBLIC_API_URL=https://api.example.com; process.env.NEXT_PUBLIC_API_URL in both server and client code. Important security note: never put secrets in NEXT_PUBLIC_ variables — they appear in the JavaScript bundle and are visible to anyone. Type safety with @t3-oss/env-nextjs: validate environment variables at build time with Zod schemas — fail build if required vars are missing. In next.config.js env option: hardcode build-time values in config (not recommended for secrets — use .env instead). Runtime env (edge/serverless): use platform-specific secret management (Vercel Environment Variables, AWS Secrets Manager) for production secrets.
Pro Tip
Back up your answer with a specific project or situation. Saying 'In my last Next.js project, I used this when...' immediately makes your answer more credible and memorable.