Core Concepts
Environment Variables
Managing environment variables in Webiny projects.
WHAT YOU'LL LEARN
- How to use environment variables in Webiny - Application-specific variable prefixes - Best practices for sensitive data
Overview
Environment variables in Webiny are optional for most scenarios. When needed, they follow a prefix-based system that ensures variables are only available to the appropriate application. This prevents accidental exposure of sensitive data between applications.
Application Prefixes
Webiny uses prefixes to route variables to specific applications:
WEBINY_ADMIN_- Variables for the Admin applicationWEBINY_API_- Variables for the API application
Usage
Setting Variables
Create a .env file in your project root:
.env
# Admin application variables
WEBINY_ADMIN_ANALYTICS_ID=UA-123456789
WEBINY_ADMIN_CUSTOM_API_URL=https://api.example.com
WEBINY_ADMIN_FEATURE_FLAGS=dark-mode,beta-features
# API application variables
WEBINY_API_SMTP_HOST=smtp.sendgrid.net
WEBINY_API_SMTP_USER=apikey
WEBINY_API_SMTP_PASS=SG.xxxxx
WEBINY_API_EXTERNAL_SERVICE_KEY=sk_live_xxxxxAccessing Variables
In your extensions, access variables through process.env:
extensions/MyApiExtension.ts
// API extension - only WEBINY_API_ variables available
const smtpConfig = {
host: process.env.WEBINY_API_SMTP_HOST,
user: process.env.WEBINY_API_SMTP_USER,
pass: process.env.WEBINY_API_SMTP_PASS
};
// This would be undefined in API:
console.log(process.env.WEBINY_ADMIN_ANALYTICS_ID); // undefinedextensions/MyAdminExtension.tsx
// Admin extension - only WEBINY_ADMIN_ variables available
const analyticsId = process.env.WEBINY_ADMIN_ANALYTICS_ID;
// This would be undefined in Admin:
console.log(process.env.WEBINY_API_SMTP_HOST); // undefinedTypeScript Support
Add type definitions for your environment variables:
webiny-env.d.ts
declare namespace NodeJS {
interface ProcessEnv {
// Admin variables
WEBINY_ADMIN_ANALYTICS_ID?: string;
WEBINY_ADMIN_CUSTOM_API_URL?: string;
WEBINY_ADMIN_FEATURE_FLAGS?: string;
// API variables
WEBINY_API_SMTP_HOST?: string;
WEBINY_API_SMTP_USER?: string;
WEBINY_API_SMTP_PASS?: string;
WEBINY_API_EXTERNAL_SERVICE_KEY?: string;
}
}Best Practices
Security
- Never commit
.env- Add to.gitignore - Use prefixes - Isolate sensitive data by application
- Rotate secrets - Change production secrets regularly
- Minimal exposure - Only set variables that are needed
Documentation
Create .env.example for team reference:
.env.example
# Analytics Configuration (required)
WEBINY_ADMIN_ANALYTICS_ID=
# Email Service (optional)
WEBINY_API_SMTP_HOST=
WEBINY_API_SMTP_USER=
WEBINY_API_SMTP_PASS=
# External API (required for payments)
WEBINY_API_EXTERNAL_SERVICE_KEY=Variable Naming
Follow consistent naming conventions:
# Good - clear, prefixed, uppercase
WEBINY_API_STRIPE_SECRET_KEY=sk_live_xxx
WEBINY_ADMIN_GOOGLE_MAPS_API_KEY=xxx
# Bad - unclear, no prefix, mixed case
stripeKey=sk_live_xxx
Google_Maps_Key=xxx