2026年2月13日の開発日記
今日は4つのプロジェクト（mdx-playground、tax-2025、tax-lp、tokyo-onkei）を横断して作業した。メインは理科学習コンテンツの大規模構築で、全体の6割くらいの時間を使った。
今日やったこと
1. 理科学習コンテンツの大規模開発（mdx-playground）
Miller Column Layout（4カラム構成）で理科コンテンツページを新規構築した。参考書100トピック分の目次をデータとして登録し、「ロウソクの燃え方」「水の三態変化」「音の性質」「音の秘密」「てこ」の5トピックをReact JSXからVue SFCに変換した。
主な成果:
/convert-science-contentと/generate-science-contentの2つのスラッシュコマンドを作成- basic-englishのスクロールリストパターンを踏襲したクイズシステム
- Web Audio API + Canvasで倍音合成ベースのオシロスコープ風UI
- localStorage履歴による復習機能をMiller Column内に統合
- スタイリング方針をカラフル装飾→シンプルなグレー背景ハイライトボックスに確立
詳細: 小学理科の学習コンテンツをMiller Column UIで一気に構築した話
2. Basic Englishクイズのバグ修正（mdx-playground）
クイズ結果画面がスクロールできない問題と、Miller Columnレイアウトの表示崩れ（デスクトップ/モバイル同時表示、テキスト溢れ）を修正した。
主な成果:
.quiz-containerのoverflow: hidden+ 結果画面にスクロールラッパー追加- CSS詳細度の問題で
.mobile-viewが.mobile-onlyを上書きしていた問題を修正 - Grid/Flexboxの
min-width: auto問題にmin-width: 0で対処
詳細: Basic Englishクイズの結果画面スクロール不具合とMiller Columnレスポンシブ修正
3. Draw.io MCP サーバー調査（mdx-playground）
Draw.io用のMCPサーバー3種（公式・lgazo・Sujimoshi）を調査し、現行のスキル（XML直書き）方式と比較した。結論としては現状維持。調査結果をmd-makeで記事化し、Codex CLIでレビューした。
4. Tokyo Soundscape プロジェクト立ち上げ
マークダウンの企画書をPowerPointスライドに変換（PptxGenJS + Unsplash写真 + Sharp背景合成）し、Google Driveにアップロード。新規リポジトリ tokyo-onkei を作成し、Nuxtプロジェクトとしてのランディングページ構築を計画した。
主な成果:
- 12枚のPPTXスライド生成（写真4枚を不透明度20%で背景合成）
- Windowsのfile:// URLパス問題のデバッグ・解決
- Nuxtプロジェクト初期化、利用規約・プライバシーポリシーのドラフト
詳細: Tokyo Soundscapeプロジェクト立ち上げ
5. 医療費レシートOCR→Excel自動入力（tax-2025）
Gemini APIで87件の医療費レシート画像をOCR処理し、国税庁の医療費集計フォームへ自動入力した。エラー0件。
主な成果:
/import-medical-receiptsスラッシュコマンドの作成- 命名規則に基づくレシート画像の一括リネーム（患者名不明時の推定ルール含む）
- 患者別集計シートの追加
- Excelバージョン管理ルール（コピー作成→コピーを変更）の確立
6. 業種別LP新規構築 & 全サイトデプロイ（tax-lp）
Googleビジネスプロフィール向けの新規LPを構築し、英語版対応・フォームバリデーション改善を経て全9業種を一括デプロイした。
主な成果:
- お問い合わせ特化型の新規LP（ヒーロー直下にフォーム配置）
- 全コンポーネントにlocale prop対応で英語版を追加
- 共通コンポーネント修正でメール・電話・文字数バリデーションを全業種に反映
- devサーバーの.nuxtロック問題を発見し、デプロイスクリプトに自動停止処理を追加
詳細: 業種別LP新規構築から全サイト一括デプロイまでの一日
7. tax-assistant メンテナンス
変更内容を5グループに分割してステージング。Windowsの予約デバイス名 nul ファイルの削除対応、git-wt（git worktreeラッパー）の技術調査なども行った。
詳細: Git分割ステージングとWindows予約デバイス名の削除
今日の学び
- Miller Column Layoutは教育コンテンツのナビゲーションに非常に向いている。カテゴリ→トピック→セクション→コンテンツの階層が直感的に操作できる
- CSS詳細度の問題はメディアクエリ内のスタイルとグローバルスタイルの順序で起きやすい。
!importantに頼らず構造で解決するのが正解 - PptxGenJSでWindowsのfile:// URLを扱うときはパス変換に注意。
file://を剥がすだけだとドライブレターが二重になる - devサーバーが
.nuxt/tsconfig.app.jsonをロックするのでビルド前に停止が必要。デプロイスクリプトに組み込んだ - Gemini APIのOCR精度が高く、87件エラー0は想定以上だった
明日やること
- 理科コンテンツの追加トピック変換（残り95トピック）
- Tokyo Soundscape のNuxtランディングページ実装
- 12日分の日記生成（前日分）
- 業種別LPのSVGアイコン置換作業の続き