Deploying with Heroku

Learn how to push your application up to the interwebs for all to adore and hack.

Scroll down...




As you progress through your learning journey, you are going to build a lot of practice applications. Instead of only running these applications off of localhost:3000, it can be fun to host them on the web so that you can share them with friends, or perhaps turn your "Hello, World" app into a thriving business.\

Heroku is an ideal platform for deploying your hobby applications. It's possible to deploy applications with just a couple of terminal commands, and their free tier is perfectly acceptable for hosting portfolio applications. In this lesson, we will take a look at how to set up an account with Heroku and deploy our very basic Express application.

Getting Set Up with Heroku

Here's how you should get started.

  1. First, you'll need to sign up for a free account.
  2. Then you'll need to download the Heroku Command Line Interface.
  3. Run heroku login from the command line and enter your credentials when prompted.

Deploying a Basic Application

And here's how to push our basic Express application up to Heroku.

  1. Initialize a Git repository (git init) for your project, if one doesn't already exist.
  2. cd in the directory and run npm init
  3. The result of running npm init is a package.json file (more details here). This is a list of all the installed 3rd party plugins/dependencies of your project alongside some commands to start the application, test it, etc. Open it and add a start script to your package.json file.
// Add start to your `scripts` key
  // ...
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "start": "node index.js"
  // ...
  1. Update your call listen to check for Heroku's port environment variable (here's a link to what process.env is).
const port = process.env.PORT || '3000'

  1. Commit these changes.
  2. Run heroku create. This will create an empty application on Heroku and add it to your git remotes.
  3. Run git push heroku master. This pushes up to the newly added git remote.
  4. Run heroku open. This will open your application up in your browser.

Wrapping Up

Hopefully, everything has gone swimmingly for you—though if you have run into any strange problems, Heroku's Getting Started docs are very helpful. Now that you're set up with Heroku, you will only need to call git push heroku master whenever you'd like to update the deployed site with your latest changes. Isn't deployment thrilling?

Sign up to track your progress for free

There are ( ) additional resources for this lesson. Check them out!

There are no additional resources for this lesson just yet!

Sorry, comments aren't active just yet!

Next Lesson: Demo: Odin and Friends