1. Clone the repo and cd into it
2. Run npm install
3. Run npm start in one terminal tab
4. Run gulp in another terminal tab
5. Go to localhost:1337 in your broswer (Google Chrome for live reload functionality --> See note below)

Note: For live reload functionality install the chrome extension: https://chrome.google.com/webstore/detail/livereload/jnihajbhpnppcggbcgedagnkighmdlei Make sure the extension is running. The small circle of the chrome extension should be filled in when running. Click on it to turn it on and off

This repo is an easy and quick way to get an angular website running. It uses AngularJS and its UI-Router for the front end and NodeJS/ExpressJS for the backend. Gulp is used to compile SCSS, transpile ES6 JS and minify it along with HTML and allow for livereloading. It is essientially, a very simple version of the MEAN stack without MongoDB.

Below is the file structure for this stack. Each state goes in its own folder, and each folder contains the html, controller.js and state.js files. All the scss files go in the scss folder

|--app/
|------browser/
|------|---js/
|------|-------stateName/ --> (each angular state goes in its own folder)
|------|-----------stateName.state.js
|------|-----------stateName.template.html
|------|-----------stateName.template.min.html --> (minified copy of html file, generated by gulp)
|------|-----------stateName.controller.js
|------|---scss/ --> (all the scss files go here. index.scss imports all the other listed files)
|------|-------stateName.scss
|------|-------index.scss
|------server/
|------|---public/ --> (contains the gulp generated css and js files)
|------|-------index.css
|------|-------main.js
|------|---index.html
|------|---index.js --> (runs the ExpressJS server)
|------gulpfile.js
|------package.json

Run the following commands in the ec2 instance (This set of commands only needs to be run in a new instance or if the instance was stopped and is restarted)

export PORT=8080

sudo iptables --insert INPUT --protocol tcp --dport 80 --jump ACCEPT

sudo iptables --insert INPUT --protocol tcp --dport 8080 --jump ACCEPT

sudo iptables --table nat --append PREROUTING --in-interface eth0 --protocol tcp --dport 80 --jump REDIRECT --to-port 8080

sudo service iptables save

To stop the node server first cd into the angular-stack directory. Run forever list to get the PID (Process ID) of the node server. Then run forever stop <PID> replacing <PID> with the PID you got from running forever list. The PID will appear in a column.

If there are multiple processes that are output (more than one row) run forever stop <PID> for each PID that appears to ensure all instances are stopped. Run forever list again to verify that all processes have been terminated.

To start the Node server, first cd to the root of the angular-stack folder, then run

npm start

This will start the node server in the background.

If you make changes to the code base either by pushing commits to github or directly in the container, once you are done making your changes run gulp buildProduction from the root of the angular-stack directory. The changes will then appear. This command copies and bundles files together to reduce file sizes to make them faster to download. Do NOT edit any files ending in .min.html. The above command will automatically generate these files.