Now that we have a basic express web app created, lets go through the project structure.
In the last post we briefly went through the purpose of package.json. Now its time to go through it in bit more detail. As the extension
.json indicates, data in this file is in
json format. Yours should look something like this:
"start": "node ./bin/www"
The name and version fields indicate the project name and version respectively. The field private indicates that this is a private npm project. So, in case you were developing a npm module, this field will determine whether or not to allow you to publicly publish your project. The scripts field contains commands and the respective files that should be executed when the command is called. The two most popular ones here are start and test. As you can see, the express tool automatically generates the start script command and maps it to ./bin/www.
The last thing here is the dependencies field. This contains all the dependencies of your project. The tilda sign (
~) prefixed in the version means that if a newer bug fix version is found then it’ll update it to that automatically. For instance, in our case, the current version of express module is 4.12.2. In case a newer version 4.12.3 is released, the tilda sign means that npm will fetch that version. However, if express 4.13 is released, npm won’t update to that. On the contrary, if the hat sign (
^) was used, npm will update to 4.13 but will hold off for version 5.0.
This file is the central point for configuring the express web server. It defines several things like the view engine, logging levels etc and loads all middleware components (more on that in later posts). You’ll be visiting this file more often than you think once you start developing express web applications.
If you scroll down, you’ll see that this file also loads routes. This is where the server routes are defined. In this case, the route file
index.js is loaded in and all its routes are mapped from the root route (indicated by
/). In the next line it also loads another route file called
users.js, routes of which are mapped from
This directory contains files that define different routes of the web application. You can define routes in multiple files here and then reference them in the
This directory contains all your templates. Since the default templating engine is Jade, you’ll find files with
.jade extension here. You can use one of the other options that express tool provides like ejs or handlebars or you can choose a completely different templating engine as well. Whatever you choose will have to be configured in the
As the name suggests, this directory contains all the public assets. Whatever you place in here can be accessed without authentication as these are the assets that pages normally require to render. Any files here can be referenced from root level. For instance, a stylesheet named
style.css located in stylesheets folder in public directory can be accessed by
/stylesheets/style.css from the web server. You can create as many sub directories as you want without making any configuration changes in
Excellent! Now you know what different parts of an express web app does. In the next post we’ll create our first RESTful web service using Express. Excited?