Description #
Nunjucks is a full-featured templating language for JavaScript, designed to be powerful, extensible, and inspired by Jinja2 (Python). It supports rich logic, template inheritance, and rendering on both client and server.
History #
Nunjucks was created by Mozilla and released in 2013 to bring server-side-like templating to JavaScript applications. It was modeled after Jinja2 to allow easy migration between Python and JS-based stacks.
Hello World Code #
<h1>{{ message }}</h1>With context:
const nunjucks = require('nunjucks')
nunjucks.configure({ autoescape: true })
const output = nunjucks.renderString('<h1>{{ message }}</h1>', { message: 'Hello, World!' })
console.log(output)How to Run #
Option 1: Online
Try it in JSFiddle with Nunjucks loaded or use this playground:
https://nunjucks-playground.netlify.app/
Option 2: Local
Install via npm:
npm install nunjucks
Then render with nunjucks.render or renderString.
Key Concepts #
- Inspired by Jinja2, Django templating
{{ }}for output,{% %}for logic- Template inheritance with
{% extends %}and{% block %} - Includes, macros, filters, and custom functions
- Works in Node.js and browser
- Great for static site generators and express-based apps
- Autoescaping by default
- File-based and string-based rendering
- Extensible with custom tags and filters
- MIT licensed and well-documented
Try It Online #
https://nunjucks-playground.netlify.app
Fun Facts #
- Its name is a play on “ninja” and “Jinja”.
- Nunjucks can be used inside static site generators like Eleventy.
- It can even be compiled and embedded in the browser for dynamic client-side rendering.
Resources #
Official site
Docs or tutorial
GitHub or interpreter
Community or learning resources
