Environment variables

What are Environment Variables?

Environment variables are key-value pairs that configure your application without hardcoding sensitive information in your source code.

When to Use Environment Variables

• API keys and secrets
• Database connection strings
• Third-party service credentials
• Feature flags
• Configuration that differs between environments

Adding Environment Variables

1. Navigate to your project settings
2. Click "Environment Variables"
3. Click "Add Variable"
4. Enter the key and value
5. Select which environments should have this variable (production, preview, development)
6. Save changes

Accessing Environment Variables in Code

Node.js

const apiKey = process.env.API_KEY;
const dbUrl = process.env.DATABASE_URL;

Next.js (Client-side)

// Must be prefixed with NEXT_PUBLIC_
const publicKey = process.env.NEXT_PUBLIC_API_KEY;

React (Vite)

// Must be prefixed with VITE_
const apiUrl = import.meta.env.VITE_API_URL;

Best Practices

• Never commit secrets: Add .env to .gitignore
• Use descriptive names: DATABASE_URL not DB
• Document required variables: Create a .env.example file
• Use different values per environment: Development, staging, and production should have separate configurations
• Rotate secrets regularly: Update API keys and passwords periodically

Environment-Specific Variables

Set different values for each environment:

• Production: Live API keys, production database
• Preview: Test API keys, staging database
• Development: Local development values

Updating Variables

When you update environment variables, you need to redeploy for changes to take effect.