Introduction
Pug is a template engine for Node.js that allows for clean, readable code for generating HTML. In this guide, we'll go over basic usage, syntax, and examples.
Table of Contents
Installation
To start using Pug, you can install it via npm:
npm install pug
Basic Syntax
Pug syntax is fairly straightforward:
- Tags are written as plain text, without angle brackets.
- Text content follows the tag after a space.
- Nesting is accomplished through indentation.
html
head
title My Page
body
h1 Hello, world!
This will generate:
<html>
<head>
<title>My Page</title>
</head>
<body>
<h1>Hello, world!</h1>
</body>
</html>
Simple Examples
Interpolation
You can use #{variable} to interpolate variables.
- var name = "John"
p Hello, #{name}!
Conditionals
Pug allows you to use if-else conditions.
- var user = true
if user
p Logged in
else
p Not logged in
Loops
You can iterate over arrays or objects.
- var items = ['Apple', 'Banana', 'Cherry']
ul
each item in items
li= item
Top comments (0)