Think Next Generation Technologies

Setting Up Our Angular Application For our Angular application, we will want: 2 different pages (Home, Nerds) A different Angular  controller  for each An Angular  service  for Nerds No page refresh when switching pages Let’s create the files needed for our Angular application. This will be done in  public/js . Here is the application structure for our frontend: - public ----- js ---------- controllers -------------------- MainCtrl.js -------------------- NerdCtrl.js ---------- services -------------------- NerdService.js ---------- app.js ---------- appRoutes.js Once we have created our  controllers ,  services , and  routes , we will combine them all and inject these modules into our main  app.js  file to get everything working together. Angular Controllers We won’t go too far in depth here so let’s just show off all three of our controllers and their code. // public/js/controllers/MainCtrl.js angular . module ( 'Mai

Test Our Server With all the backend (and a tiny frontend piece) in place, let’s start up our server. Go into your console and type: $ node server . js Now in our console we have: Now we can go into our browser and see  http://localhost:8080  in action. So simple, and yet so beautiful. Now let’s get to the frontend single page AngularJS stuff. The Frontend AngularJS With all of our backend work in place, we can focus on the frontend. Our Node backend will send any user that visits our application to our  index.html  file since we’ve defined that in our  catch-all route  ( app.get('*') ). The frontend work will require a few things: Files and libraries brought in by Bower Angular application structure (controllers, services) We will create 3 different pages (Home, Nerds, Geeks) Handle Angular routes using  ngRoute  so there are no page refreshes Make it pretty with Bootstrap Bower and Pulling in Components We will need certain files for our applicatio

Since this is our starter kit for a single page MEAN application, we are going to keep this simple. The entire code for the file is here and it is commented for help understanding. // server.js // modules ================================================= var express = require ( 'express' ) ; var app = express ( ) ; var bodyParser = require ( 'body-parser' ) ; var methodOverride = require ( 'method-override' ) ; // configuration =========================================== // config files var db = require ( './config/db' ) ; // set our port var port = process . env . PORT || 8080 ; // connect to our mongoDB database // (uncomment after you enter in your own credentials in config/db.js) // mongoose.connect(db.url); // get all data/stuff of the body (POST) parameters // parse application/json app . use ( bodyParser . json ( ) ) ; // parse application/vnd.api+json as json app . use ( bodyPar