How to Install Heroku and Deploy a Static Website on Ubuntu?
Heroku is a cloud platform that provides a platform as a service(PAAS) to deploy either static or dynamic websites. Heroku is managed by Salesforce. Heroku allows CI/CD, code rollbacks, automatic deploys, Github integration, app metrics, and much more. Heroku allows building, running, and deploying applications on the web. It supports several programming languages and is hence widely popular.
In this article, we will install git and Heroku and then deploy a static site. A static site is a site that doesn’t have a backend. Our site will contain a simple index.js file only. We will require Node.js as Heroku requires but we wouldn’t process any data.
Installation of Herkoku
Step 1: Install git in your system
sudo apt-get install git -y
The output is as follows:
Step 2: Register on Heroku
Register on Heroku. It is available for free as well as has pricing options. To register, proceed to https://www.heroku.com/.
On registration, proceed to the next step.
Step 3: Install Herkou CLI.
Install Heroku CLI in Ubuntu as follows:
sudo snap install --classic heroku
Deploy website on Heroku
In this section, we are going to deploy our website.
Step 1: Create a folder and name it mywebsite.
Then open the terminal in the current directory and enter
npm init -y
After that create a file index.js, and enter the following code.
In the package.json, we need to call the index.js file. So modify it as follows:
The project structure is as follows
Step 2: Log in to your Heroku account,
It will open your browser where you will have to enter your email and password.
Step 3: Create a new application using the Heroku CLI.
“heroku create” creates a new application on your account so we can use it to deploy our application.
git init heroku create -a mygeekswebsite
Use the following command to confirm that Heroku is used.
git remote -v
Step 4: Deploy your website
Add the files to the git and commit them
git add git commit -m "message"
Use the following command to deploy
git push heroku main
After a successful deployment, the message appears as follows:
Follow your website link as provided and the output in the browser is as follows: