Back to Documentation
Deployment

Environment Variables

Securely store API keys, secrets, and configuration values. Environment variables are encrypted and available during build time.

1Adding Environment Variables

Add environment variables through the dashboard:

  1. Go to Site Settings > Environment Variables
  2. Click "Add Variable"
  3. Enter a name (e.g., API_KEY)
  4. Enter the value
  5. Choose the environment (Production, Preview, or Both)
  6. Click "Save"

Changes take effect on the next deployment.

2Security

Your environment variables are:

  • Encrypted at rest: Using AES-256 encryption
  • Never logged: Values are redacted in build logs
  • Access controlled: Only team members can view/edit
  • Not in client bundles: Server-side only by default

Warning: Variables prefixed with NEXT_PUBLIC_ or VITE_ are exposed to the browser!

3Framework Prefixes

Different frameworks have different conventions for client-side variables:

Next.js: NEXT_PUBLIC_*
Vite: VITE_*
Create React App: REACT_APP_*
Gatsby: GATSBY_*

4Using in Code

Access environment variables in your code:

// Node.js / Server-side
const apiKey = process.env.API_KEY;

// Next.js (client-side)
const publicKey = process.env.NEXT_PUBLIC_API_KEY;

// Vite (client-side)
const key = import.meta.env.VITE_API_KEY;

5Bulk Import

Import multiple variables from a .env file:

  1. Go to Site Settings > Environment Variables
  2. Click "Import .env"
  3. Paste your .env file contents or upload the file
  4. Review the variables
  5. Click "Import"

Never commit: Add .env to your .gitignore file!