The Power of Environment Variables in JavaScript

In our wild journey through JavaScript development, we encounter a variety of tools and best practices that aid in making our work more efficient and secure.

Among these, one often undervalued tool is the environment variable.

Why are they so crucial, and how can we use them? Let’s dig in!

What Are Environment Variables and Why Should We Care?

Environment variables are dynamic-named values that can affect the way running processes will behave on a computer. These variables exist in every operating system, and in JavaScript development, they often store system configuration values.

Why should we care about them? Let me tell you a story.

Imagine a scenario where a developer was engrossed in a project. The project’s goal was to facilitate communication with users by sending emails.

The developer, in a moment of oversight, hardcoded the email service’s API key directly into the codebase.

To make matters worse, they then uploaded this code to a public GitHub repository.

The morning after, their inbox was graced by a rather stern email from their service provider. Someone, armed with the exposed API key, had attempted to misuse it.

It was this jarring incident that highlighted the significant lesson of never exposing sensitive information in a public sphere. The developer learned the hard way about the importance of handling sensitive information with care.

Never exposing sensitive information.

The Role of Environment Variables

Environment variables allow us to manage variables outside of our application’s code. They serve multiple purposes, with the main ones being:

1. Security: Store sensitive data such as database passwords, API keys, or any secret that our application needs to function correctly. This prevents exposing our sensitive data publicly.
2. Project Configuration: Manage settings between different environments like development, staging, and production. Each environment might have different databases, URLs, or activated services.

Let’s dive deeper into these two use cases with some examples.

Security

Consider an application that uses a database. Typically, you’d have a configuration similar to this:

const dbUser = 'username';
const dbPassword = 'password';
const dbName = 'database';

const db = `mongodb://${dbUser}:${dbPassword}@localhost:27017/${dbName}`;

The problem here is that the username and password are hardcoded.

If this code is pushed to a public repository, anyone can see these values.

Instead, we can use environment variables:

const dbUser = process.env.DB_USER;
const dbPassword = process.env.DB_PASSWORD;
const dbName = process.env.DB_NAME;

const db = `mongodb://${dbUser}:${dbPassword}@localhost:27017/${dbName}`;

Now, our sensitive data is secure. You can set the environment variables in your server and no one else can see them.

Project Configuration

Consider a scenario where you have a different database for development and production.

Instead of manually changing the code every time you want to switch environments, you can use an environment variable:

const dbName = process.env.NODE_ENV === 'production' ? 'prodDB' : 'devDB';

const db = `mongodb://${dbUser}:${dbPassword}@localhost:27017/${dbName}`;

// Or directly

const dbName = process.env.DB_NAME;

const db = `mongodb://${dbUser}:${dbPassword}@localhost:27017/${dbName}`;

In this scenario, the code automatically picks the correct database based on the NODE_ENV variable.

Introducing npm dotenv

While managing environment variables directly from the operating system is feasible, it can become cumbersome.

That’s where npm packages like dotenv come in. dotenv allows you to store your environment variables in a .env file.

Let’s install it:

npm install dotenv

Then, create a .env file in your project root:

DB_USER=username
DB_PASSWORD=password
DB_NAME=database
NODE_ENV=development

Now, at the top of your JavaScript file, you can load these variables:

require('dotenv').config();

const dbUser = process.env.DB_USER;
const dbPassword = process.env.DB_PASSWORD;
const dbName = process.env.DB_NAME;

const db = `mongodb://${dbUser}:${dbPassword}@localhost:27017/${dbName}`;

The .env file should not be pushed to public repositories. So, ensure to add .env to your .gitignore file.

Wrapping Up: The Magic of Environment Variables

Environment variables help to keep our sensitive information secure and our configuration management effortless.

The dotenv package is a powerful tool that simplifies working with environment variables, enhancing our code organization and security.

Remember, in programming, it’s not just about getting things done, but also about how we do them. Leveraging environment variables is a crucial step toward maintaining a secure, efficient, and scalable codebase.

1. Node.js Process Env Documentation: The official Node.js documentation on using process.env for environment variables.
2. NPM dotenv Package: The official npm package page for dotenv where you can learn more about its installation and usage.
3. 12 Factor App: 12 Factor App is a methodology for building software-as-a-service applications. It has a dedicated section for configuration which reinforces the usage of environment variables.

Enjoyed the read? For more on Web Development, JavaScript, Next.js, Cybersecurity, and Blockchain, check out my other articles here:

If you have questions or feedback, don’t hesitate to reach out at [email protected] or in the comments section.

[Disclosure: Every article I pen is a fusion of my ideas and the supportive capabilities of artificial intelligence. While AI assists in refining and elaborating, the core thoughts and concepts stem from my perspective and knowledge. To know more about my creative process, read this article.]

Stackademic

Thank you for reading until the end. Before you go:

• Please consider clapping and following the writer! 👏
• Follow us on Twitter(X), LinkedIn, and YouTube.
• Visit Stackademic.com to find out more about how we are democratizing free programming education around the world.