[{"data":1,"prerenderedAt":654},["ShallowReactive",2],{"content-/2026-09-02-diary":3,"all-pages-for-dir":634,"related-/2026-09-02-diary":635,"og-image-/2026-09-02-diary":653},{"id":4,"title":5,"body":6,"category":614,"concepts":615,"description":616,"extension":617,"meta":618,"navigation":538,"ogImage":615,"path":619,"project_name":620,"published":621,"publishedAt":622,"seo":623,"source":624,"stem":625,"tags":626,"todo":615,"unpublished":621,"updatedAt":615,"__hash__":633},"pages/2026-09/2026-09-02/diary-2026-09-02.md","2026年9月2日の開発日記 - 出てきたものではなく、出す側を直した一日",{"type":7,"value":8,"toc":597},"minimark",[9,14,18,21,25,32,35,38,43,46,49,60,66,93,104,107,111,114,117,121,139,147,149,153,156,159,163,177,185,193,195,199,202,205,209,223,231,233,237,240,243,245,248,494,496,499,522,524,527,569,571,574],[10,11,13],"h1",{"id":12},"_2026年9月2日の開発日記","2026年9月2日の開発日記",[15,16,17],"p",{},"図解の縦長セルで日本語が横に寝ている。\n明細テーブルの列幅が指定どおりにならない。\n計画書を開いても、どのフェーズが終わったのか読み取れない。",[15,19,20],{},"朝から目に入ったのは、どれも画面に出ているものの不具合だった。\nそのつもりで手をつけたが、3件とも直す場所は別にあった。",[22,23,24],"h2",{"id":24},"今日のタイムライン",[15,26,27],{},[28,29],"img",{"alt":30,"src":31},"タイムライン","/2026-09/2026-09-02/timeline-2026-09-02.png",[15,33,34],{},"Chrome拡張に2時間02分、eurekapu の別表コンテンツに1時間25分。\n残りは mdx-playground 側のセッションで、本数でいえばこちらが6本といちばん多い。",[22,36,37],{"id":37},"今日やったこと",[39,40,42],"h3",{"id":41},"_1-svg図解の日本語を縦書きにする","1. SVG図解の日本語を縦書きにする",[15,44,45],{},"図解の縦長セル（表でいう rowspan にあたる帯）で、「文書づくり」の5文字が横倒しのまま寝ていた。\n読むたびに画面の前で首を左に傾けていて、前からずっと気になっていた。",[15,47,48],{},"図を1枚描き直せば済む話に見えたが、図は今後も量産される。\n1枚直しても、次に同じ型を描かせればまた横倒しの日本語が出てくる。\n直したのは図ではなく svg-diagram スキルのほうだった。",[15,50,51,55,56,59],{},[52,53,54],"code",{},"rotate(-90)"," をやめて ",[52,57,58],{},"writing-mode=\"vertical-rl\""," を使う規約をスキル本体に書かせ、既存の SVG 76本、86要素を一括変換させた。\nレビューは5つのバッチに割って、サブエージェント5体へ投げた。",[15,61,62],{},[63,64,65],"strong",{},"主な成果:",[67,68,69,76,83,90],"ul",{},[70,71,72,73,75],"li",{},"変換ルールと例外（ラテン文字だけのラベルは ",[52,74,54],{}," を許す）をスキル本体に固定した",[70,77,78,79,82],{},"変換器は dry-run を既定にし、",[52,80,81],{},"--apply"," を付けたときだけ書き込む形にさせた",[70,84,85,86,89],{},"縦組みで矢印が逆を向く不具合を12本で発見し、",[52,87,88],{},"font-feature-settings: 'vert' 0, 'vrt2' 0"," まで指定して直した",[70,91,92],{},"レビューが返した「要確認」1件は、変換前から同じ位置にあった既存の不具合だった",[15,94,95,98,99],{},[63,96,97],{},"詳細:"," ",[100,101,103],"a",{"href":102},"/svg-vertical-japanese-text","SVG図解の日本語を縦書きにする：writing-mode vertical-rl と縦組みで回る矢印",[105,106],"hr",{},[39,108,110],{"id":109},"_2-クラウド会計向け-chrome-拡張の-ui-を整える","2. クラウド会計向け Chrome 拡張の UI を整える",[15,112,113],{},"会計ソフトAの明細一覧に、行ごとの仕訳を右側へ並べる表示を作らせていた。\n行の高さは 80px から 28px まで詰まり、100行のうち99行が1行に収まっている。\n残っていたのは、ヘッダーのカラムだけが本体の明細行と高さの合っていない点だった。",[15,115,116],{},"午後は「続きを表示」を拡張に押させ、通帳カードの下に連携サービス名を横一列で並べた。\n夕方には仕訳帳のページで大きな余白を見つけた。当日入れた CSS を疑ったが、外れた。",[15,118,119],{},[63,120,65],{},[67,122,123,130,133,136],{},[70,124,125,126,129],{},"列幅を握っていたのは th ではなく ",[52,127,128],{},"\u003Ccolgroup>"," で、col 要素に当て直して指定どおりになった",[70,131,132],{},"「続きを表示」の自動クリックを入れる前に、二重クリックの危険と既存エクスポート処理との干渉を確認させた",[70,134,135],{},"連携サービス名は12件が2段で並び、クリック時に組み立てる URL も検証させた",[70,137,138],{},"仕訳帳の余白の正体は、ホーム画面の広告を消すために前に作った別の拡張が挿入していた空メニュー枠2個だった",[15,140,141,98,143],{},[63,142,97],{},[100,144,146],{"href":145},"/accounting-saas-chrome-extension-ui","会計ソフトの明細一覧を Chrome 拡張で整える：列幅のずれ、全件自動表示、連携サービスの横並び",[105,148],{},[39,150,152],{"id":151},"_3-常時稼働の-linux-が付く-ai-bot-の使いどころを調べる","3. 常時稼働の Linux が付く AI Bot の使いどころを調べる",[15,154,155],{},"月30ドルから始められるプランに、常時稼働の Linux マシンが丸ごと付いてくる。\nTailscale を入れれば SSH が通り、中は普通の Linux だから Claude Code も Codex も入る。\nX で見かけたポストはそこまでで、腑に落ちなかったのは「その1台を毎日何に使うのか」だった。",[15,157,158],{},"サブエージェント3本（英語記事 / コミュニティの実践報告 / 公式ドキュメント）を並列で派遣して調べさせ、公開記事に仕立てさせた。\nところが初稿の第3章に並んだ実践報告は、7件のうち5件が Claude Code でも同じ結果にたどり着く話だった。",[15,160,161],{},[63,162,65],{},[67,164,165,168,171,174],{},[70,166,167],{},"契約中のプランを実測させ、追加課金なしで使えることを確認した（20ドルの上位オプションは不要）",[70,169,170],{},"「PC の前にいなくても回るか」を軸に置き直し、Claude Code で足りる仕事との対比表を作らせた",[70,172,173],{},"自分で試す題材を、会計ソフトAの明細が1件増えたら通知する形に決めた",[70,175,176],{},"Codex を入れる手順は、Web検索も試行錯誤も禁じてコマンドを全部埋め込んだプロンプトとして用意させた（まだ貼っていない）",[15,178,179,98,181],{},[63,180,97],{},[100,182,184],{"href":183},"/always-on-cloud-agent-research","常時稼働のLinuxが付くAI Botの使いどころ：Claude Codeとの線引きで解説記事を書き直した",[15,186,187,188,192],{},"公開記事のほうは ",[100,189,191],{"href":190},"/grok-bot-usage-guide","Grok Bot に付いてくる常時稼働の Linux 機を何に使うか"," として出した。",[105,194],{},[39,196,198],{"id":197},"_4-法人税別表コンテンツの進捗を突き合わせる","4. 法人税別表コンテンツの進捗を突き合わせる",[15,200,201],{},"別表四と別表五のコンテンツを作りながら、計画書のどこまで来たのかを自分で言えなくなった。\n図は差し替わっているし本文にも入っている。手は動いていた。",[15,203,204],{},"理由は台帳のほうにあった。\n進捗台帳が 9/1 の 17:10 で止まっていて、そのあとの Phase 3.5 完了と統合コミットが記録されていない。\nそこから先が読めないのは当たり前だった。",[15,206,207],{},[63,208,65],{},[67,210,211,214,217,220],{},[70,212,213],{},"計画書2本（8/31 の図の作り直し、9/1 の本番取り込み）と実物を照合させ、ずれ3点と落ちているチェック2点を洗い出した",[70,215,216],{},"「Before として戻す」が噛み合わなかったので dev サーバーを立ち上げさせ、該当ページを開いて像を合わせた",[70,218,219],{},"チャプター9の HTML 表16個は戻さないと決め、その決定を台帳と計画書2本に書かせた",[70,221,222],{},"ローカル main と origin/main が同じコミットであることを fetch して実測させた",[15,224,225,98,227],{},[63,226,97],{},[100,228,230],{"href":229},"/corporate-tax-schedule-progress-sync","計画書と実物の進捗を突き合わせ、タスクリストと自分の認識のズレを1か所に絞った",[105,232],{},[39,234,236],{"id":235},"_5-その他","5. その他",[15,238,239],{},"前日分の日記チェーンを回した。Codex レビューで致命的な指摘が2件出て、その場で直してコミットに取り込んでいる。",[15,241,242],{},"X で見かけた「大人のなぞなぞを解いてる気分」という投稿が言い得て妙だったので、感想を添えて未公開のメモとして残した。",[105,244],{},[22,246,247],{"id":247},"今日の試行錯誤",[249,250,251,273],"table",{},[252,253,254],"thead",{},[255,256,257,261,264,267,270],"tr",{},[258,259,260],"th",{},"#",[258,262,263],{},"テーマ",[258,265,266],{},"試したこと",[258,268,269],{},"結果",[258,271,272],{},"気づき",[274,275,276,297,314,331,348,369,385,409,426,443,460,477],"tbody",{},[255,277,278,282,285,288,291],{},[279,280,281],"td",{},"1",[279,283,284],{},"明細テーブルの列幅",[279,286,287],{},"th に幅を指定した",[279,289,290],{},"失敗",[279,292,293,294,296],{},"列幅を握っていたのは ",[52,295,128],{},"。col 要素に当て直して解決した",[255,298,299,302,305,308,311],{},[279,300,301],{},"2",[279,303,304],{},"ヘッダーと本体のずれ",[279,306,307],{},"目分量で padding を削る",[279,309,310],{},"採らず",[279,312,313],{},"先に実測させてから手を入れた。目分量はたいてい別のどこかをずらす",[255,315,316,319,322,325,328],{},[279,317,318],{},"3",[279,320,321],{},"拡張の読み込み",[279,323,324],{},"拡張機能ページから新フォルダを読み込ませようとした",[279,326,327],{},"「できません」と返る",[279,329,330],{},"フォルダを分けたのは自分だった。OS のダイアログが要るので手で読み込んだ",[255,332,333,336,339,342,345],{},[279,334,335],{},"4",[279,337,338],{},"仕訳帳の余白",[279,340,341],{},"当日入れた CSS を疑って調べた",[279,343,344],{},"外れ",[279,346,347],{},"犯人は前に作った広告非表示の拡張。空メニュー枠を2個挿入していた",[255,349,350,353,356,359,362],{},[279,351,352],{},"5",[279,354,355],{},"コミット時の学習ゲート",[279,357,358],{},"ブラウザにクイズを5問出させた",[279,360,361],{},"30分でタイムアウト",[279,363,364,365,368],{},"合格セッションは残らず未回答のまま落ちた。出し直しても通らず ",[52,366,367],{},"LEARN_SKIP"," で通した",[255,370,371,374,377,380,382],{},[279,372,373],{},"6",[279,375,376],{},"図解の縦書き",[279,378,379],{},"図を1枚描き直す",[279,381,310],{},[279,383,384],{},"図は量産される。スキル側の規約を直して既存76本を一括変換した",[255,386,387,390,393,399,402],{},[279,388,389],{},"7",[279,391,392],{},"縦書きの矢印",[279,394,395,398],{},[52,396,397],{},"text-orientation: upright"," を指定",[279,400,401],{},"不十分",[279,403,404,405,408],{},"日本語フォントの縦組みグリフ置換で「↑」が「→」に化ける。",[52,406,407],{},"font-feature-settings"," で置換を切って解決",[255,410,411,414,417,420,423],{},[279,412,413],{},"8",[279,415,416],{},"レビューの「要確認」1件",[279,418,419],{},"変換前後を並べて見比べた",[279,421,422],{},"既存の不具合と判明",[279,424,425],{},"そのまま修正リストへ積んでいたら、無関係な直しを1件抱え込んでいた",[255,427,428,431,434,437,440],{},[279,429,430],{},"9",[279,432,433],{},"Bot の用途調査",[279,435,436],{},"サブエージェント3本で並列調査 → 初稿",[279,438,439],{},"却下",[279,441,442],{},"実践報告7件のうち5件が、常時稼働のマシンが要る理由になっていなかった",[255,444,445,448,451,454,457],{},[279,446,447],{},"10",[279,449,450],{},"記事の軸の引き直し",[279,452,453],{},"機能で切る",[279,455,456],{},"切れない",[279,458,459],{},"「マシンがどこに置かれているか」で切ったら、Claude Code で足りる仕事と分かれた",[255,461,462,465,468,471,474],{},[279,463,464],{},"11",[279,466,467],{},"「Before として戻す」の確認",[279,469,470],{},"言葉で詰めた",[279,472,473],{},"噛み合わない",[279,475,476],{},"dev サーバーを立ち上げて該当ページを開いた瞬間に決着した",[255,478,479,482,485,488,491],{},[279,480,481],{},"12",[279,483,484],{},"タスクリストの確認",[279,486,487],{},"「どこが自分の認識と食い違うか」を名指しさせた",[279,489,490],{},"1か所",[279,492,493],{},"「ギャラリーで正本版を選ぶ」という自分の工程がリストに立っていなかった",[105,495],{},[22,497,498],{"id":498},"今日の学び",[67,500,501,504,507,510,513,516,519],{},[70,502,503],{},"同じ型の成果物が量産される場面では、成果物ではなく生成のルールを直す。今回はスキルを直したうえで既存76本の一括変換までを1セットにできた",[70,505,506],{},"手元のフォント環境で正しく見えることは、他の環境で正しいことの根拠にならない。この PC には縦組みのグリフ置換をしないフォントが入っていて、矢印の不具合が見えなかった",[70,508,509],{},"相手のページに CSS を差し込む拡張が3つになった。崩れの原因を最新の変更に決め打ちすると外す",[70,511,512],{},"修正に入る前にコミットを取る。犯人が別の場所だったとき、戻れる地点があるかどうかで調査の速さが変わる",[70,514,515],{},"調査の初稿は材料の派手さで並び替えられる。数字の大きい事例から選ぶと、その製品でなくてもできる話が上位に来る",[70,517,518],{},"タスクリストをもらったら、正しいかどうかではなく「自分の認識とどこが食い違うか」を聞く。抜けているものは、そろったリストを眺めているだけでは見つからない",[70,520,521],{},"自分が手を動かす工程こそ、リストに独立した項目として立てる。立っていなければ、誰も着手しないまま残る",[105,523],{},[22,525,526],{"id":526},"明日やること",[67,528,531,541,547,553,559],{"className":529},[530],"contains-task-list",[70,532,535,540],{"className":533},[534],"task-list-item",[536,537],"input",{"disabled":538,"type":539},true,"checkbox"," ギャラリーから正本版を選ぶ（自分の手でやる）",[70,542,544,546],{"className":543},[534],[536,545],{"disabled":538,"type":539}," 選んだあと、混ぜた版を作らせて本文へ入れる",[70,548,550,552],{"className":549},[534],[536,551],{"disabled":538,"type":539}," 用意したプロンプトを Bot に貼り、SSH が通るところまで確認する",[70,554,556,558],{"className":555},[534],[536,557],{"disabled":538,"type":539}," 明細の見張りは、会計ソフトAのどの製品のどの画面を見るかを1つに決める",[70,560,562,564,565,568],{"className":561},[534],[536,563],{"disabled":538,"type":539}," Vue コンポーネント側に残る ",[52,566,567],{},"rotate(-90"," を10ファイル15箇所ぶん片付ける",[105,570],{},[22,572,573],{"id":573},"関連記事",[67,575,576,580,584,588,592],{},[70,577,578],{},[100,579,103],{"href":102},[70,581,582],{},[100,583,146],{"href":145},[70,585,586],{},[100,587,184],{"href":183},[70,589,590],{},[100,591,230],{"href":229},[70,593,594],{},[100,595,596],{"href":190},"Grok Bot に付いてくる常時稼働の Linux 機を何に使うか：プラン条件と実践報告の整理",{"title":598,"searchDepth":599,"depth":599,"links":600},"",2,[601,602,610,611,612,613],{"id":24,"depth":599,"text":24},{"id":37,"depth":599,"text":37,"children":603},[604,606,607,608,609],{"id":41,"depth":605,"text":42},3,{"id":109,"depth":605,"text":110},{"id":151,"depth":605,"text":152},{"id":197,"depth":605,"text":198},{"id":235,"depth":605,"text":236},{"id":247,"depth":599,"text":247},{"id":498,"depth":599,"text":498},{"id":526,"depth":599,"text":526},{"id":573,"depth":599,"text":573},"diary",null,"図解の縦書きはスキル側を直して既存76本を一括変換、Chrome拡張の余白の犯人は別の拡張、Grok Bot の解説記事は軸ごと書き直し。成果物ではなくそれを生む側に手を入れ続けた一日の記録。","md",{},"/2026-09-02-diary","daily-log",false,"2026-09-02T00:00:00.000Z",{"title":5,"description":616},"make-diary","2026-09/2026-09-02/diary-2026-09-02",[627,628,629,630,631,632],"日記","SVG","Chrome拡張","スキル設計","進捗管理","Grok Bot","zrwDC3HDv-XpD8GQS5EbBZatVf7ptKHWpHskSptV9LE",[],[636,640,644,648,649],{"title":637,"path":638,"publishedAt":639},"2026年8月19日の開発日記 - やり直しの単位を小さくした一日","/2026-08-19-diary","2026-08-19T00:00:00.000Z",{"title":641,"path":642,"publishedAt":643},"2026年6月22日の開発日記 - 韓国半導体旬報の品目別Chrome拡張とロングフォーム2本","/2026-06-22-diary","2026-06-22T00:00:00.000Z",{"title":645,"path":646,"publishedAt":647},"2026年4月21日の開発日記 - CF教材を丸一日かけて作り直し、note.com連携と別表コンテンツも並行で進めた","/2026-04-21-diary","2026-04-21T00:00:00.000Z",{"title":103,"path":102,"publishedAt":622},{"title":650,"path":651,"publishedAt":652},"2026年8月23日の開発日記 - SVGと表が重なった経緯を調べる","/2026-08-23-diary","2026-08-23T00:00:00.000Z","https://log.eurekapu.com/og/blog/2026-09-02-diary.png?v=2026-09-02T00%3A00%3A00.000Z&title=2026%E5%B9%B49%E6%9C%882%E6%97%A5%E3%81%AE%E9%96%8B%E7%99%BA%E6%97%A5%E8%A8%98%20-%20%E5%87%BA%E3%81%A6%E3%81%8D%E3%81%9F%E3%82%82%E3%81%AE%E3%81%A7%E3%81%AF%E3%81%AA%E3%81%8F%E3%80%81%E5%87%BA%E3%81%99%E5%81%B4%E3%82%92%E7%9B%B4%E3%81%97%E3%81%9F%E4%B8%80%E6%97%A5&author=Kei%20Komatsu&sig=ea9d18bc114dcd42",1788417369052]