Environment variables
Environment variables allow us to parameterize sensitive state, like third party API keys and URLs, without hard coding them into our application code. We will take you through the process of using those variables to create an application with a user login.
- To start, deploy the Begin template below. When prompted give it a cool name!
Make note of the
staging
andproduction
URLs after it is deployed.
- Create three OAuth applications on GitHub following these instructions …this ensures totally isolated systems for
testing
,staging
andproduction
environments
Application name | Homepage URL | Authorization callback URL |
---|---|---|
My App Local | http://localhost:3333 | http://localhost:3333/login |
My App Staging | https://foo-123-staging.begin.app | https://foo-123-staging.begin.app/login |
My App Production | https://foo-123.begin.app | https://foo-123.begin.app/login |
- Set up local development for this project.
# Clone your app repo locally
git clone https://github.com/username/begin-app-project-name.git
# cd into your Begin project dir
cd begin-app-project-name
# Install NPM packages
npm install
- Create a file called
.arc-env
in the root of the project directory and add the GitHub Client ID, GitHub Secret Key and redirect values from the GitHub OAuth apps created in step 2. The Architect Sandbox will load environment variables from the.arc-env
file for local testing only.
These environment variables can be accessed using process.env.YOUR_ENV_VARIABLE
. For example, in the code we make a reference to process.env.GITHUB_CLIENT_ID
which will reference the .arc-env
file. This let's us manage secrets and keys without hard coding them into the application.
# .arc-env
@testing
GITHUB_CLIENT_ID xxx
GITHUB_CLIENT_SECRET xxx
GITHUB_REDIRECT http://localhost:3333/login
⚠️ Do not commit
.arc-env
to revision control. Make sure it is added to your.gitignore
.
- Add the environment variables for
staging
andproduction
on Begin, since they are not committed to the GitHub repo.
To add your environment variables, open Environments
in the left nav of your project's console.
Check out the docs for more documentation on environment variables on Begin.
- Now that the environment variables are set both locally in the
.arc-env
file and on Begin, Proceed to implement OAuth