はじめに
今回から新しい連載として、Pythonの軽量WebフレームワークFlaskを使った「家計簿アプリ」の開発を通して、Pythonでのバックエンド開発の基礎を学んでいく企画をスタートする。
これまで本ブログの「GitHubでつくって学ぶ」シリーズでは、Reactを使ってブラウザの中だけで完結するアプリ（予定管理アプリ）を作ってきた。今回はその一歩先として、データベースにデータを保存する仕組みや、サーバー側でデータを処理する仕組みを持つアプリに挑戦する。
完成形としては、支出を記録し、月別・カテゴリ別に集計できる家計簿アプリを目指す。最終回では、実際にインターネット上へ公開するところまで行う予定である。
初回となる今回は、Codespaces上でFlaskの開発環境を整え、ブラウザに「Hello, PC-LABO!」と表示するだけの、最小限のアプリを動かすところまでを扱う。
今回やること
- Flaskとは何かを知る
- Codespaces上に、Flask用の開発環境（仮想環境）を作る
- 最小構成のFlaskアプリを書き、ブラウザで表示を確認する
Flaskとは
Flaskは、Pythonで書かれた軽量なWebフレームワークである。同じPythonのWebフレームワークにDjangoがあるが、Djangoが「最初から機能てんこ盛り」なのに対し、Flaskは「必要な機能を自分で足していく」というスタイルを取っている。
そのため、最小構成であれば数行のコードでWebアプリが動き始める。今回のように「Webフレームワークの基礎から学びたい」という場合に向いている。
Codespacesでの環境構築
リポジトリを作成し、Codespacesを起動したら、まずPython専用の仮想環境（venv）を作る。仮想環境を使うと、プロジェクトごとに必要なパッケージを分けて管理でき、他のプロジェクトに影響を与えずに済む。
python -m venv venv
source venv/bin/activate仮想環境が有効になると、ターミナルの先頭に(venv)という表示が出る。この状態で、Flaskをインストールする。
pip install flaskインストールしたパッケージは、あとで誰でも同じ環境を再現できるように、requirements.txtという形で書き出しておく。
pip freeze > requirements.txtHello Flaskを表示する
01_hello-flaskフォルダを作り、その中にapp.pyという名前でファイルを作成する。
app.py
from flask import Flask
app = Flask(__name__)
@app.route("/")
def index():
return "Hello, PC-LABO!"コードの内容はシンプルである。
Flask(__name__)：Flaskアプリケーション本体を作成する@app.route("/")：「/（トップページ）にアクセスがあったら、直下の関数を実行する」という対応づけindex()：実際にブラウザへ返す内容（今回は文字列だけ）
準備できたら、以下のコマンドで起動する。
flask --app app run --debugポート転送の確認
Codespaces上でサーバーを起動すると、画面右下に「ポートが転送されました」という通知が出る。この通知の「ブラウザで開く」を選ぶか、「PORTS」タブから該当ポート（通常は5000番）を開くと、ブラウザで実際の画面を確認できる。
「Hello, PC-LABO!」と表示されていれば成功である。
今回のまとめ
- Flaskは、必要な機能を自分で足していく、軽量なPython製Webフレームワークである
- Codespaces上では、venvで仮想環境を作ってからFlaskをインストールする
- 数行のコードだけで、Webサーバーを起動して画面を表示できる
次回予告
次回は、今回作った最小構成のアプリに、テンプレート（Jinja2）を使った画面表示を追加する。固定の支出データを、一覧としてブラウザに表示できるようにする予定である。
コメント