2026年9月2日の開発日記

図解の縦長セルで日本語が横に寝ている。 明細テーブルの列幅が指定どおりにならない。 計画書を開いても、どのフェーズが終わったのか読み取れない。

朝から目に入ったのは、どれも画面に出ているものの不具合だった。 そのつもりで手をつけたが、3件とも直す場所は別にあった。

今日のタイムライン

Chrome拡張に2時間02分、eurekapu の別表コンテンツに1時間25分。 残りは mdx-playground 側のセッションで、本数でいえばこちらが6本といちばん多い。

今日やったこと

1. SVG図解の日本語を縦書きにする

図解の縦長セル（表でいう rowspan にあたる帯）で、「文書づくり」の5文字が横倒しのまま寝ていた。 読むたびに画面の前で首を左に傾けていて、前からずっと気になっていた。

図を1枚描き直せば済む話に見えたが、図は今後も量産される。 1枚直しても、次に同じ型を描かせればまた横倒しの日本語が出てくる。 直したのは図ではなく svg-diagram スキルのほうだった。

rotate(-90) をやめて writing-mode="vertical-rl" を使う規約をスキル本体に書かせ、既存の SVG 76本、86要素を一括変換させた。 レビューは5つのバッチに割って、サブエージェント5体へ投げた。

主な成果:

• 変換ルールと例外（ラテン文字だけのラベルは rotate(-90) を許す）をスキル本体に固定した
• 変換器は dry-run を既定にし、--apply を付けたときだけ書き込む形にさせた
• 縦組みで矢印が逆を向く不具合を12本で発見し、font-feature-settings: 'vert' 0, 'vrt2' 0 まで指定して直した
• レビューが返した「要確認」1件は、変換前から同じ位置にあった既存の不具合だった

詳細: SVG図解の日本語を縦書きにする：writing-mode vertical-rl と縦組みで回る矢印

2. クラウド会計向け Chrome 拡張の UI を整える

会計ソフトAの明細一覧に、行ごとの仕訳を右側へ並べる表示を作らせていた。 行の高さは 80px から 28px まで詰まり、100行のうち99行が1行に収まっている。 残っていたのは、ヘッダーのカラムだけが本体の明細行と高さの合っていない点だった。

午後は「続きを表示」を拡張に押させ、通帳カードの下に連携サービス名を横一列で並べた。 夕方には仕訳帳のページで大きな余白を見つけた。当日入れた CSS を疑ったが、外れた。

主な成果:

• 列幅を握っていたのは th ではなく <colgroup> で、col 要素に当て直して指定どおりになった
• 「続きを表示」の自動クリックを入れる前に、二重クリックの危険と既存エクスポート処理との干渉を確認させた
• 連携サービス名は12件が2段で並び、クリック時に組み立てる URL も検証させた
• 仕訳帳の余白の正体は、ホーム画面の広告を消すために前に作った別の拡張が挿入していた空メニュー枠2個だった

詳細: 会計ソフトの明細一覧を Chrome 拡張で整える：列幅のずれ、全件自動表示、連携サービスの横並び

3. 常時稼働の Linux が付く AI Bot の使いどころを調べる

月30ドルから始められるプランに、常時稼働の Linux マシンが丸ごと付いてくる。 Tailscale を入れれば SSH が通り、中は普通の Linux だから Claude Code も Codex も入る。 X で見かけたポストはそこまでで、腑に落ちなかったのは「その1台を毎日何に使うのか」だった。

サブエージェント3本（英語記事 / コミュニティの実践報告 / 公式ドキュメント）を並列で派遣して調べさせ、公開記事に仕立てさせた。 ところが初稿の第3章に並んだ実践報告は、7件のうち5件が Claude Code でも同じ結果にたどり着く話だった。

主な成果:

