How to deploy Node.js app on Heroku from GitHub ?

Last Updated : 11 May, 2022

In this article, we will be looking at how to deploy your Demo Node.js app to Heroku. At the end of this article, we will have a basic Hello World app running on a public domain that can be accessed by anyone. The Node must be installed on your machine. Refer to this article How to install Node on your machine.We are also going to use Github account.

Step 1: Installing Nodemon and Express Module in the project folder

Installing express module:

npm install express

Installing nodemon module:

npm install nodemon

Step 2: Creating package.json file in the project folder by using npm init command:

These two commands are important for running and dynamically running the code after changes made in your Node.js app respectively.

"start": "node app.js",
"dev": "nodemon app.js"

Configuration of package.json file

{
    "name": "demoapp",
    "version": "1.0.0",
    "description": "",
    "main": "app.js",
    "scripts": {
        "start": "node app.js",
        "dev": "nodemon app.js"
    },
    "author": "",
    "license": "ISC",
    "dependencies": {
        "express": "^4.17.1",
        "nodemon": "^2.0.6"
    }
}

Project structure:

app.js

JavaScript

// Importing express module
const express = require('express');
const app = express();

// Getting Request
app.get('/', (req, res) => {

    // Sending the response
    res.send('Hello World!')
   
    // Ending the response 
    res.end()
})

// Establishing the port 
const PORT = process.env.PORT ||5000;

// Executing the server on given port number
app.listen(PORT, console.log(
  `Server started on port ${PORT}`));

Execution command:

nodemon app.js

Console output:

Browser output: Now, if we open http://localhost:5000/ in your browser, we will see this:

We have just created a basic Node.js app.

Deploying Node.js app

Step 3: Pushing the Node.js app to GitHub: Create a new Repository on GitHub by clicking New Repository on the tab. GitHub will create a repository and also give some instructions to clone the project.

In the command prompt, run the below commands for pushing your project to the new Repository.

git init
git add . 
git commit -m “first commit”
git push — set-upstream origin master
git remote add origin https://github.com/pallavisharma26/DemoApp
git push — set-upstream origin master

Now if you open GitHub and refresh the repository, you should be able to see the code that you have added recently.

Step 4: Deploying the Node.js app to Heroku

Create a free account on Heroku
After completing all processes now login to your account.
Click on the “Create new app”.
Open the Deploy tab and scroll to the “Deployment method” section of the tab.
Select GitHub as a method. It will show a “Connect to GitHub” option where we add provide our GitHub repository. If you are doing it for the first time, Heroku will ask permission to access your GitHub account you have to permit that.Here, you can search for your GitHub repository and click connect for creating a connection.
After that, the Deployment section will show up where you can select pick them up and deploy or Manual Deployment, click Enable Automatic Deploys.

Now we have to tell Heroku that our app is a NodeJS app.
Open the Settings tab scroll down and click "Add buildpack”.

Select NodeJS from the options and click Save changes. Now, go back to the Deploy tab, and click Deploy Branch at the bottom.
Heroku will take the code and host it. Open the Activity tab and there you can see the progress:

Now open the Setting tab scroll and look for Domain. We can see a URL if we copy paste and run in the browser, we can see our Deployed App.

This is a straightforward app, we can deploy any advanced project on Heroku without installing it on our desktop or machine.

Deploying node.js site on Heroku

How to Deploy Django application on Heroku ?

_sh_pallavi

Improve

Article Tags :

How to deploy Node.js app on Heroku from GitHub ?

Similar Reads