• #日記
  • #CF
  • #SVG
  • #Vue
  • #TursoDB
  • #Codex
daily-log

2026年4月20日の開発日記

eurekapu-nuxt4のCF計算書教材を1日中磨き続けた。条文ビューアの解決率を100%に押し上げ、実務リファレンスページをゼロから立ち上げ、ステップ学習コンテンツをVueページとして量産し、テーブルとpreブロックを59件のSVGに置き換えた。朝5時台から夜まで、10セッション・14時間の集中開発。

今日のタイムライン

タイムライン

今日やったこと

1. CF基準条文ビューアの機能拡張

Phase Fの解決率を90%→100%に引き上げた。未解決26件は全て「作成基準」への条文番号なし参照で、general provisionを追加して一括解消。そこから全条文を取得して2カラムHTML(左=条文、右=書籍での引用コンテキスト)に変換し、基準ごとに34ページに分割してパフォーマンスを改善した。Intersection Observerでサイドバーのスクロール追従ハイライト、引用済みフィルターも追加。

主な成果:

  • 解決率 261/261 = 100%
  • 全条文の2カラムHTML化 + 34ページ分割
  • citations.jsonに前後文脈テキスト追加
  • 「引用済みのみ表示」フィルター

詳細: CF基準条文ビューアの機能拡張


2. CF実務リファレンスページの新規構築

ライブラリを一切使わず、全文検索可能な実務リファレンスページを新規作成した。TursoDBから書籍のキーワードを取得して31論点・130キーワードに拡充。2カラムレイアウト(左: stickyな論点ナビ2列表示、右: キーワード一覧)、レベルタグ(3級/2級/実務)フィルター、基準条文のクリック展開、矢印キーナビゲーションまで実装。Codexレビューで条文の根拠間違いを5件修正。

主な成果:

  • 31論点・130キーワードの実務リファレンス
  • ライブラリなし全文検索
  • レベルフィルター + 矢印キーナビ
  • 条文ポップオーバー(マウスオーバーで展開、クリックでトグル)

詳細: ライブラリなしで全文検索つきCF実務リファレンスページを構築した記録


3. CF精算表ステップ学習ページの構築

ドラフトMDを経由せず、直接Vueページとして教材コンテンツを構築した。Codexレビューで致命的問題2点(① memo/配下はCloudflare Pagesで配信不可、② v-htmlでグローバルCSS汚染)を事前に潰し、ExcelHtmlViewerコンポーネントを作って全9ページを完成させた。3カラムレイアウト、ドラフトビューアー、StandardRef.vueも実装。

主な成果:

  • 全9ページ(ch0 + step1〜7 + index)
  • ExcelHtmlViewer(クリックでモーダル拡大)
  • 3カラムレイアウト(左: ステップ一覧、中: コンテンツ、右: 目次追従)
  • 書籍キーワードDD(カバー率52%確認)

詳細: CF精算表ステップ学習ページの構築


4. SVG図解一括変換

ch0〜step7のHTMLテーブルとpreブロックを、全てSVG図解に置き換えた。グレー8段階のトンマナルールを確立し、6サブエージェントを並列起動して59件のSVGを一気に生成。ウォーターフォールチャート、CFラベル付き仕訳、マゼンタ4段階の追加、K表記→円単位の統一まで完了。

主な成果:

  • 59件のSVG生成(6並列エージェント)
  • グレー8段階トンマナルール確立
  • ウォーターフォールチャート(売掛金・商品・買掛金の増減内訳)
  • CFラベル付き仕訳SVG + マゼンタ4段階
  • SVG図解スキル(.claude/skills/svg-diagram)新規作成

詳細: テーブルとpreブロックをSVG図解に一括変換した記録


今日の試行錯誤

#テーマ試したこと結果気づき
1provision_number=None個別に条文番号を推定しようとした非効率general provisionを1つ作って全26件を吸収する方が速い
2エンコーディングPython出力の文字化け調査bashのエンコーディング問題JSONファイル自体はUTF-8で正常、Read直接で解決
3スクロールバー幅ジャンプscrollbar-gutter: stable → min-width: 0 → html overflow-y: scroll3段目で解決Windowsのスクロールバー17pxがビューポート幅を変動させていた
4ドラフトMD vs Vue直接最初はドラフトMD経由を検討Vue直接に決定削除前提のドラフトを経由するより、最初から本番コンポーネントにする方が手戻りが少ない
5Codexレビューmemo/配下のfs.readFile本番で動かないCloudflare Workers環境でnode:fsは使えず、public/に移す必要があった
6v-html CSS汚染HTMLドキュメントをv-htmlで挿入グローバルCSS破壊scopedなExcelHtmlViewerコンポーネントでisolation
7ウォーターフォール矢印左向き矢印で実装逆だった期首→増加→減少→期末は右向きが自然
8CF仕訳SVG仕訳形式のSVGを作成ユーザーから「直感的でない」と削除指示仕訳にCF区分ラベルを付ける方がわかりやすい
9K表記Step3以降でK表記使用Excelとトンマナが合わない教材のExcelが円単位なら全体を円単位に統一すべき

直接法CF計算書の実例リサーチ

ch0の「直接法と間接法」セクションに実例を入れたくて、日本の上場企業で直接法を採用している(いた)企業を探した。結果、ニューアート(7638) が2017年度まで直接法で営業CFを開示し、2018年度に間接法へ切り替えていたことが判明した。

ニューアートの直接法CF計算書(2017年度)

変更理由は「連結損益計算書の損益と連結キャッシュ・フローとの関連性を明瞭化し、他社との比較を容易にするため」。99%以上が間接法を採用する中、他社比較のしやすさが直接法離脱の決め手になった。

また、学校法人会計では直接法がベースであることも確認した(市田浩三「学校法人のキャッシュ・フロー計算書」京都マネジメント・レビュー第6号)。学校法人は「資金収支計算書」を作成しており、これがCF計算書の直接法に対応する。


今日の学び

  • Codexレビューは実装前に必ず受ける。今日だけで致命的問題を計7件検出して事前に潰せた
  • サブエージェント6並列でSVG 59件を一気に変換できた。量産系タスクは並列化の効果が大きい
  • スクロールバーの表示/非表示によるレイアウトジャンプはhtml { overflow-y: scroll }が決定打
  • general provisionパターン: 条文番号が特定できない参照は、1つのgeneral provisionに集約して解決率を上げる

関連記事