What Environment variables means
Keeping secrets in environment variables instead of code means they are not exposed in your repository. Hosts like Netlify and Vercel let you set different values for production and previews.
Why it matters for your website
Keeping API keys and passwords out of your code protects them if the code is shared or leaked. Environment variables also let the same code use test settings on a preview and live settings in production. A leaked key can lead to stolen data or surprise bills from misused services.
Example
A boutique's site uses an environment variable for its payment API key. Developers can share the code on GitHub without exposing the key, and previews use a test key instead.
Tips
- Never commit files like .env to your code repository.
- Use separate keys for testing and live sites.
- Rotate any key right away if it was ever exposed.
Common mistakes
- Marking a secret as public so it ends up visible in the browser's JavaScript.
- Sharing keys over email or chat instead of a password manager.
Questions about Environment variables
What is Environment variables?
Settings like API keys and passwords stored outside your code and supplied when the site builds or runs.
Are environment variables secure?
They are safer than hard-coding secrets, but only if access to your hosting and build settings is locked down. Variables exposed to the browser are visible to anyone.
What should I do if I accidentally pushed an API key to GitHub?
Revoke or rotate the key right away at the service that issued it. Deleting the commit is not enough, since the key may already have been copied.
