大規模なFlaskアプリケーションを構築する方法:FlaskブループリントとFlask-SQLAlchemyの利用
著者は、寄付の一環として「書いてDonate(寄付)するプログラム」によりFree and Open Source Fundを選択しました。
はじめに
Flaskは、軽量なPythonのウェブフレームワークであり、Pythonでウェブアプリケーションを作成するための便利なツールと機能があります。SQLAlchemyは、リレーショナルデータベースに効率的かつ高パフォーマンスなデータベースアクセスを提供するSQLツールキットです。SQLite、MySQL、PostgreSQLなど、いくつかのデータベースエンジンとのインタラクション方法を提供し、データベースのSQL機能へのアクセスを提供します。このツールキットはまた、シンプルなPythonオブジェクトとメソッドを使用してクエリを作成し、データを処理することができるオブジェクト関係マッパー(ORM)も提供しています。Flask-SQLAlchemyは、FlaskとSQLAlchemyをより簡単に使用するためのFlaskの拡張機能であり、Flaskアプリケーションでデータベースとのインタラクションを行うためのツールとメソッドを提供します。
Flaskは、1つのPythonファイルで簡単に小さなWebアプリケーションを作成する方法を提供します。しかし、小さなアプリケーションは複数のデータベーステーブル、数百のルート、複雑な機能を持つ大規模なアプリケーションに成長することがあります。大規模なアプリケーションのコードを1つのファイルに書くと、すぐに乱雑になり、管理が難しくなります。Flaskは、各アプリケーションの主要なパーツを特定のディレクトリとファイルに分割してアプリケーションのコードベースを整理するための仕組みを提供します。これにより、より整理されたアプリケーションを作成することができます。
たとえば、ソーシャルメディアアプリケーションで、ユーザーのルートはroutes.pyというファイルに、usersというディレクトリの中に保存されるでしょう。そして、ユーザーのデータベースモデルはusers.pyというモジュールに、modelsディレクトリの中に集められるでしょう。同様に、投稿やフォロワー、ハッシュタグ、質問、回答、広告、マーケットプレイス、支払いなど、大規模なソーシャルメディアアプリケーションの他の機能にも同様の方法で対応できます。もし支払いのビジネスロジックを編集したい場合には、mysocialapp/models/payment.pyにある支払いのデータベースコードを変更し、さらにmysocialapp/payments/routes.pyにあるビジネスロジックを変更することができます。アプリケーションの各部分は異なるファイルとディレクトリに分けられており、管理しやすいコンポーネントに分割されています。この構造は、新しい開発者がアプリケーションを理解し、問題をトラブルシューティングしたり新機能を追加したりする際に役立ちます。
Flaskは、アプリケーションコンポーネントを作成するための機能であるブループリントを提供しています。前の例では、ユーザー用のブループリント、投稿用のブループリント、フォロワー用のブループリントなど、異なるブループリントを使用して大規模なソーシャルメディアアプリケーションを構造化することができます。
このチュートリアルでは、Flaskのブループリントを使用して、Webアプリケーションを3つのコンポーネントで構築します。メインのブループリントには、ホームページやその他の主要なルートが含まれており、ブログ記事の管理には「ポスト」のブループリント、質問と回答には「クエスチョン」のブループリントが使用されます。
必要条件 (Hitsuyōjōken)
- A local Python 3 programming environment, which you can set up by following the tutorial for your distribution in How To Install and Set Up a Local Programming Environment for Python 3 series. In this tutorial, we’ll call our project directory flask_app.
- An understanding of basic Flask concepts, such as routes, view functions, and templates. If you are not familiar with Flask, check out How to Create Your First Web Application Using Flask and Python and How to Use Templates in a Flask Application.
- An understanding of basic HTML concepts. You can review our How To Build a Website with HTML tutorial series for background knowledge.
- An understanding of basic Flask-SQLAlchemy concepts, such as setting up a database, creating database models, and inserting data into the database. See How to Use Flask-SQLAlchemy to Interact with Databases in a Flask Application for background knowledge.
ターゲットアプリケーションの構造
チュートリアルの終了時には、以下の構造を持つFlaskアプリケーションを構築することができます。
.
└── flask_app
├── app
│ ├── extensions.py
│ ├── __init__.py
│ ├── main
│ │ ├── __init__.py
│ │ └── routes.py
│ ├── models
│ │ ├── post.py
│ │ └── question.py
│ ├── posts
│ │ ├── __init__.py
│ │ └── routes.py
│ ├── questions
│ │ ├── __init__.py
│ │ └── routes.py
│ └── templates
│ ├── base.html
│ ├── index.html
│ ├── posts
│ │ ├── categories.html
│ │ └── index.html
│ └── questions
│ └── index.html
├── app.db
└── config.py
あなたのflask_appディレクトリの中には、app.dbというデータベースファイルとconfig.pyというFlaskアプリケーションの設定ファイルがあります。メインのFlaskアプリケーションはappディレクトリ内にあり、正しく動作するためには__init__.pyという特別なファイルが含まれている必要があります。このファイルはパッケージとしての役割を果たし、Flaskアプリケーションインスタンスを作成するための関数も含まれています。
次のように日本語で表現します(1つのオプションのみ):
アプリのディレクトリには、アプリケーションで使用するFlaskの拡張機能を管理するためのextensions.pyファイルが含まれています(このチュートリアルでは、Flask-SQLAlchemyを使用する例です)。また、以下のディレクトリも存在します。
- main: the main blueprint for main routes, such as the home page.
- posts: the posts blueprint for managing blog posts.
- questions: the questions blueprint for managing questions and answers.
- models: the directory that will contain Flask-SQLAlchemy models.
- templates: the templates directory that will contain files for the main blueprint and a directory for each blueprint.
ステップ1 – FlaskとFlask-SQLAlchemyのインストール
このステップでは、アプリケーションに必要なパッケージをインストールします。
フラスクアプリのディレクトリで、仮想環境をアクティブ化してください。
- source my_env/bin/activate
あなたの仮想環境が有効になっている状態で、pipを使ってFlaskとFlask-SQLAlchemyをインストールしてください。
- pip install Flask Flask-SQLAlchemy
インストールが完了すると、出力には次のような行が表示されます。
Successfully installed Flask-2.1.2 Flask-SQLAlchemy-2.5.1 Jinja2-3.1.2 MarkupSafe-2.1.1 SQLAlchemy-1.4.39 Werkzeug-2.1.2 click-8.1.3 greenlet-1.1.2 itsdangerous-2.1.2
次のステップでは、必要なPythonパッケージをインストールした後、Flaskアプリケーションの設定を管理するための設定ファイルを設定します。
ステップ2 – 設定ファイルの作成
この手順では、Flaskアプリケーションの設定ファイルを作成します。アプリケーションの設定を他の部分から分離し、設定の変更を容易にします。この設定ファイルでは、シークレットキー、SQLAlchemyデータベースのURIなどを設定します。
フラスクアプリのディレクトリで、config.pyという新しいファイルを開いてください。このファイルには、フラスクアプリの設定が入ります。
- nano config.py
以下のコードを追加してください。
import os
basedir = os.path.abspath(os.path.dirname(__file__))
class Config:
SECRET_KEY = os.environ.get('SECRET_KEY')
SQLALCHEMY_DATABASE_URI = os.environ.get('DATABASE_URI')\
or 'sqlite:///' + os.path.join(basedir, 'app.db')
SQLALCHEMY_TRACK_MODIFICATIONS = False
ファイルを保存して閉じてください。
ファイルシステムにアクセスするために、osモジュールをインポートします。データベースファイルのパスを正しく設定するために、os.path.abspath(os.path.dirname(__file__))を使って基本ディレクトリを確立します。
クラス変数を使用して、Configというクラスを使います。ここでは、3つの設定を行います。
- SECRET_KEY: A long random string used by Flask as a secret key, or a key used to secure the sessions that remember information from one request to another. The user can access the information stored in the session but cannot modify it unless they have the secret key, so you must never allow anyone to access your secret key. See the Flask documentation on sessions for more information. Other Flask extensions often use this secret key to secure data. See Step 3 of How To Use Web Forms in a Flask Application for more information on how to create a secure secret key. When developing your Flask applications, you should set the secret key with an environment variable called SECRET_KEY. To get its value in this config.py file and save it in a class variable called SECRET_KEY, you access the environment variable’s value via the os.environ object using its get() method. (Though you do not need to set a secret key to follow this tutorial, you can review the note at the end of this list for instructions on how to set a secret key.)
- SQLALCHEMY_DATABASE_URI: The database URI specifies the database you want to establish a connection with using SQLAlchemy. In this case, you either get it from a DATABASE_URI environment variable or you set a default value. The default URI value here follows the format sqlite:///path/to/app.db. You use the os.path.join() function to join the base directory you constructed and stored in the basedir variable and the app.db file name. With this, creating a Flask application without setting a DATABASE_URI environment variable will connect to an app.db database file in your flask_app directory by default. The file will be created when you create your database tables. If you’d like to set a database URI for a different SQL engine, see Step 2 of How to Use Flask-SQLAlchemy to Interact with Databases in a Flask Application.
- SQLALCHEMY_TRACK_MODIFICATIONS: A configuration to enable or disable tracking modifications of objects. You set it to False to disable tracking and use less memory. For more, you can read the configuration page in the Flask-SQLAlchemy documentation.
Note
export SECRET_KEY=”あなたの秘密キー”
同様に、データベースのURIも次のように設定できます(Windowsの場合は、setを使用してください):
export DATABASE_URI=”postgresql://ユーザー名:パスワード@ホスト:ポート/データベース名”
あなたはアプリケーションの設定ファイルを今設定しました。次に、Flaskアプリケーションのインスタンスをセットアップし、Flaskアプリケーションの異なるコンポーネントを表すいくつかのブループリントを作成します。
ステップ3 — フラスクのアプリケーションファクトリの作成
この手順では、Flaskアプリケーションファクトリーを作成します。Flaskアプリケーションインスタンスを設定するPython関数です。
チュートリアルのこの時点では、あなたのflask_appディレクトリの構造は以下のようになっています(仮想環境のディレクトリを除く):
.
├── flask_app
└── config.py
アプリケーションのコアコードはプロジェクトディレクトリ内に存在し、Pythonパッケージとして扱われます。このチュートリアルでは、それを「app」と呼びますが、プロジェクトの名前や他の一般的なディレクトリ名(例: src、coreなど)でも構いません。
アプリケーションのコアコードを含むフォルダをPythonパッケージにすることで、コード全体での正しいインポートができるようにし、保守性を高めます。
アプリのプロジェクトディレクトリをPythonパッケージにするために、内部に特別な__init__.pyファイルを作成します。この__init__.pyファイルは、ディレクトリをPythonパッケージとしてマークする役割を持ちます。この__init__.pyファイルには、Flaskのファクトリ関数のコードが含まれます。ファクトリ関数は、Flaskのアプリケーションインスタンスを設定し作成するために使用される関数であり、すべてのFlaskのブループリントをリンクする中心的な機能と考えることができます。ファクトリ関数は、異なる目的や異なる構成で異なるFlaskのアプリケーションインスタンスを作成するために使用することができます。例えば、適切なテスト構成を持つテスト用のFlaskアプリケーションインスタンスを作成するためにファクトリ関数を使用することができます。
あなたのflask_appディレクトリ内に、この新しいアプリディレクトリを作成してください。
- mkdir app
それから、アプリのディレクトリ内に新しい__init__.pyファイルを開いてください。
- nano app/__init__.py
それに以下のコードを追加してください。
from flask import Flask
from config import Config
def create_app(config_class=Config):
app = Flask(__name__)
app.config.from_object(config_class)
# Initialize Flask extensions here
# Register blueprints here
@app.route('/test/')
def test_page():
return '<h1>Testing the Flask Application Factory Pattern</h1>'
return app
ファイルを保存して閉じる。 (Fairu o hozon shite tojiru.)
このファイルでは、FlaskパッケージからFlaskクラスをインポートします。そして、前のステップで作成したflask_appディレクトリ内のconfig.pyファイルからConfig設定クラスをインポートします。
create_app()関数は、Flaskアプリケーションのファクトリ関数です。それは、おなじみのapp = Flask(__name__)の行を使用して、Flask()クラスからappというアプリケーションインスタンスを作成します。app.config.from_object()メソッドを使用してオブジェクトから設定値をインポートし、config_classパラメータの値を渡すことでアプリケーションを設定します(デフォルト値としてConfigクラスを保持します)。Flask拡張機能は、# Flask拡張機能を初期化する場所に以降し、作成した後は、# ここでアプリケーションのブループリントを登録します。
アプリケーションファクトリ内でapp.route()デコレータを使用してテストルートを作成し、アプリケーションファクトリ内にルートを登録する方法を示すためのテストルートを作成します。この場合、test_page()ビュー関数はTesting the Flask Application Factory Patternという見出しを返します。
最後に、create_app() ファクトリ関数は、行 return app で構築したアプリケーションインスタンスを返します。
Flaskは、自動的にアプリケーションのパッケージ内にあるcreate_app()ファクトリ関数を検出し、それを使用してアプリケーションインスタンスを作成します。しかし、開発モードでFlaskアプリケーションを実行するために必要な環境変数を最初に設定する必要があります。
あなたの仮想環境がアクティブな状態でflask_appディレクトリにいる場合、コアアプリケーションのディレクトリ名「app」をFLASK_APP環境変数として指定し、フラスコにファクトリ関数の場所を伝えます。そして、FLASK_ENV環境変数をdevelopmentに設定して、開発モードでアプリケーションを実行し、デバッガにアクセスします。フラスコデバッガの詳細については、「フラスコアプリケーションでエラーを処理する方法」を参照してください。
まず、create_app() ファクトリ関数を探す場所として、アプリパッケージを Flask に設定してください。
- export FLASK_APP=app
あなたは、Flaskアプリケーションをapp.pyという1つのPythonファイルに構築することに慣れているかもしれません。その場合、同じコマンドを使用してFlaskにアプリケーションの場所を教えることもできます。ここでの違いは、前述のコマンドの”app”はプロジェクトのコアディレクトリであり、__init__.pyファイルが存在する場所です。
アプリケーションを開発モードで実行するために、FLASK_ENV環境変数を設定してください。
- export FLASK_ENV=development
その後、アプリケーションを実行してください。
- flask run
開発サーバーを稼働させたまま、ブラウザを使って以下のURLにアクセスしてください。
http://127.0.0.1:5000/test/
サイトは、「Flaskアプリケーションのファクトリーパターンをテストしています」という見出しでロードされます。
今、あなたはFlaskアプリケーションのファクトリ関数を作成しました。次に、このファクトリ関数でFlaskのブループリントを作成して登録します。
4ステップ — Flaskブループリントの作成
このステップでは、Flaskアプリケーションのメインコンポーネントを管理するメインルートの設計図を作成し、その設計図をファクトリ関数に登録します。ブログ投稿、質問、回答それぞれに別の設計図を作成します。それぞれの設計図にいくつかのルートを追加し、各ルートに対してテンプレートをレンダリングするためのテンプレートディレクトリを作成します。
チュートリアルのこの時点で、あなたのflask_appディレクトリの構造は以下のようになっています(仮想環境のディレクトリは除く)。
.
├── flask_app
├── app
│ └── __init__.py
└── config.py
メインの設計図を作成し、そのテンプレートをレンダリングする。
今、アプリケーションのメイン設計図を作成し、テンプレートをレンダリングします。
前の手順で開始した開発サーバーを動かしたままにして、新しいターミナルを開いてください。
新しいターミナルでflask_appディレクトリに移動してください。その後、appディレクトリ内にmainというディレクトリを作成してください。
- mkdir app/main
次に、新しいmainディレクトリ内に新しい__init__.pyメインファイルを開いてください。
- nano app/main/__init__.py
ここがあなたのメイン設計図を作成する場所です。以下のコードをこのファイルに追加してください。
「flask_app/app/main/__init__.py」
from flask import Blueprint
bp = Blueprint('main', __name__)
ファイルを保存して閉じてください。
ここでは、flaskパッケージからBlueprintクラスをインポートします。次に、このクラスを使用して、名前(この場合は「main」)と現在のPythonモジュールの名前を保持している__name__特殊変数の2つの引数を渡して、blueprintオブジェクトbpを作成します。
今、あなたはブループリントオブジェクトを持っています。これには後でルートと関数を追加できます。それは、以前のステップで作成したcreate_app()ファクトリ関数を使用して作成したFlaskアプリケーションに組み込むことができます。
次に、メインのブループリントディレクトリ内にroutes.pyファイルを作成します。このファイルには、メインのブループリントのルートが保存されます。新しいroutes.pyファイルをメインのブループリントディレクトリ内に開いてください。
- nano app/main/routes.py
新しいファイル内に次のルートを追加して、bpオブジェクトを使用してルートを作成します。
from app.main import bp
@bp.route('/')
def index():
return 'This is The Main Blueprint'
ファイルを保存して閉じる。
ここでは、メインブループリントからbpブループリントオブジェクトをインポートしていますが、このメインブループリントはapp.mainを介してアクセスします。インポートの行では、appはプロジェクトのパッケージ、mainはメインブループリントパッケージ、そしてbpはメインブループリントの __init__.py ファイルで宣言したオブジェクトです。
あなたは、bpオブジェクトを使用して、/ルートとindex()ビュー関数を作成します。参考として、おなじみのapp.route()デコレータと同様に、bp.route()デコレータを使います。
これらのルートをFlaskが使用し、ブループリントから直接インポート可能にするには、ブループリントの__init__.pyファイルでこのroutes.pyファイルをインポートする必要があります。編集するために開いてください。
- nano app/main/__init__.py
ファイルの最後に、ハイライトされたimport行を追加してください。
from flask import Blueprint
bp = Blueprint('main', __name__)
from app.main import routes
ファイルを保存して閉じてください。
この追加により、設計図の登録時にそのルートも登録されます。
ブループリントを作成し、ルートを追加したら、Flaskにこの新しいブループリントを通知して、Flaskアプリケーションの一部として扱えるようにする必要があります。このために、Flaskアプリケーションファクトリー関数内でブループリントを登録します。
アプリのファクトリ関数の編集を行うために、app/__init__.pyファイルを開いてください。
- nano app/__init__.py
以下のブロックにハイライトされている行を追加し、create_app()ファクトリ関数を編集してください。
flask_app/app/main/__init__.pyを日本語で言い換えると、以下のようになります。
フラスクアプリ/メイン/__init__.py
...
def create_app(config_class=Config):
app = Flask(__name__)
app.config.from_object(config_class)
# Initialize Flask extensions here
# Register blueprints here
from app.main import bp as main_bp
app.register_blueprint(main_bp)
@app.route('/test/')
def test_page():
return '<h1>Testing the Flask Application Factory Pattern</h1>'
return app
ファイルを保存して閉じてください。
メインのブループリントからbpブループリントオブジェクトをインポートし、可読性のためにmain_bpという名前にリネームします。そして、app.register_blueprint()メソッドを使用して、このメインのブループリントをFlaskがアプリケーションの一部として扱うように登録します。
開発用サーバーを起動した状態で、以下のURLにアクセスしてください。
http://127.0.0.1:5000/
このページは「メインブループリント」というテキストで読み込まれます。これはメインルートで返されるテキストです。
あなたは現在、アプリケーション内のルートを持つ設計図を持っています。次に、Flaskの設計図を使用してテンプレートを表示するためのメインルートを編集します。これにより、テンプレートのレンダリング方法が示されます。
メインブループリントのroutes.pyファイルを開いて修正してください。
- nano app/main/routes.py
ハイライトされた行のあるファイルを編集してください。
flask_app/app/main/routes.pyを日本語で言い換えると、以下のようになります:
フラスクアプリ/app/main/routes.py
from flask import render_template
from app.main import bp
@bp.route('/')
def index():
return render_template('index.html')
ファイルを保存して閉じる。
ここでは、render_template()関数をインポートし、それを使用してindex.htmlというテンプレートファイルを描画するためのルートで使います。
今後は、コードの繰り返しを避けるために、他のすべてのテンプレートで共有されるテンプレートディレクトリと基本テンプレートを作成する必要があります。
アプリディレクトリ内にテンプレートディレクトリを作成してください。 (Apuri direkutori ni tenpureto direkutori o sakusei shite kudasai.)
- mkdir app/templates
新しいファイルを作成し、base.htmlという名前でベーステンプレートとして開きます。
- nano app/templates/base.html
新しいファイルに次のコードを追加してください。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>{% block title %} {% endblock %} - FlaskApp</title>
<style>
h2 {
width: 100%;
}
.title {
margin: 5px;
width: 100%;
}
.content {
margin: 5px;
width: 100%;
display: flex;
flex-direction: row;
flex-wrap: wrap;
}
.post {
flex: 20%;
padding: 10px;
margin: 5px;
background-color: #f3f3f3;
inline-size: 100%;
}
.title a {
color: #00a36f;
text-decoration: none;
}
nav a {
color: #d64161;
font-size: 3em;
margin-left: 50px;
text-decoration: none;
}
</style>
</head>
<body>
<nav>
<a href="{{ url_for('main.index') }}">FlaskApp</a>
<a href="#">Posts</a>
<a href="#">Categories</a>
<a href="#">Questions</a>
</nav>
<hr>
<div class="content">
{% block content %} {% endblock %}
</div>
</body>
</html>
ファイルを保存して閉じる。
このベーステンプレートには、他のテンプレートでも再利用するHTMLの雛形が含まれています。
ベーステンプレートには、タイトルブロック、いくつかのCSS、アプリケーションの異なる部分へのリンクを提供するナビゲーションバー、そしてコンテンツブロックが含まれています。ベーステンプレートの詳細については、「Flaskアプリケーションでテンプレートを使用する方法」を参照してください。
url_for()関数を使用してルートにリンクする際には、構文blueprint_name.view_function_nameを使用します。インデックスページはメインブループリント内のindex()ビュー関数で処理されるため、リンクを作成するためにurl_for()関数にmain.indexを渡します。
今、メインブループリントの index() ビュー関数でレンダリングした index.html ファイルを作成してください。
- nano app/templates/index.html
新しく作成したファイルに次のコードを追加してください。
{% extends 'base.html' %}
{% block content %}
<span class="title"><h1>{% block title %} The Home Page of FlaskApp {% endblock %}</h1></span>
<div class="content">
<h2>This is the main Flask blueprint</h2>
</div>
{% endblock %}
ファイルを保存して閉じる。 (Fairu o hozon shite tojiru)
ここでは、ベーステンプレートを拡張します。コンテンツブロックを置き換え、
見出しをタイトルとして使用し、
見出しを使用して、インデックスページがメインのFlaskブループリントの一部であることを示します。
開発サーバーを稼働させた状態で、ブラウザでインデックスページにアクセスするか、既に開いている場合はリフレッシュしてください。
http://127.0.0.1:5000/
以下の画像と似たようなページが読み込まれます。
今、あなたはブループリントを設定し、そのroutes.pyファイルにルートを追加し、アプリケーションに登録し、テンプレートを描画しました。次に、ブログ記事用の別のブループリントを作成します。
投稿の設計図を作成し、テンプレートをレンダリングする。
今、ブログ記事のブループリントを作成し、登録し、テンプレートをレンダリングします。
チュートリアルのこの時点では、あなたのflask_appディレクトリ構造は次のようになっています(仮想環境のディレクトリは除く)。
.
├── flask_app
├── app
│ ├── __init__.py
│ ├── main
│ │ ├── __init__.py
│ │ └── routes.py
│ └── templates
│ ├── base.html
│ └── index.html
└── config.py
以前のセクションと同じ手順に従って、ブログ投稿の新しい設計図を作成します。
最初に、青写真のファイルを保持する新しい投稿ディレクトリを作成してください。 (Saisho ni, aoshirazu no fairu wo jizishu suru atarashii toukou directory wo sakusei shite kudasai.)
- mkdir app/posts
次に、新しい「__init__.py」ファイルを新しい投稿ディレクトリの中に開いてください。
- nano app/posts/__init__.py
BPの設計図オブジェクトを作成し、作成するルートをブループリントのroutes.pyファイルにインポートします。
from flask import Blueprint
bp = Blueprint('posts', __name__)
from app.posts import routes
ファイルを保存して閉じてください。
前のコードブロックでは、青写真の名前として「posts」という名前を使用します。また、まだ作成していない「routes.py」ファイルからルートをインポートしています。
次に、新しいroutes.pyファイルを開きます。このファイルに投稿のルートを記述します。
- nano app/posts/routes.py
このファイルに次のルートを追加してください。
「flask_app/app/posts/routes.py」
from flask import render_template
from app.posts import bp
@bp.route('/')
def index():
return render_template('posts/index.html')
@bp.route('/categories/')
def categories():
return render_template('posts/categories.html')
ファイルを保存して閉じてください。
ここでは、2つのルートがあります。1つはアプリケーションの投稿コンポーネントのインデックスページのためのルートで、もう1つは投稿コンポーネントに含まれるカテゴリのためのルートです。
インデックスルートでは、パスが「posts/index.html」となるテンプレートファイルをレンダリングします。これは、Flaskがテンプレートディレクトリ内にpostsという名前のディレクトリを探し、その中にあるindex.htmlファイルを探すという意味です。
カテゴリールートでは、categories.htmlテンプレートを使用して、テンプレートフォルダ内のpostsディレクトリ内に表示されます。
テンプレートディレクトリ内に、新しい投稿ディレクトリを作成してください。
- mkdir app/templates/posts
次に、ポストディレクトリ内に新しいindex.htmlファイルを作成します。これは、ポストのブループリントのindex()ビュー関数でレンダリングするファイルです。
- nano app/templates/posts/index.html
新しく作成されたファイルに、以下のコードを追加してください。
{% extends 'base.html' %}
{% block content %}
<span class="title"><h1>{% block title %} The Posts Page {% endblock %}</h1></span>
<div class="content">
<h2>This is the posts Flask blueprint</h2>
</div>
{% endblock %}
ファイルを保存して閉じる。
ここで基本テンプレートを拡張します。また、タイトルとして
見出しと、投稿ブループリントの一部としてページをマークするための
見出しも設定します。
次に、postsディレクトリ内に新しいcategories.htmlファイルを作成します。これは、postsブループリントのcategories()ビュー関数でレンダリングされるファイルです。
- nano app/templates/posts/categories.html
新しく作成されたファイルに、以下のコードを追加してください。
以下は、日本語にネイティブな形で言い換えられたものです。
flask_app/app/templates/posts/categories.html -> flaskアプリケーションのテンプレート/posts/categories.html
{% extends 'base.html' %}
{% block content %}
<span class="title"><h1>{% block title %} Categories {% endblock %}</h1></span>
<div class="content">
<h2>This is the categories page within the posts blueprint</h2>
</div>
{% endblock %}
ファイルを保存し、閉じてください。
ベーステンプレートを拡張し、
見出しをタイトルとして、
見出しを投稿の設計図の一部としてページに付けます。
記事の設計図を作成し、ルートを追加し、レンダリングされたテンプレートを作成しました。これをFlaskのファクトリ関数に登録して、アプリケーションの一部として認識させます。
アプリの__init__.pyファイルを開いて、ファクトリー関数を編集してください。
- nano app/__init__.py
ハイライトされた行を追加して、create_app() ファクトリー関数を編集します。
def create_app(config_class=Config):
app = Flask(__name__)
app.config.from_object(config_class)
# Initialize Flask extensions here
# Register blueprints here
from app.main import bp as main_bp
app.register_blueprint(main_bp)
from app.posts import bp as posts_bp
app.register_blueprint(posts_bp, url_prefix='/posts')
@app.route('/test/')
def test_page():
return '<h1>Testing the Flask Application Factory Pattern</h1>'
return app
ファイルを保存して閉じてください。
ここでは、投稿のブループリントパッケージからbpブループリントオブジェクトをインポートし、可読性のためにposts_bpという名前を付けました。
app.register_blueprint()メソッドを使用して、posts_bpブループリントオブジェクトを渡すことで、投稿のブループリントを登録します。また、url_prefixパラメータに’/posts’の値を渡すこともあります。これにより、この文字列でブループリントのルートがプレフィックスされます。例えば、postsブループリントのメインの/ルートは/posts/を介してアクセスできるようになり、/categoriesルートは/posts/categories/になります。
新しい投稿のブループリントが登録され、開発サーバーが稼働している場合は、ブラウザを使用して以下のURLに移動してください。
http://127.0.0.1:5000/posts/
http://127.0.0.1:5000/posts/categories/
The heading of the “The Posts Page” will be displayed when accessing the http://127.0.0.1:5000/posts/ page. On the other hand, the heading of “Categories” will be displayed when accessing the http://127.0.0.1:5000/posts/categories/ page.
ナビゲーションバーにある「投稿」と「カテゴリー」のリンクを機能させるために、ベーステンプレートを編集する必要があります。
- nano app/templates/base.html
ハイライトされた表現で、