How to use pug with Express.js

Pug is an easy and simple template engine that could use with both NodeJs and web browsers. It allows us to write HTML using a simplified syntax that can improve code readability and boost productivity. With Pug, it’s easy to create reusable HTML templates and to render data retrieved from databases or APIs dynamically.

Overall, this Pug code is similar to the HTML code but uses a more concise and streamlined syntax. The code uses indentation to indicate the nesting of elements, and it omits some of the closing tags required in HTML. The dynamic data for the title and message variables is again passed in from the server-side code using the Pug templating engine, which replaces the variables with their actual values before the HTML is sent to the client’s web browser.

Note: Detailed explanation about pug syntax can be found here.

Implementing Pug with Express.js

First, we create a file app.js and folder views, which contain the initially empty template file index.pug. We also have to make a package.json file for our app using the following command: