Skip to main content

Environment variables

To add an environment variable, you need to declare its value for all three of the local, staging, and production environments.

Adding a new env variable

For front-ends, add to Next.js

For security reasons, Next.js shields the app from accessing environment variables directly. For environment variables we allow to be public, add them to the next.config.js file in the correct project. This is the preferred method since it explicitly defines the list of available env variables:

const config = {
...otherThings,
env: {
MY_VARIABLE: process.env.MY_VARIABLE,
},
};

Next.js also will expose environment variables directly if they're prefixed with NEXT_PUBLIC_. Do not use this method to expose environment variables, since mixing and matching this approach with the above is confusing.

For development, add to .env

Add the variable to .env in the product directory. Do this even if the value is blank in development. These values are checked into Git.

If your local value needs to be specific to you and cannot be checked in, add it to .env.local as well.

For staging, add to render.yaml

Add the variable to the render.yaml section for that product.

For production, add via Render admin

Add the variable to the env variables manually via the Render admin interface. (Production env variables are not synced for security reasons.)

Editing/deleting an env variable

Follow the above steps, except "For production, add via Render admin".

Create a production PR and block it

You need to make sure you add your env variable immediately after the production PR merges. Therefore, you need to be the only person to merge the production PR so you can control the timing.

Create a new production PR and tag with "Do not merge".

File a ticket

File a ticket to remind yourself/others to update the env variable on production immediately after the production PR merges.

After production merges, update via Render admin

If you make the update to env variables in the Render admin before the PR merges, it will redeploy with the new env variable changes (skipping the undefined state where production is deployed with the old env variables)