2026年1月12日の開発日記

今日は朝から夕方までTax Assistantの大規模リファクタリングに取り組んだ。Nuxt 4への移行、DBテーブル名の再設計、OCR Checker UIの改善を一気に進めた。mdx-playgroundではデザイン原則の番号体系を整理し、カテゴリー別連番への変更を完了した。

今日やったこと

1. デザイン原則の番号振り直し（mdx-playground）

書籍の元番号（1〜100の飛び飛び）をカテゴリー別連番（A-1, A-2...）に統一するリファクタリングを実施した。

• 全49件の原則を8カテゴリーに分類
• principles.tsのno→legacyNoに変更し、新番号体系を導入
• サイドバーはカテゴリー内連番のみ表示（H-1ではなく1, 2, 3...）
• Cloudflare _redirectsに49件の301リダイレクトを設定

詳細: デザイン原則 番号振り直し計画

2. Tax Assistant DBテーブル名の再設計

テーブル名をデータフローに合わせて直感的に変更した。TDDで進め、全54件のテストが通過。

draw.ioでテーブル関係図も作成し、3テーブルを横並びで比較できる図を残した。

3. OCR Checkerの3カラムテーブルUI

縦並びフォームを3カラムテーブルに変更し、Gemini結果・サブエージェント結果・判定を横並びで比較可能にした。

• 信頼度は枠線の色で表現（緑/オレンジ/赤）
• 判定結果は「✓」「要確認」で表示
• AI信頼度バッジは紫系に統一（緑は「確定」に予約）

詳細: OCR Checkerの帳票情報をテーブルレイアウトにリデザイン

4. Tax Assistant Nuxt 4移行

HTMLベースのocr_checker.htmlをNuxt 4に移行した。Phase 1〜5を完了し、主要機能が動作確認済み。

完了した機能:

• バッチ一覧（進捗バー付き）
• レシート一覧（信頼度パーセント表示）
• レシート詳細フォーム（日付・金額・勘定科目・摘要・支出先）
• 確定機能（Ctrl+Enter）
• ナビゲーション（← 前へ / 次へ →）
• AI情報セクション
• 結果タブ・重複チェックタブ・月次推移表タブ
• CSVエクスポート
• コメント機能

テスト:

• Vitestユニットテスト: 6件
• Playwright E2Eテスト: 21件

CSS方針: Tailwind/Vuetifyは使わず、Scoped CSSのみで実装。

5. PRマージとコンフリクト解消

mdx-playground:

• #52 ボタン順序の標準化
• #53 入力履歴のフィルタリング機能

tax-assistant:

• #2 確定ボタンのトグル対応
• #3 月次推移表タブ追加
• #4 確定状態の横並び表示
• #5 バッチ一覧の進捗バー
• #6 ファイル名重複チェック

PR #4, #6はコンフリクトがあり、8箇所を手動解消した。

6. UI色設計のドキュメント化

AI関連の表示色を紫系に統一し、トーン&マナーをCLAUDE.mdに追記した。

今日の学び

• TDDでDBマイグレーション: テストを先に書いて失敗を確認してから変更すると、影響範囲が明確になる
• テーブル名は役割で決める: receiptsよりgemini_readsの方が、どのエージェントが書き込むか一目でわかる
• 色の役割を決めておく: 緑を「確定」に予約しておくと、AI信頼度（別軸）との混同を避けられる
• PRマージ前にローカル変更をコミット: git reset --hard origin/masterで未コミット変更が消えた失敗を経験

関連記事

• デザイン原則 番号振り直し計画
• OCR Checkerの帳票情報をテーブルレイアウトにリデザイン