• 契約中のプランを実測させ、追加課金なしで使えることを確認した（20ドルの上位オプションは不要）
• 「PC の前にいなくても回るか」を軸に置き直し、Claude Code で足りる仕事との対比表を作らせた
• 自分で試す題材を、会計ソフトAの明細が1件増えたら通知する形に決めた
• Codex を入れる手順は、Web検索も試行錯誤も禁じてコマンドを全部埋め込んだプロンプトとして用意させた（まだ貼っていない）

詳細: 常時稼働のLinuxが付くAI Botの使いどころ：Claude Codeとの線引きで解説記事を書き直した

公開記事のほうは Grok Bot に付いてくる常時稼働の Linux 機を何に使うか として出した。

4. 法人税別表コンテンツの進捗を突き合わせる

別表四と別表五のコンテンツを作りながら、計画書のどこまで来たのかを自分で言えなくなった。 図は差し替わっているし本文にも入っている。手は動いていた。

理由は台帳のほうにあった。 進捗台帳が 9/1 の 17:10 で止まっていて、そのあとの Phase 3.5 完了と統合コミットが記録されていない。 そこから先が読めないのは当たり前だった。

主な成果:

• 計画書2本（8/31 の図の作り直し、9/1 の本番取り込み）と実物を照合させ、ずれ3点と落ちているチェック2点を洗い出した
• 「Before として戻す」が噛み合わなかったので dev サーバーを立ち上げさせ、該当ページを開いて像を合わせた
• チャプター9の HTML 表16個は戻さないと決め、その決定を台帳と計画書2本に書かせた
• ローカル main と origin/main が同じコミットであることを fetch して実測させた

詳細: 計画書と実物の進捗を突き合わせ、タスクリストと自分の認識のズレを1か所に絞った

5. その他

前日分の日記チェーンを回した。Codex レビューで致命的な指摘が2件出て、その場で直してコミットに取り込んでいる。

X で見かけた「大人のなぞなぞを解いてる気分」という投稿が言い得て妙だったので、感想を添えて未公開のメモとして残した。

今日の試行錯誤

今日の学び

• 同じ型の成果物が量産される場面では、成果物ではなく生成のルールを直す。今回はスキルを直したうえで既存76本の一括変換までを1セットにできた
• 手元のフォント環境で正しく見えることは、他の環境で正しいことの根拠にならない。この PC には縦組みのグリフ置換をしないフォントが入っていて、矢印の不具合が見えなかった
• 相手のページに CSS を差し込む拡張が3つになった。崩れの原因を最新の変更に決め打ちすると外す
• 修正に入る前にコミットを取る。犯人が別の場所だったとき、戻れる地点があるかどうかで調査の速さが変わる
• 調査の初稿は材料の派手さで並び替えられる。数字の大きい事例から選ぶと、その製品でなくてもできる話が上位に来る
• タスクリストをもらったら、正しいかどうかではなく「自分の認識とどこが食い違うか」を聞く。抜けているものは、そろったリストを眺めているだけでは見つからない
• 自分が手を動かす工程こそ、リストに独立した項目として立てる。立っていなければ、誰も着手しないまま残る

明日やること

• ギャラリーから正本版を選ぶ（自分の手でやる）
• 選んだあと、混ぜた版を作らせて本文へ入れる
• 用意したプロンプトを Bot に貼り、SSH が通るところまで確認する
• 明細の見張りは、会計ソフトAのどの製品のどの画面を見るかを1つに決める
• Vue コンポーネント側に残る rotate(-90 を10ファイル15箇所ぶん片付ける

関連記事

• SVG図解の日本語を縦書きにする：writing-mode vertical-rl と縦組みで回る矢印
• 会計ソフトの明細一覧を Chrome 拡張で整える：列幅のずれ、全件自動表示、連携サービスの横並び
• 常時稼働のLinuxが付くAI Botの使いどころ：Claude Codeとの線引きで解説記事を書き直した
• 計画書と実物の進捗を突き合わせ、タスクリストと自分の認識のズレを1か所に絞った
• Grok Bot に付いてくる常時稼働の Linux 機を何に使うか：プラン条件と実践報告の整理