Why Environment variables in production in NextJS? - Purpose & Use Cases

The Big Idea

Discover how to keep your secrets safe and your app running smoothly in production!

The Scenario

Imagine deploying your Next.js app and having to change API keys or secrets directly inside your code every time you move from development to production.

The Problem

Hardcoding secrets is risky and error-prone. You might accidentally expose sensitive data or forget to update values, causing your app to break or leak information.

The Solution

Environment variables let you keep secrets and settings outside your code, safely switching values depending on where your app runs, without touching the source files.

Before vs After

✗ Before

const apiKey = 'my-secret-key'; // changes needed for prod

✓ After

const apiKey = process.env.API_KEY; // set differently per environment

What It Enables

You can securely manage secrets and configuration for different environments without changing your code.

Real Life Example

When deploying your Next.js app to Vercel, you set production API keys in the dashboard, so your app uses the right keys automatically without code changes.

Key Takeaways

Hardcoding secrets risks security and causes errors.

Environment variables separate config from code safely.

This makes deploying to production smooth and secure.