A Tour of MEAN Stack Boilerplate, Part 2

In part one we:

  • briefly described the MEAN stack
  • reviewed the prerequisite knowledge
  • chose an established MEAN stack boilerplate
  • set up the development environment
  • examined the boilerplate example app in the browser

In this part we will look inside the boilerplate's root, and explore the only javascript in the root directory, server.js.

The Directory Structure

The boilerplate's root directory should look like this inside:

  • app/
  • lib/
  • node_modules/
  • test/
  • bower.json
  • Gruntfile.js
  • karma.conf.js
  • karme-e2e.conf.js
  • package.json
  • server.js

Your frontend files will live in the app directory. We'll explore the frontend last.

Most of your backend code and configuration will live in the lib directory.

The node_modules directory contains our node modules. We will not be exploring this directory in this exercise.

Our tests are kept in the tests directory. We will not be exploring this directory in this exercise.

Bower is a tool that keeps our frontend package dependencies in order. We will ignore bower.json in this exercise.

Grunt is a tool that runs helpful tasks for us - it scripts dependency checks and tests, and lints our code, among other things. Grunt is powerful, but beyond the scope of this exercise. We will be ignoring Gruntfile.js.

Karma is a testing suite built by the same folks that built AngularJS. Testing is outside the scope of this exercise, so we will be ignoring both karma.conf.js and karma-e2e.conf.js.

Some useful metadata and a list of module depencies are kept in package.json. We won't be modifying or exploring this file in this exercise.

Server.js

server.js is the main script in our backend app. This is the first script that node runs when we launch our app.

I've used RubberCat to annotate server.js. You can read the annotated code here:

server.js

We'll explore the /lib directory in the next post.