Deploy your first app

    In this step, we need to add some code to the file so that we can run the app from a remote server.

    Right now, there is a good chance that the file will look like this:

    At the end of the dependencies": { ... } object, you need to add a comma , so that we can add more code. First let’s add the main keyword:

    1. "main": "app.js",

    Notice the trailing comma? This is because we are going to add more stuff. After that, add in the engines object and the specific engines we need to run this app:

    1. "engines": {
    2.   "node": "0.10.26",
    3.   "npm": "1.4.3"
    4. }

    You should have something that looks like the following:

    1. {
    2.   "name": "application-name",
    3.   "private": true,
    4.   "scripts": {
    5.     "start": "node ./bin/www"
    6.   },
    8.     "express": "~4.0.0",
    9.     "static-favicon": "~1.0.0",
    10.     "morgan": "~1.0.0",
    11.     "cookie-parser": "~1.0.1",
    12.     "body-parser": "~1.0.0",
    13.     "debug": "~0.7.4",
    14.     "jade": "~1.3.0"
    15.   },
    16.   "main": "app.js",
    17.     "node": "0.10.26",
    18.     "npm": "1.4.3"
    19.   }
    20. }

    If at this time you do not have any of the Grunt packages or Bower in the dependenciess object, we need to get that in there.

    Something that you probably don’t have is the ability for the deployed server to run the Grunt tasks. For this we need Grunt-CLI.

    Right about now, you should be looking pretty good.

    Postinstall instructions

    When we deploy the codes to Heroku, we have to tell it to run some commands, basically install the Bower packages and run the Grunt tasks. To do this, we need to add the instructions within the scripts object of the package.json file.

    Directly under the "start": "node ./bin/www", add:

    1. "postinstall": "./node_modules/.bin/bower install && ./node_modules/.bin/grunt"

    There, now we have everything that Heroku needs to install the packages and run the scripts.

    This is a file that Heroku needs in order to start the app.

    1. $ touch Procfile

    Heroku will use this to kick start the app.

    It is important to make this a git repo BEFORE you create the Heroku server. WAIT! Before you go all crazy on the Git, there are some things we need to do.

    You should have a .gitignore file in your repo at this point. open that up and make sure you are ignoring all the node_modules, all the bower_components and anything in the /stylesheets/*.css spectrum.

    1. node_modules
    2. public/stylesheets/*.css
    3. bower_components

    Great. Now you can git init your repo.

    1. $ git add .
    2. $ git commit -m "initial commit"

    It is not required at this time to make this a Github repo, but you may want to do this if you make this a real app.

    This is pretty hard here. Make sure to follow the commands specifically:

    1. $ heroku create <your-app-name>

    Go to that URL and REJOICE!!!!!