103 - Jinja Essentials for Workflow Automation

Introduction

Welcome to Rewst 103! In this course, we'll be talking about Jinja, the templating language that has become an essential tool for web developers and data engineers alike. In this article, we will explore the basics of Jinja, its syntax, and various use cases, with a focus on understanding the different use cases.

When you've completed this training, don't forget to get credit!

Watch the video and follow along with the steps below

Get Credit

To get credit for completing this session offline, please submit this form.

Follow Along

Part 1: Live Editor

The Jinja Essentials doc is a great resource to reference if you get stuck along the way.

Step 1: Open the Live Editor with Sample Context Data and Jinja

Open the Live Editor

Here are some important keyboard shortcuts you can use throughout

  1. Remove comments

    • Windows: ctrl + /

    • OSX: cmd + /

  2. Render code

    • Windows: ctrl + enter

    • OSX: cmd + enter

Step 2: Start by viewing the basic CTX Attributes

Expressing all the CTX Attributes

  1. View JSON Context:

    • Open the Context editor to view the JSON context.

  2. Uncomment CTX:

    • Initially: {# {{ CTX }} #}

    • To view: Remove comments as shown in Step 1. Render {{ CTX }}.

    • Revert: Re-add the comments to return to {# {{ CTX }} #}.

Show the Value of the Week

  1. Display Week Value:

    • Initially: {# {{- CTX.week -}} #}

    • To view: Uncomment, render {{- CTX.week -}}, and follow Step 1 for removing comments.

    • Revert: Re-add comments to return to {# {{- CTX.week -}} #}.

Show Days in the Schedule

  1. Display Schedule Days:

    • Initially: {# {{ CTX.days | length }} #}

    • To view: Uncomment, render {{ CTX.days | length }}, and follow Step 1 for removing comments.

    • Revert: Re-add comments to return to {# {{ CTX.days | length }} #}.


Part 2: Loops, Lists, and List Comprehension

Step 3: Use Loops and List Comprehension

Show the Dessert for each Weekday

  1. Uncomment and Render the following:

    
    
    {% for weekday in CTX.days %}
        The dessert on {{ weekday.day }} is {{ weekday.lunch.dessert }}
    {% endfor %}
    
    
  2. Review the Output.

  3. Re-add the comments.

Use List Comprehension to build a List of Strings

  1. Uncomment and Render the following:

    {{-
        [
            "The dessert on "~weekday.day~" is "~weekday.lunch.dessert
            for weekday in CTX.days
        ]
    -}}
  2. Review the Output.

Add Join Filter to Output List as text

  1. Type | join('.\n') to the end of your code like the following:

    {{-
        [
            "The dessert on "~weekday.day~" is "~weekday.lunch.dessert
            for weekday in CTX.days
        ] | join('.\n')
    -}}
  2. Render the code.

  3. Review the Output.

  4. Re-add the comments.

Step 4: Organize List Data

Render a List of Lists

  1. Uncomment and Render the following:

    {{-
        [
            weekday.lunch.sides
            for weekday in CTX.days
        ]
    -}}
  2. Review the Output.

Use the Flatten Filter to Output a Single List

  1. Type | flatten to the end of your code like the following:

    {{-
        [
            weekday.lunch.sides
            for weekday in CTX.days
        ] | flatten
    -}}
  2. Render the code.

  3. Review the Output.

Use the Unique Filter to Remove Repetition

  1. Type | unique to the end of your code like the following:

    {{-
        [
            weekday.lunch.sides
            for weekday in CTX.days
        ] | flatten | unique
    -}}
  2. Render the code.

  3. Review the Output.

Use the Sort Filter to Order Alphabetically

  1. Type | sort to the end of your code like the following:

    {{-
        [
            weekday.lunch.sides
            for weekday in CTX.days
        ] | flatten | unique | sort
    -}}
  2. Render the code.

  3. Review the Output.

  4. Re-add the comments.

Simplify the Output with a JSON Path Query

  1. Uncomment and Render the following:

    {{- CTX.days | jsonpath_query('[*].lunch.sides[*]') | sort | unique -}}
  2. Review the Output to see that it's the same.

  3. Re-add the comments.

Optional: Use the Map Filter to Generate the Same List

  1. Type the following in the next line:

    {{ CTX.days | map(attribute="lunch.sides")}}
  2. Render the code.

  3. Review the Output.

Optional: Add Different Filters with the List Filter to Organize

  1. Type | list the following in the next line:

    {{ CTX.days | map(attribute="lunch.sides") | list}}
  2. Try out filters like | flatten or | sort to organize.

  3. Render the code.

  4. Review the Output.

  5. Re-add the comments.

Step 5: Use More Advanced List Comprehension and Filtering

Check for a Specific Attribute

  1. Uncomment and Render the following:

    {{-
        [
            weekday.day
            for weekday in CTX.days
            if weekday.lunch.drink == "Milk"
        ]
    -}}
  2. Review to see that it only shows Monday even though Friday has Chocolate Milk.

  3. Re-add the comments.

Ensure all Versions of the Attribute are Displayed

  1. Uncomment and Render the following:

    {{-
        [
            weekday.day
            for weekday in CTX.days
            if "milk" in weekday.lunch.drink | lower
        ]
    -}}
  2. Review to see that the output includes both options.

Add String Concatenation to Turn Data into a Sentence

  1. Replace the top line of this code snippet to say weekday.lunch.drink ~ " will be served on " ~weekday.day.

  2. Render the following:

    {{-
        [
            weekday.lunch.drink ~ " will be served on " ~weekday.day
            for weekday in CTX.days
            if "milk" in weekday.lunch.drink | lower
        ]
    -}}
  3. Review the output.

Use the Join Operator to Combine the Two Statements

  1. Add | join(" and ") to the end of the code snippet.

  2. Render the following:

    {{-
        [
            weekday.lunch.drink ~ " will be served on " ~weekday.day
            for weekday in CTX.days
            if "milk" in weekday.lunch.drink | lower
        ] | join(" and ")
    -}}
  3. Review the output.

  4. Re-add the comments.

Multiply numbers within a list by themselves, and output a new list with modified data

  1. Uncomment & Render the following:

    {% set old_list = [1,2,3] %}
    {{
        [
            num * num for num in old_list
        ]
    }}
Step 6: Combine List Comprehension and Loops

Build a List and Loop Through it

  1. Uncomment and Render the following:

{%- set milky_days = [
        weekday
        for weekday in CTX.days
        if "milk" in weekday.lunch.drink | lower
    ]
-%}

{%- for weekday in milky_days -%}

On {{ weekday.day }} you should bring a frosty RewstyCola for lunch at {{ weekday.lunch.time }} because they are serving {{ weekday.lunch.drink | lower }}.
  1. Review the output.

  2. Re-add the comments.


Eggstra-Credit!

Eggstra-Credit!

Loop Through and If And Statement and Combine with a Join Operator

  1. Uncomment and Render the following:

    On {{
        [
            weekday.day
            for weekday in CTX.days
            if
                "west" in weekday.weather.wind_direction
                and
                (
                    "rain" in weekday.weather.conditions | lower
                    or
                    "storm" in weekday.weather.conditions | lower
                )
        ] | join(" and ")
    }} you will need to close the darn windows!
  2. Review the output.

  3. Re-add the comments to revert the code.

Loop Through and Output JSON Objects

  1. Uncomment and Render the following:

    {{-
        [
            {
                "day": weekday.day,
                "temp": weekday.weather.temperature
            }
            for weekday in CTX.days
            if
                weekday.weather.temperature <= 65
        ]
    -}}
  2. Review the output.

  3. Add a comma at the end of "temp": weekday.weather.temperature.

  4. Type "lunch": weekday.lunch on the next line.

  5. Render the following:

    {{-
        [
            {
                "day": weekday.day,
                "temp": weekday.weather.temperature,
                "lunch": weekday.lunch
            }
            for weekday in CTX.days
            if
                weekday.weather.temperature <= 65
        ]
    -}}
  6. Review the output to see the lunch attribute added.

  7. Re-add the comments to revert the code.

Output an HTML Table

  1. Uncomment the HTML structure at the bottom of your sample code.

  2. Render the HTML Structure.

  3. Open a text editor and copy/paste the output.

  4. Save the file as Jinja-to-html.html.

  5. Drop the file into a browser to see the results!


Conclusion

Understanding Jinja and its diverse functionalities empowers trainers to create dynamic and responsive workflows within the Rewst environment. By mastering Jinjaโ€™s syntax, you can efficiently manipulate data, enabling the seamless execution of complex tasks.

Additional Resources

For more information on using Jinja, check out our documentation:

Need more guidance?

Sign up for our LIVE training sessions below!

Last updated