With Pug, you can’t copy HTML from anywhere, you have to convert everything to Pug before you can use it.The slightest mistake in your formatting/indenting/spacing means big problems for your code.

Most importantly, we can write JavaScript that actually (almost/kind of) looks like JavaScript within our pug files.

There are even shorthands for classes (.) and IDs (#) Pug makes use of indentation to determine the nesting of tags. This greatly improves code-readability and streamlines projects with multiple developers.

When you write with Pug, you write code that looks like paragraphs.

Switching from EJS to Pug brought our code down from 27 lines to just 17!.

ejs file looked like in my last tutorial:

Set up your view engine: app.set(‘view engine’, ‘pug’).

Install Pug into your project: npm install pug -save.

Recall the following code from my: Build a Weather Website in 30 minutes with Node.js + Express + OpenWeather tutorial where we used EJS as our template language: // TERMINAL npm install ejs -save // SERVER.JS app.set('view engine', 'ejs') The same way we use other template engines. In short: At run time, Pug (and other template engines) replace variables in our file with actual values, and then send the resulting HTML string to the client. To understand Pug, you need to remember that the browser reads HTML and CSS and then displays formatted images and text to the client based on what that HTML and CSS tells it to do.Ī template engine allows us to inject data and then produce HTML. I strongly encourage you to check out those links before proceeding.

Here is the tutorial, and Here is the full code on GitHub. In this tutorial, we’re going to be examining a weather website that I previously built with Node.js, Express JS, EJS, and OpenWeatherMap’s API. I laughed at this picture for a long time - via Prerequisites

Companies that use pug template