Jinja2の使い方 | テンプレートエンジン | Python本格超入門

現在作成中です。今後加筆修正してまいります。
スポンサーリンク
スポンサーリンク

Jinja2の使い方

Jinja2はFlaskで使用されるテンプレートエンジンであり、HTMLファイルの中でPythonコードを埋め込み、動的にページを生成することができます。この節では、基本的なJinja2の使い方について学びます。

Jinja2とは

Jinja2は、テンプレートファイル（通常はHTML）にPythonの変数や制御構造を埋め込むことができるテンプレートエンジンです。Flaskでは、このJinja2を用いて動的なWebページを簡単に作成することができます。

FlaskでのJinja2テンプレートの使用

Flaskでは、render_template関数を使用して、HTMLテンプレートファイルをレンダリングします。次に、Flaskの基本的なルーティングとともにJinja2を使って変数をテンプレートに渡す方法を解説します。

from flask import Flask, render_template

app = Flask(__name__)

@app.route('/')
def index():
    # テンプレートに渡すデータ
    data = {
        "title": "ようこそ、Flaskアプリへ",
        "description": "これはFlaskとJinja2を使ったシンプルなアプリケーションです。",
        "items": ["アイテム1", "アイテム2", "アイテム3"]
    }
    # index.htmlをレンダリングし、変数dataをテンプレートに渡す
    return render_template('index.html', data=data)

if __name__ == '__main__':
    app.run(debug=True)

Jinja2テンプレートの作成

次に、Jinja2テンプレートファイル（index.html）の作成方法を説明します。このテンプレートでは、Flaskから渡されたデータを表示します。

<!-- templates/index.html - Jinja2テンプレートファイル -->
<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>{{ data.title }}</title>
</head>
<body>
    <h1>{{ data.title }}</h1>
    <p>{{ data.description }}</p>

    <h2>アイテム一覧</h2>
    <ul>
        <!-- itemsリストをループして表示 -->
        {% for item in data.items %}
        <li>{{ item }}</li>
        {% endfor %}
    </ul>
</body>
</html>

Jinja2の構文

Jinja2の構文は、Pythonコードを埋め込むために次のような特殊なタグを使用します。

構文 説明
{{ 変数 }} 変数の値を表示します。
{% if 条件 %} ... {% endif %} 条件分岐を行います。
{% for item in items %} ... {% endfor %} リストなどをループ処理します。

変数の表示

Jinja2では、{{ }} を使用して、Pythonの変数をテンプレート内に表示することができます。

{{ data.title }}  <!-- Flaskから渡された変数dataのtitleを表示 -->

条件分岐とループ処理

Jinja2では、制御構造を使って条件分岐やループ処理を行うことができます。{% %} を使用してif文やfor文を記述します。

{% if data.items %}
    <ul>
        {% for item in data.items %}
        <li>{{ item }}</li>
        {% endfor %}
    </ul>
{% else %}
    <p>アイテムがありません。</p>
{% endif %}

まとめ

今回の記事では、Flaskで使用されるJinja2テンプレートエンジンの基本的な使い方について説明しました。Jinja2を使うことで、動的なWebページを簡単に作成でき、変数の表示、条件分岐、ループなどの制御構造を簡潔に記述できます。次に学ぶステップとしては、複雑なテンプレートの継承や、フィルターを使ったデータ加工などが挙げられます。

スポンサーリンク