instant.njk
Nunjucks Playground with Live-Preview for HTML
Nunjucks Template
<!DOCTYPE html> <html> <head> <title>{{ title }}</title> </head> <body> <h1>{{ heading }}</h1> <ul> {% for item in items %} <li>{{ item.name }} - {{ item.price }}</li> {% endfor %} </ul> </body> </html>
JSON Data
{ "title": "My Shop", "heading": "Welcome to my shop!", "items": [ { "name": "Apple", "price": "$1.00" }, { "name": "Banana", "price": "$0.50" }, { "name": "Orange", "price": "$0.75" } ] }
Render
Output (HTML Preview)
Copy HTML