Heroku Getting Started Tutorial

Posted in Tutorials

Tweet This Share on Facebook Bookmark on Delicious Digg this Submit to Reddit

Heroku is a new type of “webhost” and here is a tutorial on getting started.  Heroku is different from your traditional shared webhosting such as BlueHost, HostGater, Dreamhost, etc.   Heroku is a cloud platform as a service (PaaS) that supports several various programming languages such as nodejs, python, php, etc.  You are billed based on the number of “dynos” you use.  You no longer put files on the server using FTP, you use GIT.

1.  You have to sign up for a Heroku account.  As of this writing in December 2013, you can sign up for free without any credit card as long as you do not exceed one dyno of usage.

2.  Once you login to Heroku dashboard, download and install the Heroku toolbelt.

heroku getting started

Heroku getting started

2.  Then you have to create a new app (click as shown above) and give it an app name.  Point your browser to <yourappname>.herokuapp.com and you should see a welcome page for your new app.  Replace <yourappname> with your app name.

new heroku app

new heroku app

3.  Once Heroku toolbelt has been installed, you can type heroku at the command prompt.  This provides help.  This example tutorial shows in Windows.

heroku command prompt

heroku command prompt

4.  But if you are on Windows you don’t want to use the command prompt because it won’t have access to ssh-keygen to generate a public key.  Type exit to exit the command prompt.  ssh-keygen is a part of Git for Windows

5.  If you are on Windows, installing Heroku toolbelt will also install “Git Bash” whose icon you should see on your desktop.  (The shortcut icon points to “C:\Program Files (x86)\Git\bin\sh.exe” –login -i).   Open that now and change directory (with the cd command) to the location on your computer where you will be working on your app.    In our example, we will work in c:\tutorials\sampleapp\  (Hereafter known as our working folder)

So we  do…

cd /c/tutorials/sampleapp

Note that these are forward slashes.  Alternatively, you can right-click on the folder in Explorer and select “Git Bash” from the context menu.

6.  Login to heroku on in the Git bash by typing …

heroku login

It will ask for your email and Heroku password.  And then ask if you want to add SSH-Key.  Type “y” for yes.   You can view or revoke the SSH keys added by going to Account in Heroku dashboard.

7. In git bash, clone a copy of your newly created app that is on heroku to your local machine by typing …

git clone <git_url> -o heroku

where <git_url> is the git URL of your app as found in Heroku dashboard under the settings for your app.  It typically starts with git@heroku.com.  The git clone command will make a clone of the git repository that is on heroku to your local machine.   The git clone command also sets up a “remote” repository.  The -o flag with “heroku” after it will name this remote “heroku” which is a short-hand alias that you can use instead of typing in the full git_url.  If you omit the “-o heroku”, git will call the remote “origin”.

This command may say that you appear to have cloned an empty repository and that permanently added the RSA host key to the list of known hosts.  That’s fine.  It also created an app folder (named like your app name) within our working folder.  So if we had named our app “example”, then it would have created a folder at c:\tutorials\sampleapp\example\   where “example” is known as are app folder.   CD to change to the app folder now.

8.  Put a simple index.php file in our app folder that looks like this …

sample html5

sample html5

9.  Now we are ready to put this up to Heroku.  In git bash, while in the app folder (in our case the “example” folder) then type …

git add .

Note the dot at the end of the command indicates “current directory”.  This adds all your changed file in current directory for staging.  Type “git status” and you will see.

10.  We are now ready to commit our changes to the repository.  Type …

git commit -m “Added index page”

If you get error message saying “Please tell me who you are”, follow its instruction of configuring your email address by …

git config --global user.email "you@example.com"
git config --global user.name "Your Name"

Replace those values in quotes with your values. You can omit the –global if you want this to apply only to this repository.  Use the same email that you signed up with Heroku.

Note that “git commit” only commits to your local repository on your hard disk.  It does not affect the remote repository on the Heroku server.

11.  After the commit, to affect the files on the Heroku server you have to type …

git push heroku master

This git command will push the commits that you have made locally on the master branch to the remote named “heroku”. You could have equivalently done …

git push <git_url> master

But since you had named the <git_url> as a remote named “heroku”, the use of the short-hand alias works.  To see the remotes and their associated URLs, type “git remote -v”.

The reason we used index.php instead of index.html is because the PHP extension will tell heroku what type of app we are uploading.  Heroku will setup the server to match that app.

12.  Doing a “git status” should show “nothing to commit, working directory clean”.

13.  Run “heroku ps:scale web=1” to tell heroku to run this app with the smallest amount of dyno (which is 1).  See status of this by “heroku ps”.  To disable your app, allocate no resource by running “heroku ps:scale web=0”.  The application error screen will be shown to the users.

14. Refresh your browser that is pointing to your app URL and you should see your new file “Hello World Sample HTML”.  Or you can type “heroku open” for it to bring up the browser for you.

15. Typing exit in the git bash will exit.