COMP 20: Web Programming

Web Applications with Node.js + Express

The Limitations of Client-Side

Server-Side

A Web Application: The Big Ideas

General Anatomy and Structure of a Web Application

That Was Then...

This is now...

Node.js

Express

Tutorial Using Node.js, Express, and Heroku (with code ready for MongoDB)

  1. On your computer or virtual machine, run mkdir node-example. This will create a new folder for your first server-side web application. DO NOT DO THIS IN YOUR PRIVATE GITHUB REPOSITORY!
  2. Run cd node-example
  3. In the node-example folder, create a new file named server.js that contains the following:
    // Express initialization
    var express = require('express');
    var app = express();
    
    // Mongo initialization, setting up a connection to a MongoDB  (on Heroku or localhost)
    /*var mongoUri = process.env.MONGOLAB_URI ||
      process.env.MONGOHQ_URL ||
      'mongodb://localhost/whereintheworld'; // comp20 is the name of the database we are using in MongoDB
    var mongo = require('mongodb');
    var db = mongo.Db.connect(mongoUri, function (error, databaseConnection) {
      db = databaseConnection;
    });*/
    
    app.get('/', function (request, response) {
      response.set('Content-Type', 'text/html');
      response.send('<p>Hey, it works!</p>');
    });
    
    
    // Oh joy! http://stackoverflow.com/questions/15693192/heroku-node-js-error-web-process-failed-to-bind-to-port-within-60-seconds-of
    app.listen(process.env.PORT || 3000);
    
  4. In the node-example folder, create a new file named package.json that contains the following:
    {
            "name": "node-example",
            "version": "0.0.1",
            "dependencies": {
                    "express": "latest",
                    "mongodb": "latest",
                    "body-parser": "latest"
            }
    }
    
  5. In the node-example folder, create a new file named Procfile that contains the following line: web: node server.js. This file is required for Heroku to run your web application and server.
  6. Create a README file README.md
  7. Run npm install. This will install all dependencies and libraries required for your Node.js web application as specified in your package.json file.
  8. To test your web application and server, run node server.js (or nodejs server.js on the virtual machine I provided), then go to http://localhost:3000/ on your web browser.
  9. Set up your folder as a Git repository. Inside node-example, run git init. Then commit and add the files via git add .; git commit -m 'First';.
  10. Set up your web application for Heroku by running heroku create inside node-example. In order for this to work correctly, you must do the above (git init) first!
  11. Push your web application to Heroku by running git push heroku master.
  12. Run heroku ps:scale web=1 to spin up one server for your web application.
  13. Run heroku open to open your web browser and go to your web application on Heroku.

If you receive an "Application Error", run heroku logs to see what went wrong.