How to deploy web app on Heroku using GitHub

Standard

Hi Guys..

Here I am going to explain about deploying a web app on heroku cloud platform.

Steps:

  1. Create an account on Heroku
  2. Install Heroku toolbelt on your machine.
  3. Login to your heroku account from heroku toolbelt.
  4. you must have github account and a repository cloned to your local system
  5. Create a ssh key on Github
  6. add ssh key to your heroku account
  7. Create an app on heroku.
  8. add remote heroku git
  9. push code to heroku

Step 1:

First we need to create an account on Heroku website. Sign up is very easy and quick. Good thing is that developer can register for free for basic account and see their website up and running as subdomain on herokuapp.com looks as http://yourdomain.herokuapp.com

Step 2:

Second step is to download and install heroku toolbelt. heroku toolbelt contains the Heroku client, a command-line tool for creating and managing Heroku apps; Foreman, an easy option for running your apps locally; and Git, the revision control system needed for pushing applications to Heroku. For more detail visit dev center.

Step 3:

After downloading heroku client you can login to it from command-promt/shell and Type heroku login

heroku_login1

 

It will promt for the email and password. type accordingly..

heroku_login1

Now you are logged in to your heroku account.

Step 4:

Next step will be to having your github repo at your local system. In my case I have github repo at d/blog/herokudemo

Step 5:

Now we need to push our github code to heroku. To doing so, we need some way to authenticate heroku to read our code from github. Github gives us a way to read repository using SSH keys.

How to create SSH key?

in your command-promt/shell write

ssh-keygen -t rsa

Hit enter. It will ask you to give a file name and password for the keys

heroku_login1

 

Now go to the folder where it has created the SSH key. In my case its in the same present working directory where I am in shell i.e d/blog/herokudemo

Now open herokudemo.pub in notepad and copy the content.

Now, logged in to your github account and select the repository. In this page you will find setting option at the right side of the page.

heroku_login1

Click on setting and then deploy keys then Add deploy key button.

heroku_login1

Add a title and content of your herokudemo.pub. click Add Key

Step 6: Add ssh key to your heroku account

copy your ssh key to C:\Users\[username]\.ssh folder

Run

heroku keys:add

heroku_login1

choose your ssk key and hit enter. It may ask for password that you have choosen at the time of key generation.

Step 7: Create an app on heroku.

Go to heroku dashboard and click on create a new app link.

heroku_login1

Enter a name and click Create App.

Now select newly created app and select setting tab and copy app name. In my case name is heroku-demo-git

Step 8: Add remote heroku git

Open your shell and type

heroku git:remote -a heroku-demo-git

Where heroku-demo-git is your app name copied from the heroku app setting page.

heroku_login1

 

Hit Enter.

It will add remote heroku git to your git repository configuration.

Now move to your project folder and check remote git by

git remote -v

It shows the added remote git.

heroku_login1

Step 9: Push code to heroku

Simply run

git push git@heroku.com:heroku-demo-git.git master

Where git@heroku.com:heroku-demo-git.git  is your heroku git URL from app setting page.

Hit Enter.

heroku_login1

Its Done!! Now visit your newly created app. i.e

http://heroku-demo-git.herokuapp.com/

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s