{"id":7004,"date":"2022-11-24T21:55:48","date_gmt":"2022-11-24T20:55:48","guid":{"rendered":"https:\/\/www.sviluppomania.com\/it\/?p=7004"},"modified":"2025-12-01T21:16:45","modified_gmt":"2025-12-01T20:16:45","slug":"jinja2-tutorial-parte-1","status":"publish","type":"post","link":"https:\/\/www.sviluppomania.com\/en\/jinja2-tutorial-part-1\/","title":{"rendered":"JINJA2 Tutorial: part 1"},"content":{"rendered":"<p>In this article we will talk about Jinja the template engine used in the Python ecosystem. Created in 2008 by Armin Ronacher, the same creator of the Flask micro framework. It is used to create dynamic documents by combining static models (templates) with variable data, its applications are found in particular in web applications such as Flask, Bottle, Django and tools such as Ansible and Pellican, but not only that, it can also be used directly on programs in the Python environment. Often also trivially called Jinja2 in reference to its release version, it has the main purpose of dividing the graphic aspect from the logical code, making the program structure cleaner and more maintainable. Jinja is an open source, independent, and always continuously updated project, it appears to be safe, reliable, maintainable, feature-rich and simple to use. the aim is to combine text and graphics models with a business logic that returns data such as variables, lists, dictionaries, objects, Json elements. With Jinja you can create text or markup documents such as Html, Json, Xml, Csv, Txt, Latex, etc&#8230;<\/p>\r\n<h2>What is a template<\/h2>\r\n<p>Before proceeding with the examples, it is appropriate to dwell on defining what a template is. A template (shape, mould) is the structure of a document made up of predefined lines of text, located in a specific position, with empty spaces to be filled with variable data. The layout of the document called layout remains unchanged, only the data changes.<\/p>\r\n<p style=\"text-align: center;\"><a href=\"https:\/\/i.ibb.co\/2nWPmNr\/Documento-1.png\"><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAIAAAAAAAP\/\/\/ywAAAAAAQABAAACAUwAOw==\" fifu-lazy=\"1\" fifu-data-sizes=\"auto\" fifu-data-srcset=\"https:\/\/i2.wp.com\/i.ibb.co\/2nWPmNr\/Documento-1.png?ssl=1&w=75&resize=75&ssl=1 75w, https:\/\/i2.wp.com\/i.ibb.co\/2nWPmNr\/Documento-1.png?ssl=1&w=100&resize=100&ssl=1 100w, https:\/\/i2.wp.com\/i.ibb.co\/2nWPmNr\/Documento-1.png?ssl=1&w=150&resize=150&ssl=1 150w, https:\/\/i2.wp.com\/i.ibb.co\/2nWPmNr\/Documento-1.png?ssl=1&w=240&resize=240&ssl=1 240w, https:\/\/i2.wp.com\/i.ibb.co\/2nWPmNr\/Documento-1.png?ssl=1&w=320&resize=320&ssl=1 320w, https:\/\/i2.wp.com\/i.ibb.co\/2nWPmNr\/Documento-1.png?ssl=1&w=500&resize=500&ssl=1 500w, https:\/\/i2.wp.com\/i.ibb.co\/2nWPmNr\/Documento-1.png?ssl=1&w=640&resize=640&ssl=1 640w, https:\/\/i2.wp.com\/i.ibb.co\/2nWPmNr\/Documento-1.png?ssl=1&w=800&resize=800&ssl=1 800w, https:\/\/i2.wp.com\/i.ibb.co\/2nWPmNr\/Documento-1.png?ssl=1&w=1024&resize=1024&ssl=1 1024w, https:\/\/i2.wp.com\/i.ibb.co\/2nWPmNr\/Documento-1.png?ssl=1&w=1280&resize=1280&ssl=1 1280w, https:\/\/i2.wp.com\/i.ibb.co\/2nWPmNr\/Documento-1.png?ssl=1&w=1600&resize=1600&ssl=1 1600w\" class=\"wp-image-7006 size-full aligncenter\" fifu-data-src=\"https:\/\/i2.wp.com\/i.ibb.co\/2nWPmNr\/Documento-1.png?ssl=1\" alt=\"Template\" width=\"100%\" height=\"419\" \/><\/a> <strong>Fig. 1<\/strong><\/p>\r\n<p>In Fig. 1 you can see an example of a template with predefined text parts and variable parts. In the web field, templates are sample documents for the development of other web pages with identical graphics and formatting but with different contents. Now that we have seen what templates are, let&#8217;s see what Jinja does. Jinja generates dynamic text blocks in a predefined structure, so everything is based on two major players which are the template and the data. The templates formed by graphics, predefined structures with placeholders located in them that will be replaced by data. And the data that can be simple variables, lists, dictionaries or objects taken from a database, or Json or other types of documents, there can also be data generated dynamically through algorithms.<\/p>\r\n<p>&nbsp;<\/p>\r\n<p style=\"text-align: center;\"><a href=\"https:\/\/i.ibb.co\/qr1BWvQ\/Diagramma-senza-titolo-drawio.png\"><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAIAAAAAAAP\/\/\/ywAAAAAAQABAAACAUwAOw==\" fifu-lazy=\"1\" fifu-data-sizes=\"auto\" fifu-data-srcset=\"https:\/\/i3.wp.com\/i.ibb.co\/qr1BWvQ\/Diagramma-senza-titolo-drawio.png?ssl=1&w=75&resize=75&ssl=1 75w, https:\/\/i3.wp.com\/i.ibb.co\/qr1BWvQ\/Diagramma-senza-titolo-drawio.png?ssl=1&w=100&resize=100&ssl=1 100w, https:\/\/i3.wp.com\/i.ibb.co\/qr1BWvQ\/Diagramma-senza-titolo-drawio.png?ssl=1&w=150&resize=150&ssl=1 150w, https:\/\/i3.wp.com\/i.ibb.co\/qr1BWvQ\/Diagramma-senza-titolo-drawio.png?ssl=1&w=240&resize=240&ssl=1 240w, https:\/\/i3.wp.com\/i.ibb.co\/qr1BWvQ\/Diagramma-senza-titolo-drawio.png?ssl=1&w=320&resize=320&ssl=1 320w, https:\/\/i3.wp.com\/i.ibb.co\/qr1BWvQ\/Diagramma-senza-titolo-drawio.png?ssl=1&w=500&resize=500&ssl=1 500w, https:\/\/i3.wp.com\/i.ibb.co\/qr1BWvQ\/Diagramma-senza-titolo-drawio.png?ssl=1&w=640&resize=640&ssl=1 640w, https:\/\/i3.wp.com\/i.ibb.co\/qr1BWvQ\/Diagramma-senza-titolo-drawio.png?ssl=1&w=800&resize=800&ssl=1 800w, https:\/\/i3.wp.com\/i.ibb.co\/qr1BWvQ\/Diagramma-senza-titolo-drawio.png?ssl=1&w=1024&resize=1024&ssl=1 1024w, https:\/\/i3.wp.com\/i.ibb.co\/qr1BWvQ\/Diagramma-senza-titolo-drawio.png?ssl=1&w=1280&resize=1280&ssl=1 1280w, https:\/\/i3.wp.com\/i.ibb.co\/qr1BWvQ\/Diagramma-senza-titolo-drawio.png?ssl=1&w=1600&resize=1600&ssl=1 1600w\" class=\"wp-image-7008 size-full aligncenter\" fifu-data-src=\"https:\/\/i3.wp.com\/i.ibb.co\/qr1BWvQ\/Diagramma-senza-titolo-drawio.png?ssl=1\" alt=\"Diagram\" width=\"100%\" height=\"431\" \/><\/a> <strong>Fig. 2<\/strong><\/p>\r\n<p>The visualization of data in a template is called rendering. Jinja as well as managing data rendering also has other features such as:<\/p>\r\n<ul>\r\n<li>Tags containing structured code (control structures and loops) ;<\/li>\r\n<li>Template inheritance;<\/li>\r\n<li>The use of Macros ;<\/li>\r\n<li>A code auto-escaping system;<\/li>\r\n<li>A Sandbox to make your code more secure;<\/li>\r\n<li>Filters ;<\/li>\r\n<li>Tests ;<\/li>\r\n<li>A Unicode support.<\/li>\r\n<\/ul>\r\n<h2>Installation<\/h2>\r\n<p>Installing Jinja is very simple, just open a shell and use the python pip installer, typing the following code.<\/p>\r\n<pre class=\"wp-block-code\"><code>pip install jinja2<\/code><\/pre>\r\n<p>Obviously the installation of the package should be done in a virtual environment, to keep the projects well separated from each other, avoiding conflicts between various versions.<\/p>\r\n<h2>Examples<\/h2>\r\n<p>Now let&#8217;s see how to use Jinja2 through some examples. But first, let&#8217;s see how placeholders are defined in the template.<\/p>\r\n<p>To render simple variables, insert the dynamic data between double curly braces {{}}<\/p>\r\n\r\n<pre class=\"wp-block-code\"><code>&lt;p&gt;The variable {{myVariable}} appears between the braces&lt;\/p&gt;<\/code><\/pre>\r\n\r\n<p>&nbsp;<\/p>\r\n\r\n<p>To use control structures or loops use the following opening and closing tags {% structure %} {% endstructure %}<\/p>\r\n\r\n<p>&nbsp;<\/p>\r\n\r\n<pre class=\"wp-block-code\"><code>{<strong>*<\/strong> control structure <strong>*<\/strong>}\r\n{% if true %}\r\n   print(\"ok\")\r\n{% else %}\r\n   print(\"nok)\r\n{% endif %}\r\n\r\n{<strong>*<\/strong> cycle for <strong>*<\/strong>}\r\n{% for a in range(1,10) %}\r\n   print(a)\r\n{% endfor %}<\/code><\/pre>\r\n\r\n<p>&nbsp;<\/p>\r\n\r\n<p>To write comments use {* &#8230;comment&#8230; *}<\/p>\r\n\r\n<h3><strong>Example of basic template.<\/strong><\/h3>\r\n<p>Let&#8217;s see how to create a basic template. After installing the Jinja library, create a folder with a name of your choice, inside it create a file called main.py which will contain the code to create the document rendering engine.<\/p>\r\n\r\n<pre class=\"wp-block-code\"><code>import jinja2\r\nenvironment = jinja2.Environment()\r\ntemplate = environment.from_string(\"Hello, {{ name }}!\")\r\nprint(template.render(name=\"World\"))<\/code><\/pre>\r\n\r\n<p>&nbsp;<\/p>\r\n\r\n<p>Let&#8217;s try launching the program from the shell with the command:<\/p>\r\n\r\n<p>&nbsp;<\/p>\r\n\r\n<pre class=\"wp-block-code\"><code>python main.py<\/code><\/pre>\r\n\r\n<p>&nbsp;<\/p>\r\n\r\n<p>And we see the word Hello, World! printed on the screen, we have just generated our first document from a partly static and partly dynamic string.<\/p>\r\n<h3>Template example from a file<\/h3>\r\n<p>For this example we will make use of HTML to generate dynamic web pages. Let&#8217;s take the newly created project and add a folder called templates and inside it a file called index.html which will be the template from which we will generate the document. Now let&#8217;s write some code. Let&#8217;s modify the main.py file with the following listing.<\/p>\r\n<pre class=\"wp-block-code\"><code>from jinja2 import Environment, PackageLoader, select_autoescape, FileSystemLoader\r\nimport webview\r\n\r\n<strong>* Save in a variable the folder where the various 'templates' files reside\r\n* Which can be html, xml, csv, json, latex, txt, ecc......<\/strong>\r\nfile_loader = FileSystemLoader('templates')\r\n\r\n<strong>* I create the environment where jinja2 lives\r\n* All configurations will be managed here<\/strong>\r\nenv = Environment(\r\n                loader=file_loader, *<strong> Loading the path to the template files<\/strong>\r\n                autoescape=select_autoescape() *<strong> I use auto escape<\/strong>\r\n)\r\n\r\n<strong>* Retrieving the template using the get_template() method<\/strong>\r\ntemplate = env.get_template(\"index.html\")\r\n\r\n<strong>* With the render() method I render the template<\/strong>\r\nprint(template.render())\r\n\r\n<strong>* Extra: using the pywebview package I render the HTML I used<br \/>* in the example<\/strong>\r\ntitleWindow = \"My window\"\r\nwebview.create_window(titoloWindow, html = template.render())\r\nwebview.start()<\/code><\/pre>\r\n<p>From the previous listing we see that some modules have been imported from the Jinja2 library, including Environment which, once instantiated, will be used to configure the environment where the template will live. Other modules we imported are select_autoescape and FileSystemLoader. <strong>select_autoescape<\/strong> is used to enable automatic escaping of Jinja, sometimes when generating <strong>HTML<\/strong> documents from templates there is a risk that the rendering of variables will affect the resulting <strong>HTML<\/strong>. <strong>FileSystemLoader<\/strong> is used to indicate the folder where the templates are located. Note that in the project, in order to view the result in a graphical version, we helped ourselves with the pywebview library which creates desktop applications using html code. To install it, type the following command.<\/p>\r\n<pre class=\"wp-block-code\"><code>pip install pywebview<\/code><\/pre>\r\n<p>Now let&#8217;s see the template code, insert the following listing inside index.html.<\/p>\r\n<pre class=\"wp-block-code\"><code>&lt;!DOCTYPE html&gt;\r\n&lt;html lang=\"en\" dir=\"ltr\"&gt;\r\n  &lt;head&gt;\r\n    &lt;meta charset=\"utf-8\"&gt;\r\n    &lt;title&gt;&lt;\/title&gt;\r\n  &lt;\/head&gt;\r\n  &lt;body&gt;\r\n    &lt;p&gt;\r\n      Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod\r\n      tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,\r\n      quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.\r\n      Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore\r\n      eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident,\r\n      sunt in culpa qui officia deserunt mollit anim id est laborum.\r\n    &lt;\/p&gt;\r\n  &lt;\/body&gt;\r\n&lt;\/html&gt; <\/code><\/pre>\r\n<p>Let&#8217;s run the program with the python main.py command and see the final result.<\/p>\r\n<p style=\"text-align: center;\"><a href=\"https:\/\/i.ibb.co\/fFYhnm2\/MyWindow.png\"><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAIAAAAAAAP\/\/\/ywAAAAAAQABAAACAUwAOw==\" fifu-lazy=\"1\" fifu-data-sizes=\"auto\" fifu-data-srcset=\"https:\/\/i3.wp.com\/i.ibb.co\/fFYhnm2\/MyWindow.png?ssl=1&w=75&resize=75&ssl=1 75w, https:\/\/i3.wp.com\/i.ibb.co\/fFYhnm2\/MyWindow.png?ssl=1&w=100&resize=100&ssl=1 100w, https:\/\/i3.wp.com\/i.ibb.co\/fFYhnm2\/MyWindow.png?ssl=1&w=150&resize=150&ssl=1 150w, https:\/\/i3.wp.com\/i.ibb.co\/fFYhnm2\/MyWindow.png?ssl=1&w=240&resize=240&ssl=1 240w, https:\/\/i3.wp.com\/i.ibb.co\/fFYhnm2\/MyWindow.png?ssl=1&w=320&resize=320&ssl=1 320w, https:\/\/i3.wp.com\/i.ibb.co\/fFYhnm2\/MyWindow.png?ssl=1&w=500&resize=500&ssl=1 500w, https:\/\/i3.wp.com\/i.ibb.co\/fFYhnm2\/MyWindow.png?ssl=1&w=640&resize=640&ssl=1 640w, https:\/\/i3.wp.com\/i.ibb.co\/fFYhnm2\/MyWindow.png?ssl=1&w=800&resize=800&ssl=1 800w, https:\/\/i3.wp.com\/i.ibb.co\/fFYhnm2\/MyWindow.png?ssl=1&w=1024&resize=1024&ssl=1 1024w, https:\/\/i3.wp.com\/i.ibb.co\/fFYhnm2\/MyWindow.png?ssl=1&w=1280&resize=1280&ssl=1 1280w, https:\/\/i3.wp.com\/i.ibb.co\/fFYhnm2\/MyWindow.png?ssl=1&w=1600&resize=1600&ssl=1 1600w\" class=\"wp-image-7012 size-full aligncenter\" fifu-data-src=\"https:\/\/i3.wp.com\/i.ibb.co\/fFYhnm2\/MyWindow.png?ssl=1\" alt=\"MyWindow\" width=\"100%\" height=\"289\" \/><\/a> <strong>Fig. 3<\/strong><\/p>\r\n<h3><strong>Dynamic template example<\/strong><\/h3>\r\n<p>In the following example we will insert dynamic data into the template. edit the main.py file as follows.<\/p>\r\n<pre class=\"wp-block-code\"><code>from jinja2 import Environment, PackageLoader, select_autoescape, FileSystemLoader\r\nimport webview\r\n\r\nenv = Environment(\r\n                loader = FileSystemLoader('templates'),\r\n                autoescape=select_autoescape()\r\n)\r\n\r\n<strong>* Retrieving the template using the get_template() method<\/strong>\r\ntemplate = env.get_template(\"example_passing_variables.html\")\r\n\r\n<strong>* With the render() method I render the template <\/strong><br \/><strong>* Among the arguments of the render method I can pass data to be displayed in the 'templates' <\/strong><br \/><strong>* The data can be of any type variables, lists, dictionaries, objects, json<\/strong>\r\nview = template.render(\r\n                    title = \"Example passing variables\",\r\n                    subtitle = \"To render the variables, insert the placeholder between {{}}\"\")\r\n\r\nprint(view)\r\n\r\n\r\n<strong>* Extra: via the pywebview package I render the HTML I used <\/strong><br \/><strong>* in the example<\/strong>\r\nwindowTitle = \"My window\"\r\nwebview.create_window(windowTitle, html = view)\r\nwebview.start()\r\n<\/code><\/pre>\r\n<p>Now let&#8217;s edit the index.html file as follows.<\/p>\r\n<pre class=\"wp-block-code\"><code>&lt;!DOCTYPE html&gt;\r\n&lt;html lang=\"en\" dir=\"ltr\"&gt;\r\n  &lt;head&gt;\r\n    &lt;meta charset=\"utf-8\"&gt;\r\n    &lt;title&gt;&lt;\/title&gt;\r\n  &lt;\/head&gt;\r\n  &lt;body&gt;\r\n    &lt;h1&gt;{{titolo}}&lt;\/h1&gt;\r\n    &lt;h3&gt;{{sottoTitolo}}&lt;\/h3&gt;\r\n    &lt;p&gt;\r\n      Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod\r\n      tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,\r\n      quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.\r\n      Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.\r\n      Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.\r\n    &lt;\/p&gt;\r\n  &lt;\/body&gt;\r\n&lt;\/html&gt;<\/code><\/pre>\r\n<p>Vediamo il risultato finale.<\/p>\r\n<p style=\"text-align: center;\"><a href=\"https:\/\/i.ibb.co\/r4CmDr9\/My-Window2.png\"><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAIAAAAAAAP\/\/\/ywAAAAAAQABAAACAUwAOw==\" fifu-lazy=\"1\" fifu-data-sizes=\"auto\" fifu-data-srcset=\"https:\/\/i1.wp.com\/i.ibb.co\/r4CmDr9\/My-Window2.png?ssl=1&w=75&resize=75&ssl=1 75w, https:\/\/i1.wp.com\/i.ibb.co\/r4CmDr9\/My-Window2.png?ssl=1&w=100&resize=100&ssl=1 100w, https:\/\/i1.wp.com\/i.ibb.co\/r4CmDr9\/My-Window2.png?ssl=1&w=150&resize=150&ssl=1 150w, https:\/\/i1.wp.com\/i.ibb.co\/r4CmDr9\/My-Window2.png?ssl=1&w=240&resize=240&ssl=1 240w, https:\/\/i1.wp.com\/i.ibb.co\/r4CmDr9\/My-Window2.png?ssl=1&w=320&resize=320&ssl=1 320w, https:\/\/i1.wp.com\/i.ibb.co\/r4CmDr9\/My-Window2.png?ssl=1&w=500&resize=500&ssl=1 500w, https:\/\/i1.wp.com\/i.ibb.co\/r4CmDr9\/My-Window2.png?ssl=1&w=640&resize=640&ssl=1 640w, https:\/\/i1.wp.com\/i.ibb.co\/r4CmDr9\/My-Window2.png?ssl=1&w=800&resize=800&ssl=1 800w, https:\/\/i1.wp.com\/i.ibb.co\/r4CmDr9\/My-Window2.png?ssl=1&w=1024&resize=1024&ssl=1 1024w, https:\/\/i1.wp.com\/i.ibb.co\/r4CmDr9\/My-Window2.png?ssl=1&w=1280&resize=1280&ssl=1 1280w, https:\/\/i1.wp.com\/i.ibb.co\/r4CmDr9\/My-Window2.png?ssl=1&w=1600&resize=1600&ssl=1 1600w\" class=\"wp-image-7014 size-full\" fifu-data-src=\"https:\/\/i1.wp.com\/i.ibb.co\/r4CmDr9\/My-Window2.png?ssl=1\" alt=\"MyWindow2\" width=\"100%\" height=\"288\" \/><\/a> <strong>Fig. 4<\/strong><\/p>\r\n<p>In this tutorial we have seen what the Jinja2 library is, we have also seen how it is used through small examples, in the next tutorials we will enrich our baggage by seeing other features that make this template engine a valid development tool. \u00a0<\/p>\r\n<p>&nbsp;<\/p>\r\n<p>SviluppoMania<\/p>\r\n<p>Stay Tuned<\/p>","protected":false},"excerpt":{"rendered":"<p>In this article we will talk about Jinja the template engine used in the Python ecosystem. Created in 2008 by&#8230;<\/p>\n","protected":false},"author":174,"featured_media":7158,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"fifu_image_url":"https:\/\/i.ibb.co\/ngGVSFk\/0g-QQjuzt6-IM5-TXy-V.jpg","fifu_image_alt":"JINJA2","_vp_format_video_url":"","_vp_image_focal_point":[],"footnotes":""},"categories":[298],"tags":[608,606,603,604,605,607],"class_list":["post-7004","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-programming_languages","tag-creare-templates","tag-flask-jinja","tag-jinja","tag-jinja2","tag-python-jinja2","tag-viste-con-jinja"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.4 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>JINJA2 Tutorial: part 1<\/title>\n<meta name=\"description\" content=\"In this article we will talk about Jinja the template engine used in the Python ecosystem...\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.sviluppomania.com\/en\/jinja2-tutorial-parte-1\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"JINJA2 Tutorial: part 1\" \/>\n<meta property=\"og:description\" content=\"In this article we will talk about Jinja the template engine used in the Python ecosystem...\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.sviluppomania.com\/en\/jinja2-tutorial-parte-1\/\" \/>\n<meta property=\"og:site_name\" content=\"SviluppoMania | Professional blog dedicated to Technology!\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/SviluppoManiaCom\" \/>\n<meta property=\"article:published_time\" content=\"2022-11-24T20:55:48+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-12-01T20:16:45+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/i.ibb.co\/ngGVSFk\/0g-QQjuzt6-IM5-TXy-V.jpg\" \/><meta property=\"og:image\" content=\"https:\/\/i.ibb.co\/ngGVSFk\/0g-QQjuzt6-IM5-TXy-V.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"539\" \/>\n\t<meta property=\"og:image:height\" content=\"249\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"MARCO.VERGNANI\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:image\" content=\"https:\/\/i.ibb.co\/ngGVSFk\/0g-QQjuzt6-IM5-TXy-V.jpg\" \/>\n<meta name=\"twitter:creator\" content=\"@SviluppoMania\" \/>\n<meta name=\"twitter:site\" content=\"@SviluppoMania\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"MARCO.VERGNANI\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"15 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.sviluppomania.com\\\/it\\\/jinja2-tutorial-parte-1\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.sviluppomania.com\\\/it\\\/jinja2-tutorial-parte-1\\\/\"},\"author\":{\"name\":\"MARCO.VERGNANI\",\"@id\":\"https:\\\/\\\/www.sviluppomania.com\\\/it\\\/#\\\/schema\\\/person\\\/ae16b620f0e95611f67bb496be059074\"},\"headline\":\"JINJA2 Tutorial: part 1\",\"datePublished\":\"2022-11-24T20:55:48+00:00\",\"dateModified\":\"2025-12-01T20:16:45+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.sviluppomania.com\\\/it\\\/jinja2-tutorial-parte-1\\\/\"},\"wordCount\":1862,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\\\/\\\/www.sviluppomania.com\\\/it\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/www.sviluppomania.com\\\/it\\\/jinja2-tutorial-parte-1\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/i2.wp.com\\\/i.ibb.co\\\/ngGVSFk\\\/0g-QQjuzt6-IM5-TXy-V.jpg?w=539&resize=539,249&ssl=1\",\"keywords\":[\"creare templates\",\"flask jinja\",\"jinja\",\"jinja2\",\"python jinja2\",\"viste con jinja\"],\"articleSection\":[\"PROGRAMMING &amp; LANGUAGES\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.sviluppomania.com\\\/it\\\/jinja2-tutorial-parte-1\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.sviluppomania.com\\\/en\\\/jinja2-tutorial-parte-1\\\/\",\"url\":\"https:\\\/\\\/www.sviluppomania.com\\\/en\\\/jinja2-tutorial-parte-1\\\/\",\"name\":\"JINJA2 Tutorial: part 1\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.sviluppomania.com\\\/en\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.sviluppomania.com\\\/en\\\/jinja2-tutorial-parte-1\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.sviluppomania.com\\\/it\\\/jinja2-tutorial-parte-1\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/i2.wp.com\\\/i.ibb.co\\\/ngGVSFk\\\/0g-QQjuzt6-IM5-TXy-V.jpg?w=539&resize=539,249&ssl=1\",\"datePublished\":\"2022-11-24T20:55:48+00:00\",\"dateModified\":\"2025-12-01T20:16:45+00:00\",\"description\":\"In this article we will talk about Jinja the template engine used in the Python ecosystem...\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.sviluppomania.com\\\/en\\\/jinja2-tutorial-parte-1\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[[\"https:\\\/\\\/www.sviluppomania.com\\\/en\\\/jinja2-tutorial-parte-1\\\/\"]]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.sviluppomania.com\\\/en\\\/jinja2-tutorial-parte-1\\\/#primaryimage\",\"url\":\"https:\\\/\\\/i2.wp.com\\\/i.ibb.co\\\/ngGVSFk\\\/0g-QQjuzt6-IM5-TXy-V.jpg?w=539&resize=539,249&ssl=1\",\"contentUrl\":\"https:\\\/\\\/i2.wp.com\\\/i.ibb.co\\\/ngGVSFk\\\/0g-QQjuzt6-IM5-TXy-V.jpg?w=539&resize=539,249&ssl=1\",\"width\":\"539\",\"height\":\"249\",\"caption\":\"JINJA2\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.sviluppomania.com\\\/en\\\/jinja2-tutorial-parte-1\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.sviluppomania.com\\\/en\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"JINJA2 Tutorial: parte 1\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.sviluppomania.com\\\/en\\\/#website\",\"url\":\"https:\\\/\\\/www.sviluppomania.com\\\/en\\\/\",\"name\":\"SviluppoMania | Professional blog dedicated to Technology!\",\"description\":\"SviluppoMania | Professional blog dedicated to Technology! Tools - Reviews and much more\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.sviluppomania.com\\\/en\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.sviluppomania.com\\\/en\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.sviluppomania.com\\\/en\\\/#organization\",\"name\":\"SviluppoMania.com\",\"url\":\"https:\\\/\\\/www.sviluppomania.com\\\/en\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.sviluppomania.com\\\/en\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/www.sviluppomania.com\\\/wp-content\\\/uploads\\\/2020\\\/12\\\/SviluppoMania-logo2-_1_.webp\",\"contentUrl\":\"https:\\\/\\\/www.sviluppomania.com\\\/wp-content\\\/uploads\\\/2020\\\/12\\\/SviluppoMania-logo2-_1_.webp\",\"width\":474,\"height\":408,\"caption\":\"SviluppoMania.com\"},\"image\":{\"@id\":\"https:\\\/\\\/www.sviluppomania.com\\\/en\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/SviluppoManiaCom\",\"https:\\\/\\\/x.com\\\/SviluppoMania\",\"https:\\\/\\\/www.instagram.com\\\/sviluppomania\\\/\",\"https:\\\/\\\/www.youtube.com\\\/channel\\\/UC5CuM88LjzBeC23s2DPdveA\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.sviluppomania.com\\\/it\\\/#\\\/schema\\\/person\\\/ae16b620f0e95611f67bb496be059074\",\"name\":\"MARCO.VERGNANI\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/lh3.googleusercontent.com\\\/a\\\/ACg8ocIrc635RIrznZifq60wpv-NGquftAXU0DTmwwGSdlV4FbvhpkIn=s96-c?sz=50\",\"url\":\"https:\\\/\\\/lh3.googleusercontent.com\\\/a\\\/ACg8ocIrc635RIrznZifq60wpv-NGquftAXU0DTmwwGSdlV4FbvhpkIn=s96-c?sz=50\",\"contentUrl\":\"https:\\\/\\\/lh3.googleusercontent.com\\\/a\\\/ACg8ocIrc635RIrznZifq60wpv-NGquftAXU0DTmwwGSdlV4FbvhpkIn=s96-c?sz=50\",\"caption\":\"MARCO.VERGNANI\"},\"description\":\"Nella mia vita a 12 anni e' entrato a far parte un Intel 80286 con 4MB di RAM, un Hard disk da 20 MB e una primissima scheda VGA appena uscita e da allora mi si e' aperto un mondo pieno di bit. Appassionato di programmazione fin da piccolo, mi diverto a costruire piccoli robottini. Curioso delle molteplici applicazioni che le macchine automatiche possono compiere, e adoro vedere volare quegli strani oggetti chiamati droni.\",\"url\":\"https:\\\/\\\/www.sviluppomania.com\\\/en\\\/author\\\/marco-vergnani\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"JINJA2 Tutorial: part 1","description":"In this article we will talk about Jinja the template engine used in the Python ecosystem...","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.sviluppomania.com\/en\/jinja2-tutorial-parte-1\/","og_locale":"en_US","og_type":"article","og_title":"JINJA2 Tutorial: part 1","og_description":"In this article we will talk about Jinja the template engine used in the Python ecosystem...","og_url":"https:\/\/www.sviluppomania.com\/en\/jinja2-tutorial-parte-1\/","og_site_name":"SviluppoMania | Professional blog dedicated to Technology!","article_publisher":"https:\/\/www.facebook.com\/SviluppoManiaCom","article_published_time":"2022-11-24T20:55:48+00:00","article_modified_time":"2025-12-01T20:16:45+00:00","og_image":[{"url":"https:\/\/i.ibb.co\/ngGVSFk\/0g-QQjuzt6-IM5-TXy-V.jpg","type":"","width":"","height":""},{"width":539,"height":249,"url":"https:\/\/i.ibb.co\/ngGVSFk\/0g-QQjuzt6-IM5-TXy-V.jpg","type":"image\/jpeg"}],"author":"MARCO.VERGNANI","twitter_card":"summary_large_image","twitter_image":"https:\/\/i.ibb.co\/ngGVSFk\/0g-QQjuzt6-IM5-TXy-V.jpg","twitter_creator":"@SviluppoMania","twitter_site":"@SviluppoMania","twitter_misc":{"Written by":"MARCO.VERGNANI","Est. reading time":"15 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.sviluppomania.com\/it\/jinja2-tutorial-parte-1\/#article","isPartOf":{"@id":"https:\/\/www.sviluppomania.com\/it\/jinja2-tutorial-parte-1\/"},"author":{"name":"MARCO.VERGNANI","@id":"https:\/\/www.sviluppomania.com\/it\/#\/schema\/person\/ae16b620f0e95611f67bb496be059074"},"headline":"JINJA2 Tutorial: part 1","datePublished":"2022-11-24T20:55:48+00:00","dateModified":"2025-12-01T20:16:45+00:00","mainEntityOfPage":{"@id":"https:\/\/www.sviluppomania.com\/it\/jinja2-tutorial-parte-1\/"},"wordCount":1862,"commentCount":0,"publisher":{"@id":"https:\/\/www.sviluppomania.com\/it\/#organization"},"image":{"@id":"https:\/\/www.sviluppomania.com\/it\/jinja2-tutorial-parte-1\/#primaryimage"},"thumbnailUrl":"https:\/\/i2.wp.com\/i.ibb.co\/ngGVSFk\/0g-QQjuzt6-IM5-TXy-V.jpg?w=539&resize=539,249&ssl=1","keywords":["creare templates","flask jinja","jinja","jinja2","python jinja2","viste con jinja"],"articleSection":["PROGRAMMING &amp; LANGUAGES"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.sviluppomania.com\/it\/jinja2-tutorial-parte-1\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.sviluppomania.com\/en\/jinja2-tutorial-parte-1\/","url":"https:\/\/www.sviluppomania.com\/en\/jinja2-tutorial-parte-1\/","name":"JINJA2 Tutorial: part 1","isPartOf":{"@id":"https:\/\/www.sviluppomania.com\/en\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.sviluppomania.com\/en\/jinja2-tutorial-parte-1\/#primaryimage"},"image":{"@id":"https:\/\/www.sviluppomania.com\/it\/jinja2-tutorial-parte-1\/#primaryimage"},"thumbnailUrl":"https:\/\/i2.wp.com\/i.ibb.co\/ngGVSFk\/0g-QQjuzt6-IM5-TXy-V.jpg?w=539&resize=539,249&ssl=1","datePublished":"2022-11-24T20:55:48+00:00","dateModified":"2025-12-01T20:16:45+00:00","description":"In this article we will talk about Jinja the template engine used in the Python ecosystem...","breadcrumb":{"@id":"https:\/\/www.sviluppomania.com\/en\/jinja2-tutorial-parte-1\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":[["https:\/\/www.sviluppomania.com\/en\/jinja2-tutorial-parte-1\/"]]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.sviluppomania.com\/en\/jinja2-tutorial-parte-1\/#primaryimage","url":"https:\/\/i2.wp.com\/i.ibb.co\/ngGVSFk\/0g-QQjuzt6-IM5-TXy-V.jpg?w=539&resize=539,249&ssl=1","contentUrl":"https:\/\/i2.wp.com\/i.ibb.co\/ngGVSFk\/0g-QQjuzt6-IM5-TXy-V.jpg?w=539&resize=539,249&ssl=1","width":"539","height":"249","caption":"JINJA2"},{"@type":"BreadcrumbList","@id":"https:\/\/www.sviluppomania.com\/en\/jinja2-tutorial-parte-1\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.sviluppomania.com\/en\/"},{"@type":"ListItem","position":2,"name":"JINJA2 Tutorial: parte 1"}]},{"@type":"WebSite","@id":"https:\/\/www.sviluppomania.com\/en\/#website","url":"https:\/\/www.sviluppomania.com\/en\/","name":"SviluppoMania | Professional blog dedicated to Technology!","description":"SviluppoMania | Professional blog dedicated to Technology! Tools - Reviews and much more","publisher":{"@id":"https:\/\/www.sviluppomania.com\/en\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.sviluppomania.com\/en\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.sviluppomania.com\/en\/#organization","name":"SviluppoMania.com","url":"https:\/\/www.sviluppomania.com\/en\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.sviluppomania.com\/en\/#\/schema\/logo\/image\/","url":"https:\/\/www.sviluppomania.com\/wp-content\/uploads\/2020\/12\/SviluppoMania-logo2-_1_.webp","contentUrl":"https:\/\/www.sviluppomania.com\/wp-content\/uploads\/2020\/12\/SviluppoMania-logo2-_1_.webp","width":474,"height":408,"caption":"SviluppoMania.com"},"image":{"@id":"https:\/\/www.sviluppomania.com\/en\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/SviluppoManiaCom","https:\/\/x.com\/SviluppoMania","https:\/\/www.instagram.com\/sviluppomania\/","https:\/\/www.youtube.com\/channel\/UC5CuM88LjzBeC23s2DPdveA"]},{"@type":"Person","@id":"https:\/\/www.sviluppomania.com\/it\/#\/schema\/person\/ae16b620f0e95611f67bb496be059074","name":"MARCO.VERGNANI","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/lh3.googleusercontent.com\/a\/ACg8ocIrc635RIrznZifq60wpv-NGquftAXU0DTmwwGSdlV4FbvhpkIn=s96-c?sz=50","url":"https:\/\/lh3.googleusercontent.com\/a\/ACg8ocIrc635RIrznZifq60wpv-NGquftAXU0DTmwwGSdlV4FbvhpkIn=s96-c?sz=50","contentUrl":"https:\/\/lh3.googleusercontent.com\/a\/ACg8ocIrc635RIrznZifq60wpv-NGquftAXU0DTmwwGSdlV4FbvhpkIn=s96-c?sz=50","caption":"MARCO.VERGNANI"},"description":"Nella mia vita a 12 anni e' entrato a far parte un Intel 80286 con 4MB di RAM, un Hard disk da 20 MB e una primissima scheda VGA appena uscita e da allora mi si e' aperto un mondo pieno di bit. Appassionato di programmazione fin da piccolo, mi diverto a costruire piccoli robottini. Curioso delle molteplici applicazioni che le macchine automatiche possono compiere, e adoro vedere volare quegli strani oggetti chiamati droni.","url":"https:\/\/www.sviluppomania.com\/en\/author\/marco-vergnani\/"}]}},"_links":{"self":[{"href":"https:\/\/www.sviluppomania.com\/en\/wp-json\/wp\/v2\/posts\/7004","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.sviluppomania.com\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.sviluppomania.com\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.sviluppomania.com\/en\/wp-json\/wp\/v2\/users\/174"}],"replies":[{"embeddable":true,"href":"https:\/\/www.sviluppomania.com\/en\/wp-json\/wp\/v2\/comments?post=7004"}],"version-history":[{"count":1,"href":"https:\/\/www.sviluppomania.com\/en\/wp-json\/wp\/v2\/posts\/7004\/revisions"}],"predecessor-version":[{"id":7447,"href":"https:\/\/www.sviluppomania.com\/en\/wp-json\/wp\/v2\/posts\/7004\/revisions\/7447"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.sviluppomania.com\/en\/wp-json\/wp\/v2\/media\/7158"}],"wp:attachment":[{"href":"https:\/\/www.sviluppomania.com\/en\/wp-json\/wp\/v2\/media?parent=7004"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.sviluppomania.com\/en\/wp-json\/wp\/v2\/categories?post=7004"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.sviluppomania.com\/en\/wp-json\/wp\/v2\/tags?post=7004"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}