Array
University of Oregon

ToDo App w/ Express

Express will serve pages from a directory defined to be static. We’ll do this by copying your ToDo app and relocating the copy to a static directory.

  1. Duplicate your todo app folder and relocate the copy to ~/Documents/repos/281/projects/Chapter6/app/
  2. In the Chapter6/app/todo/ folder create a new folder named client. The express server uses this as the static directory (see below).
  3. Move Chapter6/app/todo/todo.html to Chapter6/app/todo/client/, and rename it index.html (this makes it the Default Web Page).
  4. Duplicate the express-server.js file from p. 194, and relocate the copy to Chapter6/app/todo/.
  5. In Sublime, open the ~/Documents/repos/281/projects/Chapter6/app/ folder.
  6. express-server.js defines Chapter6/app/todo/client/ to be a static directory.

    P. 194: Any request sent to the server will initially be resolved by the static file directory (client) before it is handed off to our routes. This means that if we have a file called index.html in our client directory and we go to localhost:3000/index.html, it will return the contents of the file. If the file doesn’t exist, it will then check to see if there’s a match among our routes.

  7. Test the Express-powered ToDo app.

    Start your virtual machine, and shell into it.
    On the VM, cd to /home/vagrant/app/todo/, and start the server with this command:
    node express-server.js
    In Chrome, open localhost:3000 or 127.0.0.1:3000.
    Halt the server with the keyboard command, control-c.

Skip to toolbar