1. 概要
本記事では Flask を使った `最小のMVC構成 を、CLIで自動生成し、必要最低限のコードまでまとめます。
機能本体（感情分析・OCR・画像分類など）は 別記事（機能実装編） で追加予定。
今回は「どんな機能にも共通する骨組み」だけを完成させます。
2. プロジェクト作成 & 仮想環境
Windows (PowerShell)
コマンドプロンプト
# プロジェクト作成
mkdir my_app
cd my_app
# 仮想環境作成
python -m venv .venv
# 仮想環境有効化
.\.venv\Scripts\Activate.ps1
Mac / Linux (bash / zsh)
コマンドプロンプト
# プロジェクト作成
mkdir my_app
cd my_app
# 仮想環境作成
python3 -m venv .venv
# 仮想環境有効化
source .venv/bin/activate
- 有効化できると (venv) がプロンプトの先頭に表示されます。
3. 依存ライブラリを準備
コマンドプロンプト
# requirements.txt を作成
echo Flask > requirements.txt
echo python-dotenv >> requirements.txt
# インストール
pip install -r requirements.txt
4. フォルダ & ファイルをまとめて作成
Windows (PowerShell)
コマンドプロンプト
# フォルダ作成
mkdir app, app\routes, app\services, app\models, app\templates, app\static, app\static\css
# ファイル作成
ni run.py, README.md, requirements.txt, app\__init__.py, app\config.py, app\routes\web.py, app\routes\api.py, app\models\ml_registry.py, app\templates\base.html, app\templates\top.html, app\static\css\style.css, app/models/__init__.py
Mac / Linux (bash / zsh)
コマンドプロンプト
# フォルダ作成
mkdir -p app/routes app/services app/models app/templates app/static/css app/modeld/__init__.py
# ファイル作成
touch run.py README.md requirements.txt app/__init__.py app/config.py app/routes/web.py app/routes/api.py app/models/ml_registry.py app/templates/base.html app/templates/top.html app/static/css/style.css
5. ファイルに書く必須コード
run.py
from app import create_app
app = create_app()
if __name__ == "__main__":
app.run(debug=True)
アプリのスタート地点。create_app() でアプリを生成し、python run.py で起動できるようにします。
→ 車で言うと「エンジンキーを回す部分」。
1. app フォルダ
アプリ本体を管理する場所。ここに 設定・ルート・処理・テンプレート がすべて入ります。
app/init.py
from flask import Flask
from .config import Config
def create_app():
app = Flask(__name__)
app.config.from_object(Config)
# Blueprint 登録
from .routes.web import web_bp
from .routes.api import api_bp
app.register_blueprint(web_bp)
app.register_blueprint(api_bp, url_prefix="/api")
return app
Flaskアプリの本体。設定を読み込み、画面用ルートとAPIルートをアプリに登録します。
→ 家全体の「設計図」。
app/config.py
import os
from dotenv import load_dotenv
load_dotenv()
class Config:
SECRET_KEY = os.getenv("SECRET_KEY", "devkey")
アプリの設定を一元管理するファイル。秘密鍵やモデル置き場などをまとめます。
→ 「家のルールブック」。
2. app/routes フォルダ
ユーザーがアクセスする「入口」を管理する場所です。
- web.py = 画面用の入り口
- api.py = API用の入り口
app/routes/web.py
from flask import Blueprint, render_template
web_bp = Blueprint("web", __name__)
@web_bp.get("/")
def top():
return render_template("top.html")
ブラウザで見るページ用のルート。トップページ / を表示します。
→ 「玄関口」。
app/routes/api.py
from flask import Blueprint, jsonify
api_bp = Blueprint("api", __name__)
@api_bp.get("/health")
def health():
return jsonify({"status": "ok"})
API用のルート。アプリが正常に動いているか確認する /api/health を返します。
→ 「健康診断の窓口」。
3. app/models フォルダ
データや機械学習モデルを扱う場所。
app/models/ml_registry.py
def get_model(name: str):
raise NotImplementedError(
f"Model '{name}' is not registered yet. "
"Add app/services/<feature>.py and put your model under /models."
)
学習済みモデルを呼び出すための受付窓口。今はまだダミーで「未実装」と返します。
→ 「倉庫の受付カウンター」。
4. app/templates フォルダ
HTMLテンプレートを置く場所。Jinja2 で動的に組み立てます。
app/templates/base.html
<!doctype html>
<html lang="ja">
<head>
<meta charset="utf-8" />
<title>{% block title %}Demo{% endblock %}</title>
<link rel="stylesheet" href="{{ url_for('static', filename='css/style.css') }}">
</head>
<body>
<main class="container">
{% block content %}{% endblock %}
</main>
</body>
</html>
全ページ共通のレイアウト。ヘッダーやCSS読み込みをまとめます。
→ 「家の骨組み」。
app/templates/top.html
{% extends "base.html" %}
{% block title %}Flask Minimal{% endblock %}
{% block content %}
<h1>Flask 最小構成の土台</h1>
<p>トップページが表示され、<code>/api/health</code> が {"status":"ok"} を返せば成功です。</p>
{% endblock %}
トップページの中身。入力フォームや結果表示を後で追加していきます。
→ 「リビングの内装」。
5. app/static フォルダ
CSSや画像などの静的ファイルを置きます。
app/static/css/style.css
body { font-family: sans-serif; margin: 24px; }
h1 { color: #333; }
最低限のスタイルを定義。
→ 「壁紙や家具の色」。
README.md
# Flask Minimal Scaffold
# Setup (Windows PowerShell)
```powershell
python -m venv .venv
.\.venv\Scripts\Activate.ps1
pip install -r requirements.txt
python run.py
# Setup (Mac/Linux)
python3 -m venv .venv
source .venv/bin/activate
pip install -r requirements.txt
python run.py
このアプリの説明書。環境構築と実行方法をまとめます。
6. 完成フォルダ構成
ディレクトリ構成
my_app/
├─ app/
│ ├─ __init__.py # Flask本体（設計図）
│ ├─ config.py # 設定ファイル（ルールブック）
│ ├─ routes/ # 入り口（玄関口）
│ │ ├─ web.py # 画面ルート
│ │ └─ api.py # APIルート
│ ├─ services/ # 機能本体（今は空）
│ │ └─ .gitkeep
│ ├─ models/ # データ層（倉庫）
│ │ └─ ml_registry.py # モデル取得の受付カウンター
│ ├─ templates/ # HTMLテンプレート（内装）
│ │ ├─ base.html
│ │ └─ top.html
│ └─ static/ # CSSや画像（壁紙・装飾）
│ └─ css/
│ └─ style.css
├─ models/ # 学習済みモデルを置く場所
├─ run.py # エンジンを回すキー
├─ requirements.txt # 必要な部品リスト
└─ README.md # 説明書
7. 動作確認
python run.py
- http://localhost:5000/ → トップページ表示
-
http://localhost:5000/api/health →
{"status": "ok"}