Create a Node server to run the Angular Routing app

In my previous post, we learnt how to create an AngularJs Routing app.

Now we will learn to create a Node server app which will serve the AngularJs Routing app. Lets have a quick focus on Node: Node.js is a platform built on Chrome’s JavaScript runtime for easily building fast and scalable network applications. To learn NodeJs in depth, follow the link.

I assume you have already installed NodeJs at your machine.

Steps to create the Node server is as follows:

  1. Open Command Prompt and paste the below command to install “Express-Generator” at your machine. To learn more about this package, follow the link.
    npm install express-generator -g
    
  2. Now create a new folder named “test-app” anywhere in your drive.
  3. Open Command Prompt and go to your newly created folder path ie: “test-app“.
  4. Run below commands at Command Prompt to create a basic Node-Express app.
    express myapp
    cd myapp
    npm install
    
  5. Create an Angular Routing app. Follow my previous post to create Angular app.
  6. Copy all the files created from my previous post to the “public” folder in “test-app“. Refer below screen:
    2016-11-16_1634
  7. Go to “routes” folder from root and edit the “index.js” file. Replace the code of “index.js” file with below code:
    var express = require('express');
    var router = express.Router();
    
    /* GET home page. */
    router.get('/', function(req, res, next) {
     res.sendFile('/index.html');
    });
    
    module.exports = router;
    
  8. Open Command Prompt and go to the root directory of Node-Express “test-app” app which we created earlier and run the below command.
    npm start
    

    Refer Screen below:

    2016-11-16_1643

     

  9. Go to your browser and open http://localhost:3000/#/. You can see the output as:
    2016-11-16_1650
  10. That’s all.

 

Thanks for reading. 🙂

Advertisements

One thought on “Create a Node server to run the Angular Routing app

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s