Flask Todo アプリ開発メモ
1. 本日実施した内容
-
db.pyを作成し、DB 操作を別モジュールに分離した - SQLite の直接 SQL 実行をやめ、
Flask-SQLAlchemyを使用した ORM 化を実装した -
Todoモデルにdetails(詳細)とdue_date(期限)フィールドを追加した - タスク登録画面に
details入力欄とdateタイプの期限入力欄を追加した - タスク登録ページでは既存タスクを表示しないようにした
- ダッシュボード(トップページ)に完了ボタンを追加し、完了操作ができるようにした
- タスク一覧に期限と詳細を表示するようにした
- 既存 DB 構造に不足があった場合は再作成して新しいカラムを反映するようにした
2. 主要ファイル
-
main.py- Flask ルーティングとフォーム処理
-
Flask-SQLAlchemyを使った DB 初期化の呼び出し - 期限と詳細を受け取ってタスクを登録する処理
-
db.py-
SQLAlchemy初期化 -
Message/Todoモデル定義 - Todo の登録・取得・完了処理を関数化
-
-
templates/index.html- 未完了タスク一覧と完了ボタン表示
-
templates/todo.html- タスク登録専用フォーム(タイトル・詳細・期限)
3. 実現した機能
- Todo の新規登録(タイトル・詳細・期限)
- カレンダー形式の期限入力
- 登録専用ページでのタスク追加
- ダッシュボードで未完了タスクの確認と完了操作
-
Flask-SQLAlchemyによる ORM 管理 - Bootstrap による UI の整備
4. 実行方法
python main.py
ブラウザで以下にアクセス
5. 補足
- SQLite データベースファイルは
app.dbに保存される - タスク登録画面では既存タスクを表示しない設計に変更した
- ダッシュボードで完了ボタンを押すとタスク完了状態に更新され、画面から消える