Defining a port for our application
In the previous article we talked about defining a PORT
variable used by our application to run on.
Our application needs different PORT
numbers for different environments (development, production, and so on) so we cannot hard code a specific value, like 4000
, but we need to set up an environment variable that may have different values, depending on where our application is running.
Heroku, like many other hosting platforms, will provide an environment variable called PORT
that allows them to manage a port where the application will listen on, and make that port available to us.
We can then use the value of the PORT
variable as the port number for our application, which is accessible through process.env.PORT
.
As a reminder, process
is an object made available by Node, and env
is a property on that object that collects all the environment variables defined for this project.
Instead of hard coding port 4000
into our application, we can use the port
variable instead.
Here's the code:
// index.js
const port = process.env.PORT
server.listen(port, () => {
console.log(`Server Running on port: ${port}`);
});
Here we have defined a port
variable that takes its value from process.env.PORT
.
Note that by convention environment variables are written in uppercase.
Defining the port
If we start our development server now, with yarn server, we notice that the message printed out in the console tells us the port is undefined:
Server Running on port: undefined
That's because we didn't actually define the PORT
environment variable on our system yet.
The way we go about this is: we want to use PORT
if it exists or use a default port if it doesn't.
In our code we use a conditional expression that checks if the PORT
variable is defined. If it is, we can use it; if not, we will use port 4000
.
const port = process.env.PORT ? process.env.PORT : 4000;
Now, when we restart the server, it will detect that process.env.PORT
is undefined, so it will switch to port 4000
as a fallback. The message printed out confirms this fact:
Server Running on port: 4000
Defining environment variables through the .env
file
This pattern of checking if an environment variable named PORT
exists, and of defining a fallback port if it doesn't, works, but a better way to set environment variables is through a file called .env
.
In .env
we could define separate variables for each environment we use if we need to.
Instead of dealing with hard coded port numbers (or other type of variables, like database connection details or passwords), our application simply references .env
so when it's loaded in a different environment it will have access to each specific set of variables automatically.
All this said, we create a .env
file in our project and add the PORT
variable to it. In .env
, variables are listed as variable name, equal sign, variable value, each variable on its own line.
# .env
PORT=4000
Now, all we have to do is set up our application so it can use the .env
file, and consequently, all the environment variables defined in it.
The way we do it is through a Node package called dotenv
that will take care of all the implementation details.
We install dotenv
the usual way with yarn add dotenv
and once installed, we require it into our application:
require('dotenv').config()
Upon requiring, we immediately call its config()
method, and by default dotenv
will look for a .env
file in our project and create environment variables in our system based on what's in that file.
That will allow the environment where the application will be deployed to control what the port number is.
The .env
file is not just for setting the port. In it, we can define variables for database connections, secrets, passwords, and so on.
Ignore .env
In order to prevent putting this file on GitHub, where it would be visible to anyone, we need to add .env
to the .gitignore
file, so it will be ignored when committing our changes to the Git repository.
## .gitignore
# dotenv environment variables file
.env
If we restart our application now, it will be listening to the port defined inside .env
, no matter what the value of PORT
is.
I write daily about web development. If you like this article, feel free to share it with your friends and colleagues.
You can receive articles like this in your inbox by subscribing to my newsletter.
Top comments (0)