NodeJS with EJS Template engine

In my last post I explained, how to expose data using NodeJS. In this post I will explain how to render those data using EJS template engine.
First you have to install EJS using npm. Use following command for that.

Then package.json file should look like below.

In ExpressJS you should configure EJS as default template engine. Also set view folder like below.

In the student.server.controller, instead of returning JSON result, now you should return EJS view.

Add index.ejs file into view folder and content should be like below.

Run node server command and browse http://localhost:3000/. Then the page will display like

We can use Bootstrap for style the view. To add Bootstrap for the project, we will use Bower. Bower is a client side package management tool. First add bower.json file by run following command. You need to include that file into Visual Studio Project.

Create a folder called public and add lib folder into that. This public folder will contain all the files which can access from outside world.

We will have to change default installation path for bower packages. We will install all bower packages into public/lib folder. Configuring the Bower installation process is done using a dedicated configuration file called .bowerrc. Enter notepad .bowerrc command and save the file in the project folder.

Content of that file should look like below.

Using command prompt add Bootstrap library.

This will change bower.json file and add boostrap into lib folder.

Now change index.ejs file like below.

Refresh your browser window. You will see a page like below.