Elegant JavaScripts: June 2016

NodeJs : Modularizing routes with ExpressJs

In a previous post I described how to do routing in a NodeJs app with ExpressJs. When the application gets bigger separate routes from our main code is always a good practice. Lets take a look at, how to separate the routes from our main code.

First step is create a separate folder for routes and lets name it as "routes".
Next create index.js file in "routes" directory
After this step the project structure will look like this.
```
|--routes
|  |-index.js
|--views
|  |-default.js 
|--app.js
```

Export routes in index.js file.


exports.index = function(req,res){
    res.render('default',{title:"Home"});
}

Require the routes folder in app.js file
```
var routes = require('./routes');
```
Provide methods in index.js file to get method of Express when cofiguring routes
```
app.get('/',routes.index);
```

In this way we can modularize our routes in node.js app and we can have a clean and understandable code.

NodeJs : Use the locals object of Express

In previous post we discussed how to pass information to templates using the render() of Express.

In most of websites there is probably some information that you want to pass to all of the templates. With Express we can use the locals object to pass the information that we want any of our templates to access.

Here is how we use the locals object to pass the information


app.locals.siteTitle="My Website";

Information we passed, In this example siteTitle can be accessed like this in any template.


<!DOCTYPE>
<html>
<head>
      
</head>
<body>
   <h1><%=siteTitle %></h1>
  <p>consectetur adipiscing elit. Cras eget dapibus justo. etra justo.</p>  
</body>
</html>

Using EJS as a template engine with ExpressJs

What is a template engine

Template engine is a tool to separate program-logic and presentation into two independent parts.This makes the development of both logic and presentation easier, improves flexibility and eases modification and maintenance.

If it is hard to understand, when we use a template engine we create a page with regular html and we add special tags (<%%>in EJS ) that will contain data or logic.

So when we use express we can use to different template engines.

Jade
EJS

I like EJS because it is very similar to normal HTML

Use EJS with express

First we need to install EJS using npm as a node module to our project.


npm install ejs --save

After installing EJS we need to provide the name of the template engine we are using in this project


var express = require('express');
var app = express();
app.set('view engine','ejs');

Change the default view directory in ExpressJs

When we use ExpressJs for a NodeJs application we need to place our views in a folder named "views". That is the default settings of ExpressJs.

But sometimes we might want to change that location if we use a different structure. So I thought it would be a good idea to write about that configuration though it is a small thing.

This is how we import the express module and create a instance of express.


var express = require('express');
var app = express();

express.set() method can be used to set the path for views folder as follows. "partials" is the name of new views directory.


app.set('views',__dirname+'/partials');

__dirname gives the absolute path of the current directory.