ホームページ > バックエンド開発 > Python チュートリアル > フラスコテンプレートに深く潜ります

フラスコテンプレートに深く潜ります

Christopher Nolan
リリース: 2025-02-16 11:36:17
オリジナル
818 人が閲覧しました

この記事では、フラスコのテンプレートに関する包括的なガイドを提供し、その重要性、利点、実用的なアプリケーションをカバーしています。 テンプレートの作成とレンダリング、テンプレートの継承とレイアウトの使用、変数と制御構造の操作、フォームとユーザーの入力の取り扱い、組み込みおよびカスタムフィルターの使用、静的ファイルとメディアの管理、高度なテンプレートテクニックの実装を検討します。 あなたが初心者であろうと経験豊富なフラスコの開発者であろうと、この詳細な探索は、動的で視覚的に魅力的なWebインターフェイスを構築するための理解とスキルを高めます。 (注:フラスコの基本的な理解が想定されています。)

A Deep Dive into Flask Templates

なぜフラスコテンプレートを使用するのか? フラスコテンプレートは、十分に構造化され、保守可能で再利用可能なコードに重要です。 プレゼンテーション(UI)をアプリケーションロジックから分離することにより、バックエンドコードを変更せずにUIの更新を簡素化します。この分離は、開発者とデザイナーのコラボレーションを改善します。主な利点は次のとおりです

コードの再利用性:
    複数のページにわたって一貫したUIのための再利用可能なコンポーネント(ヘッダー、フッター、ナビゲーション)を作成します。
  • 読みやすさの改善:HTMLとPythonコードのクリーンな分離は、理解と保守性を高めます。
  • メンテナンスの容易さ:他のものに影響を与えることなく、ロジックまたはテンプレートを個別に更新します。
  • 柔軟性:
  • ダイナミックコンテンツ生成のためにテンプレートとの間でデータを簡単に渡す。
  • テンプレートの作成とレンダリング
  • Flaskテンプレートは、アプリケーションのルートディレクトリ内の
  • ディレクトリにあります。 Flaskは、Jinja2テンプレートエンジンを使用して、さまざまな拡張機能(

など)をサポートします。

に焦点を当てます

アプリケーション構造の例:templates .html .svg単純な.csvテンプレート:.html

Flaskの function:

をレンダリングします

<code>my_app/
├── app.py
└── templates/
    └── index.html</code>
ログイン後にコピー
ログイン後にコピー

テンプレートの継承とレイアウトindex.html

<!DOCTYPE html>
<html>
<head>
  <title>Index</title>
</head>
<body>
  <h1>Welcome</h1>
  <p>This is the index page.</p>
</body>
</html>
ログイン後にコピー
ログイン後にコピー
Jinja2の継承により、共通要素(ヘッダー、フッター、ナビゲーション)を備えたベーステンプレートを作成し、子テンプレートに拡張できます。

render_template()ベーステンプレート(

):
from flask import Flask, render_template

app = Flask(__name__)

@app.route('/')
def index():
  return render_template('index.html')

if __name__ == '__main__':
  app.run()
ログイン後にコピー
ログイン後にコピー

子テンプレート(

):

base.htmlテンプレート変数と制御構造

<!DOCTYPE html>
<html>
<head>
  <title>{% block title %}{% endblock %}</title>
</head>
<body>
  <nav></nav>
  <div class="content">
    {% block content %}{% endblock %}
  </div>
</body>
</html>
ログイン後にコピー
ログイン後にコピー

のキーワード引数またはコンテキスト辞書を使用して、フラスコからテンプレートにデータを渡します。 home.htmlを使用してテンプレート内の変数にアクセスします

{% extends 'base.html' %}

{% block title %}Home - My Website{% endblock %}

{% block content %}
  <h1>Welcome to My Website</h1>
  <p>This is the home page content.</p>
{% endblock %}
ログイン後にコピー
変数の渡し:

render_template(){{ variable_name }}

で変数を使用しています
<code>my_app/
├── app.py
└── templates/
    └── index.html</code>
ログイン後にコピー
ログイン後にコピー

制御構造(if/else、for loopsの場合):

<!DOCTYPE html>
<html>
<head>
  <title>Index</title>
</head>
<body>
  <h1>Welcome</h1>
  <p>This is the index page.</p>
</body>
</html>
ログイン後にコピー
ログイン後にコピー

テンプレートのコンテキストとグローバル変数

テンプレートコンテキストには、テンプレートで使用可能な変数が含まれています。フラスコは、requestsessionconfigurl_for()、およびg(グローバル変数の場合)を提供します。 リクエスト間でデータを共有するには、gを使用してください:

from flask import Flask, render_template

app = Flask(__name__)

@app.route('/')
def index():
  return render_template('index.html')

if __name__ == '__main__':
  app.run()
ログイン後にコピー
ログイン後にコピー

テンプレートフォームとユーザー入力

htmlフォームまたはwtformsライブラリを使用して、堅牢なフォーム処理を行います。 wtformsは検証を提供し、フォーム作成を簡素化します

ビルトインおよびカスタムフィルター

Jinja2は、組み込みのフィルターを提供しています(例:

upperlower)。機能を拡張するためのカスタムフィルターを作成します:capitalize

<!DOCTYPE html>
<html>
<head>
  <title>{% block title %}{% endblock %}</title>
</head>
<body>
  <nav></nav>
  <div class="content">
    {% block content %}{% endblock %}
  </div>
</body>
</html>
ログイン後にコピー
ログイン後にコピー

静的ファイルとメディアを使用して作業します

ディレクトリに静的ファイル(CSS、JS、画像)を保存します。 staticを使用して、テンプレート内のこれらのファイルのURLを生成します。 url_for('static', filename='...')

高度なテンプレートテクニック

    テンプレートインクルージョン(
  • ):一般的なコンポーネントを再利用します。{% include 'partial.html' %}
  • マクロ(
  • ):テンプレート内で再利用可能なコードブロックを作成します。{% macro my_macro(arg) %}{% endmacro %}
  • テンプレートのテストとデバッグ:
  • タグ(開発用)および徹底的なテストを使用して、問題を特定して修正します。 {% debug %}結論

マスタリングフラスコテンプレートは、堅牢で保守可能なWebアプリケーションを構築するための鍵です。 議論された手法を効果的に利用することにより、動的でユーザーフレンドリーで視覚的に魅力的なWebインターフェイスを作成できます。 詳細と高度な機能については、FlaskとJinja2のドキュメントを参照してください。

以上がフラスコテンプレートに深く潜りますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート