Environment variables - Webstorm & Nodemon

When creating an app, it is important to create environment variables. In my current project, I am using Webstorm as my ide and the nodemon npm package for my server as well as the passport google Strategy.

Passport is authentication middleware for Node.js. Extremely flexible and modular, a Passport can be unobtrusively dropped into any Express-based web application. A comprehensive set of strategies support authentication using a username and password, Facebook, Twitter, and more.

When using Google as an authenticator, or any 3rd party api, there is a process to create credentials for your app (Client ID, Secret). Once you have those credentials, it's important to keep them secret, keep them safe. In order to do so, there is a method most people use and that is to create environment variables.

An environment variable is a variable whose value is set outside the program, typically through functionality built into the operating system or microservice. An environment variable is made up of a name/value pair, and any number may be created and available for reference at a point in time.

Nodemon is a utility depended on by over 1.5 million projects, that will monitor for any changes in your source and automatically restart your server.

In my project I kept coming up with errors in my google Strategy. The environment variables were not being read.

Creating variables in webstorm, as opposed to sublime or maybe atom, is very different. In either of the latter text editors I mentioned you could simply create a .env file where you would store these important variables. Also installing the dotenv npm package to be able to use these variables is necessary.

Dotenv Dotenv is a zero-dependency module that loads environment variables from a .env file into process.env.

This is where it would get confusing. In webstorm, you can influence the runtime behavior of your app by adding program arguments and environment variables to run/debug configurations.

Add environment variables

1. From the main menu, select Run | Edit Configurations or choose Edit Configurations from the run/debug configurations selector on the toolbar.

2. In the Run/Debug Configurations dialog, select a configuration you want to add the environment variables to.

3. Type the variable name and value: =. If you add several variables, they should be separated with semicolons.

Alternatively, click the Environment
variables icon and add the variable name and value to the User environment variables list.

This will work but just don't forget to click the apply button once done! Also, this will only work when running your app through the ide (not using nodemon).

When using nodemon to run the app, and trying to set environment variables by using the ide's configurations, the env variables will not be read. Instead this is where the dotenv npm package and a .env file comes into play.

According to a post on the JetBrains Hub, "Variables you have defined in run configuration are only available in runtime, they can't be resolved during static code analysis"

Create a .env file in the root directory of your app. Place your variables inside this file as such:

VARIABLE_NAME=VARIABLE_INFORMATION

Next, it's important to require the dotenv package as soon as possible. In my experience it is always on line 1 of my main file (app.js, index.js, etc.).

Now that you have your env variables set in the env file, don't forget to set the .env file in your .gitignore file, you can run nodemon and the variables will be read.