Deploying a NodeJS application to Heroku

Heroku: a platform that enables developers to build, run, and operate applications entirely in the cloud.

You’ve created a wonderful NodeJS application and have tested it thoroughly. But now what? You have to deploy it somewhere. That’s where Heroku comes into play!
The great thing about Heroku is that it’s extremely easy to deploy your applications to their platform. In just a couple of minutes your app is up and running!

Today you’ll learn how to host your app in the Heroku cloud by creating a simple Express webserver. I encourage you to follow along so you understand each step that is required! 😀

What is Heroku?

Heroku is a cloud platform that lets companies and developers build, deliver and monitor apps.
In other words, you can host your application on their platform and monitor such things as errors, performance and all your databases, just to name a few.

🔗 You can learn more about monitoring apps by reading “How to Monitor Heroku Apps” from their official documentation.

This platform offers a free plan for developers who want to deploy their applications as well as paid plans for advanced projects and enterprises. This free plan allows you to do everything you need in order to deploy your app and make it accessible to everyone.

Prerequisites

Here’s everything you’ll need to successfully deploy a NodeJS application to Heroku:

• Basic knowledge of NodeJS
• Have Git installed on your system and have basic knowledge of it
• Heroku account
• Heroku CLI

The Heroku CLI is required to login and push changes to their servers. What’s great about this is that the CLI is really pleasant to work with!

🔗 Download it from the official website: Heroku CLI

Building our project

Let’s build a simple Express webserver and then deploy it to the platform! Start off by initializing a local Git repository. This is a mandatory step, because all changes will be pushed to Heroku’s Git server.

$ git init

After initializing, create a new NodeJS project using the following command and fill out all fields. If you’re lazy, you can run it with the -y flag, which automatically fills out the required fields for your project.

$ npm init

Good! We want to work with Express in this project, so we need to install it first. You can do this by running the npm install command:

$ npm install express --save

Now it’s time to add a main server file. Make sure the main entry in package.json matches the name of your main file. In my case I’ve simply named it server.js.

👉 See the code in line 4? It’s really important to define the port like this, because Heroku sets the PORT environment variable that you are supposed to bind. The second port enables to you test your application locally on port 3000 before deploying it to Heroku. This port can be anything you want, as long as it is in the valid port range (0 to 65353).

We’ve created our Express webserver, but we still need to instruct Heroku how to handle our project! We can do this in a file called Procfile. Simply create it in your project’s root directory!

Again, make sure that you’re running the correct file!

And we’re done! Ready to go and deploy our application to Heroku’s cloud platform.

Deploying by using the CLI

First, you need to login to your Heroku account you’ve created earlier. You can do this by simply running this command in your terminal:

$ heroku login -i

The -i flag allows you to login directly inside your terminal, otherwise a page in your browser will open. From my experience the browser login takes a lot longer than the one directly from the terminal.

After you’ve successfully logged in, go on by creating a new Heroku application.

$ heroku create <app name>

Keep in mind that Heroku will generate a random name if you don’t supply one yourself! This name will be in the URL of your deployed project, so choose wisely!

If everything worked out fine, you can push changes to their Git server. This process will automatically deploy your application and make it accessible to everyone on the internet. 😄

$ git add .
$ git commit -m "My application"
$ git push heroku master

To see your newly deployed application in the browser yourself you can run this command in your terminal:

$ heroku open

Your application in the web browser

Well done! You’ve just deployed your NodeJS application to Heroku! 👏
This wasn’t so difficult after all, was it? Feel free to ask a question if something isn’t clear to you, I’m here to help!

If you have Instagram, don’t miss my content on there! 🔥