Pug هو محرك قوالب عالي الأداء يُستخدم بشكل مكثف مع Node.js يترجم الشفرة المبنية على المسافات البادئة إلى كود HTML أنيق.
العناصر الأساسية والسمات (Elements & Attributes)
doctype html
html(lang="en")
head
title My Application
body
h1.heading#main-title Welcome
p Just a simple paragraph of text.
.container
| Plain text can be piped
input(type="text" name="query" placeholder="Search..." autofocus)
div(style={ color: 'red', background: '#fff' })
التحكم في التدفق والتكرار (Conditionals & Loops)
// Conditionals
if user.role === 'admin'
button.danger Delete User
else if user.isLoggedIn
a(href="/profile") Profile
else
a(href="/login") Log In
// Loops
ul
each item, index in items
li= `${index + 1}: ${item.name}`
else
li No items found.
وراثة القوالب والماكرو (Inheritance & Mixins)
// Template inheritance (index.pug)
extends layout.pug
block title
| Home Page
block content
h1 Hello World!
// Mixins (reusable macros)
mixin userCard(name, role)
.card
h3= name
span.badge= role
if block
.card-body
block
+userCard('Alice', 'Lead Engineer')
p Alice leads the core infrastructure team.