A checklist for using Angular Fullstack Generator on Node.JS

When architecting a single-page web application, you have to ensure that you choose a platform that is stable, scalable, maintainable, and easy to deploy.  As a Node.js front-end developer, I have spent a lot of time trying different combinations of front-end technologies that would work well with Node and Express.  A co-worker of mine introduced me to Yeoman, which is a scaffolding tool for modern web apps.  Yeoman basically is composed of 3 very important components for creating web applications:

1.  Yo - the scaffolding component (generators).
2.  Bower - the package manager (something like Nuget).
3.  Grunt - the build and deployment tools.

To get started with Yeoman, just run this on the command line:

npm install -g yo

This automatically installs Yo, Bower and Grunt for you.

I experimented with different Yeoman generators and ended up with one that I like, the Angular Fullstack generator. Of course, it really depends on what kind of web app you want to create.  My goal was to create a single-page app using Node.Js, Express and Angular.  I knew that this was challenging because Express had its own routing mechanism and so does Angular.  For now, here is a checklist to get you started with Angular Fullstack:

1.  Install the angular-fullstack generator on your system.

$ npm install -g generator-angular-fullstack

2. Create your app using the generator.

$ yo angular-fullstack mySinglePageApp

This will ask if you want to install additional components like Bootstrap, Saas, and other Angular modules.

3.   Install the node and bower components.

$ bower install
$ npm install

If you run into permission problems like the error below:

Error: EACCES, permission denied '/Users/gmisa/.config/configstore/update-notifier-yo.yml'

You need to change /Users/gmisa/.config/configstore/update-notifier-yo.yml owner to your user name:
sudo chown yourusername:yourusername /Users/gmisa/.config/configstore/update-notifier-yo.yml

4.  Test out the website

$ grunt serve

This should open the Yeoman test page on port 3000.

Enjoy!  :)