プログラミング

Flaskテンプレートの基本ガイド

FlaskはPythonで開発されている軽量のWebフレームワークで、Webアプリケーションを迅速に構築できることから多くの開発者に愛用されています。このフレームワークは、そのシンプルさと拡張性によって、個々のプロジェクトに合わせて柔軟に適応できる特徴があります。Flaskを使用する上で重要な概念の一つが「テンプレート」です。本記事では、Flaskのテンプレートについて、基本的な使い方から詳細な機能までを網羅的に解説します。

Flaskにおけるテンプレートとは?

Flaskでは、HTMLの出力を動的に生成するために「テンプレート」を使用します。テンプレートは、ユーザーが要求するデータを表示するためにHTMLコードに埋め込むことができ、これを行うためにFlaskは「Jinja2」というテンプレートエンジンを利用しています。

Jinja2は、Pythonで記述されたテンプレートエンジンで、PythonコードをHTMLに埋め込むことができます。Flaskにおいて、HTMLファイルは通常「templates」フォルダ内に配置され、このフォルダ内のテンプレートが動的にレンダリングされます。

テンプレートの基本的な使い方

Flaskでは、render_template関数を使ってテンプレートをレンダリングします。この関数は、指定したテンプレートファイルをHTMLに変換し、その結果をブラウザに送信します。

基本的な例

まず、Flaskのインストールと基本的なセットアップを行います。

bash
pip install Flask

次に、簡単なFlaskアプリケーションを作成してみましょう。

python
from flask import Flask, render_template app = Flask(__name__) @app.route('/') def home(): return render_template('index.html', message="こんにちは、Flask!") if __name__ == '__main__': app.run(debug=True)

上記のコードでは、home()関数内でrender_templateを呼び出して、index.htmlというテンプレートをレンダリングしています。また、message="こんにちは、Flask!"という変数をテンプレートに渡しています。この変数は、テンプレート内で動的に表示されます。

index.html(テンプレートファイル)

html
html> <html lang="ja"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Flask アプリケーションtitle> head> <body> <h1>{{ message }}h1> body> html>

このHTMLファイルでは、{{ message }}という構文を使用して、Flaskから渡されたmessage変数の値が表示されます。Flaskアプリケーションを実行すると、ブラウザに「こんにちは、Flask!」と表示されます。

変数の利用

テンプレート内では、Flaskから渡された変数を表示するだけでなく、条件分岐やループを使ってより複雑な処理を行うこともできます。Jinja2の構文を利用して、Pythonの制御フローをテンプレート内で記述することができます。

条件分岐

以下の例では、渡された変数is_logged_inによって異なるメッセージを表示します。

python
@app.route('/profile') def profile(): is_logged_in = True return render_template('profile.html', is_logged_in=is_logged_in)
html
html> <html lang="ja"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>ユーザープロファイルtitle> head> <body> {% if is_logged_in %} <p>ようこそ、ユーザーさん!p> {% else %} <p>ログインしてください。p> {% endif %} body> html>

ここでは、if文を使ってis_logged_inTrueの場合には「ようこそ、ユーザーさん!」というメッセージを表示し、そうでない場合には「ログインしてください。」というメッセージが表示されます。

ループ

Jinja2では、リストや辞書などのコレクションをループ処理することができます。例えば、ユーザーリストを表示する場合、以下のように記述します。

python
@app.route('/users') def users(): users_list = ['太郎', '花子', '次郎'] return render_template('users.html', users=users_list)
html
html> <html lang="ja"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>ユーザーリストtitle> head> <body> <ul> {% for user in users %} <li>{{ user }}li> {% endfor %} ul> body> html>

このテンプレートでは、for文を使ってusersリストの各要素をリストアイテムとして表示しています。

テンプレートの継承

Flaskでは、HTMLの再利用性を高めるために、テンプレートの継承機能を利用することができます。これにより、共通のレイアウトを持つテンプレートを作成し、個別のページでそのレイアウトを継承して使うことができます。

基本レイアウト

まず、base.htmlという基底テンプレートを作成します。このテンプレートは、全てのページで共通するヘッダーやフッターを持ちます。

html
html> <html lang="ja"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Flask アプリケーションtitle> head> <body> <header> <h1>Flask アプリh1> header> <div> {% block content %}{% endblock %} div> <footer> <p>© 2025 Flask アプリp> footer> body> html>

このbase.htmlには{% block content %}という部分があり、各ページがこの部分を上書きすることができます。

サブページのテンプレート

次に、index.htmlのようなページがbase.htmlを継承する方法を見てみましょう。

html
{% extends "base.html" %} {% block content %} <h2>ホームページh2> <p>Flaskを使って動的なWebページを作成しています。p> {% endblock %}

ここでは、{% extends "base.html" %}base.htmlを継承し、{% block content %}内にそのページ固有のコンテンツを挿入しています。この方法で、レイアウトの重複を避けることができ、コードの保守性が向上します。

テンプレートのフィルタとマクロ

Jinja2では、テンプレート内でのデータの加工や処理を簡単に行うことができる「フィルタ」や、繰り返し使用するコードをまとめておける「マクロ」もサポートしています。

フィルタ

例えば、文字列を大文字に変換するupperフィルタを使うことができます。

html
<p>{{ 'hello'|upper }}p>

この場合、出力は「HELLO」になります。

マクロ

マクロを使うと、再利用可能なHTMLの断片を作成できます。例えば、以下のように定義できます。

html
{% macro render_user(user) %} <p>{{ user.name }} ({{ user.email }})p> {% endmacro %}

そして、これをテンプレート内で呼び出して再利用することができます。

html
{% import 'macros.html' as macros %} {{ macros.render_user(user) }}

まとめ

Flaskのテンプレートは、Webアプリケーションのフロントエンドとバックエンドのロジックを分離し、効率的にデータを表示するための重要なツールです。Jinja2を利用したテンプレートエンジンは、変数の埋め込み、条件分岐、ループ、継承、フィルタ、マクロなど、さまざまな機能を提供し、柔軟かつ強力なテンプレートを作成することができます。

Flaskを使ったWebアプリケーションの開発において、テンプレートの活用はその効果的な構築に欠かせない要素です。

Back to top button