Jinja Basics I

Jinja is more than just a city in Uganda or a Japanese temple: it’s a fast, expressive, extensible, Python based templating engine. It enables you to create dynamic content where usually it’s forbidden! Think about an html file where you can’t make loops for example. Templating engines let’s you do that and even more.

A templating engine like Jinja, works by generating markup language as well as source code following the instructions you provide. Here’s how it works in detail:

1. Static Template Files: Imagine you have a static HTML file that serves as a template for a web page. This template contains placeholders (variables) where dynamic content should appear.
2. Runtime Transformation: When a user requests that page, the templating engine steps in. It replaces those placeholders with actual values (data) fetched from the back end. These values could be anything, such as text, numbers, dates, or even more complex data structures.
3. HTML Rendering: The templating engine then transforms the template into a complete HTML file. This HTML file is sent to the client’s browser, where it’s displayed as a fully rendered web page.

Templating engines are useful because, in addition to creating dynamic content, they can provide:

• Separation of Concerns: Templating engines separate the presentation layer from the business logic (data manipulation). This makes it easier to maintain and update your codebase.
• Reusable Templates: You can reuse templates (called macros) across multiple pages, reducing redundancy and improving consistency.

Jinja Logic

As in any programming language, also in Jinja you can use variables.

To set a variable you need to type the initialization of the variable in this particular syntax:

{{% set <varaible_name> = <value> %}}

To use the value of the variable directly you can write the variable name inside double curly brackets:

{{ <variable_name> }}

The syntax for variable initialization, is actually the syntax used to execute any piece of Python code. Every statement block will then need to ended by a special end statement. For example, a for loop will be:

{% for item in items %}
    # program logic
{% endfor %}

Jinja Macros

Macros are templates that you can exploit whenever you need to do the same action multiple times. In a normal programming language, macros are just functions, because they can accept arguments.

A macro needs to be defined with the same syntax for executing Python code:

{% macro <macro_name>(<args>) %}
    # macro logic
{% endmacro %}

Example Code

Now let’s make a simple example to wrap up.

Imagine you want to print if the numbers contained in an array are greater or lower then a certain number. You want to exploit macro capabilities. The code will be:

{% macro greater_less_equal(number, test_number) %}

    {% if number > test_number %}

        The number {{ number }} is greater then {{ test_number }}.

    {% elif number < test_number %}

        The number {{ number }} is less then {{ test_number }}.

    {% else %}

        The number {{ number }} is equal to the test number.

    {% endif %}

{% endmacro %}


{% set numbers = [1, 4, 50, 68, 7, 100] %}
{% set test_number = 50 %}


{% for number in numbers %}

    {{ greater_less_equal(number, test_number) }}

{% endfor %}

Which will result in something like this:

The number 1 is less than 50.
The number 4 is less than 50.
The number 50 is equal to the test number.
The number 68 is greater than 50.
The number 7 is less than 50.
The number 100 is greater than 50.

Useful Links

Jinja Documentation: https://jinja.palletsprojects.com/en/

Jinja Live Parser: http://jinja.quantprogramming.com/