Outline

• Pengantar Template
• Menangani Beberapa Template
• Mengirim Parameter ke Template
• Template Engine dengan Jinja2
• Struktur Template

Samsu Arif
 Pengantar Template
Contoh program minimal dengan flask - folium

Samsu Arif
 Pengantar Template
Contoh program minimal flask – folium dengan template

• Render sebuah template digunakan modul render_template()

• Berikan nama template dengan ektensi .html (index_template.html)
• Disini disimpan hasil tampilan folium ke dalam sebuah file html (map1.html)
• map1.html dipanggil ke dalam file index_template.html menggunakan Jinja2 Index_template.html
• Secara deafult, flask akan mencari template di folder templates/
Samsu Arif
 Menangani Beberapa Template
Penanganan multi template menggunakan @app.route()

https://localhost:5000

https://localhost:5000/jinja2_folium

Samsu Arif
 Mengirim Parameter ke Template

Variabel dapat dikirim dari konteks Flask ke template yang dirender melalui parameter template

Flask menggunakan Jinja2

sebagai template engine
yang dapat membantu
merender HTML

{{…}} symbol Jinja2 yang

digunakan untuk
menuliskan variabel

Samsu Arif
 Template Engine dengan Jinja2

Paramter inisialisasi Jinja2

• block_start_string : String yang menandai awal blok -> '{%'.

• block_end_string : String yang menandai akhir blok -> '%}'.

• variable_start_string : String yang menandai awal cetak variable -> '{{'.

• variable_end_string : String yang menandai akhir cetak variable -> '}}'.

• comment_start_string : String yang menandai awal untuk mencetak komentar -> '{#'.

• comment_end_string : String yang menandai akhir untuk mencetak komentar -> '#}'.

Samsu Arif
 Struktur Template

Index.html

layout.html

Samsu Arif
 Template Engine dengan Jinja2

• Jinja For Loop structure • Jinja Comparison Operator

{% for item in list %} {% if varX == varY %}
{{item}} {% if varX != varY %}
{% endfor %} {% if varX > varY %}
{% if varX < varY %}
{% if varX >= varY %}
• Jinja If-else structure {% if varX <= varY %}
{% if name in list %}
... do something • Jinja Membership Operator
{% elif name == “John Doe”%}
{% if item in list %}
... do something
{% if item not in list %}
{% else %}
.... do something
{% endif %} • Jinja Identity Operator

{% if objectA is objectB %}
{% if objectA is not none %}

Samsu Arif
Template Engine dengan Jinja2

Samsu Arif
Template Engine dengan Jinja2

Samsu Arif