Front end is product for the user. Does’nt matter how complex and well designed back-end you have, if your front-end lacks the user expectations then at some point it’s gonna fail. In previous tutorial we have configured the express.
In this tutorial i am going to explain how to use EJS to template your advanced web applications. For those who are confuse with HTML and EJS. EJS parse complete HTML without any issue, with that it also provide some cool features which i am gonna explain below.
Beauty of EJS is that you can use one template to perform multiple operations. For.eg if i create on EJS file and set the title, head, div ID etc coming from server. I can set it multiple times depending upon the routes call.
Passing data to View:
Look on below code. This code is just for example. It’s not working code. Let’s say from Express i have pass this data.
In index.ejs i can simply do this to access title variable.
In this way you can pass any important data from Server and access here. This is one of the coolest feature of EJS.
EJS partials: Dividing code into multiple parts
You can divide the EJS code into multiple files just like we do in PHP or Rails. You can include those partials files using
Here is header.ejs partial code.
Here is body.ejs partial code.
- Capitalise letter.
- Downcase letter.
You can view complete list of filters here.
In next tutorial i am going to explain how to handle router of Express web applications.