[{"data":1,"prerenderedAt":453},["ShallowReactive",2],{"content-/fudosan-toshi-intro-5step":3,"all-pages-for-dir":433,"related-/fudosan-toshi-intro-5step":434,"og-image-/fudosan-toshi-intro-5step":452},{"id":4,"title":5,"body":6,"category":415,"concepts":416,"description":417,"extension":418,"meta":419,"navigation":420,"ogImage":416,"path":421,"project_name":422,"published":423,"publishedAt":424,"seo":425,"stem":426,"tags":427,"todo":416,"unpublished":423,"updatedAt":416,"__hash__":432},"pages/2026-06/2026-06-14/fudosan-toshi-intro-5step.md","不動産投資ガイド /fudosan-toshi に5STEP構成のイントロを足し、9章すべてにパンクズを通した",{"type":7,"value":8,"toc":402},"minimark",[9,21,24,29,39,49,60,63,66,94,97,107,111,116,123,130,134,137,170,173,184,188,195,218,236,239,243,246,293,296,302,306,319,322,325,336,340,343,363,372,375,378],[10,11,12,16,17,20],"p",{},[13,14,15],"code",{},"/fudosan-toshi","（玉川メソッド4冊統合の不動産投資ガイド）を開いたとき、ハブから章へ飛んだあと「戻る導線」がなくて指が宙を彷徨った。同じ違和感を ",[13,18,19],{},"/tokibo"," で先に解消していたので、同じ作法を fudosan-toshi にも横展開した。ついでに、9章ある章一覧そのものが「何から読めばいいか」を示せていなかったので、tokibo の intro と同型の「全章の見取り図 + 章別サマリー」ページを差し込んだ。",[10,22,23],{},"このログは、午前のパンクズ統一から午後の intro 実装までを、一本の流れとして残しておく。",[25,26,28],"h2",{"id":27},"違和感-ハブから章に飛んだら戻れない","違和感: ハブから章に飛んだら戻れない",[10,30,31,32,35,36,38],{},"朝、",[13,33,34],{},"http://localhost:3000/fudosan-toshi"," を開いてガイド章を読んだあと、画面上に戻りリンクが見当たらないことに気づいた。ホームや他のページにはパンクズが通っているのに、",[13,37,15],{}," 配下の13ページだけ抜けている。",[10,40,41,42,44,45,48],{},"最初は「13ページに同じ HTML を貼って回る」のがまっすぐな選択肢に見えたが、すぐに却下した。",[13,43,19],{}," でも同じ問題を解いたとき、各ページに同じスニペットを貼るのではなく、",[13,46,47],{},"layout"," を1枚作って差し込む方式で片付けたのを思い出したからだ。",[10,50,51,52,55,56,59],{},"Claude Code に「tokibo と同じ層に ",[13,53,54],{},"fudosan-toshi"," レイアウトを切って、各ページは ",[13,57,58],{},"definePageMeta({ layout: 'fudosan-toshi' })"," を1行足すだけにしてほしい」と指示した。",[25,61,62],{"id":62},"レイアウトに集約してパンクズを通す",[10,64,65],{},"レイアウト方式に決めたあと、Claude Code に次の作業を順に進めさせた。",[67,68,69,80,88],"ul",{},[70,71,72,75,76,79],"li",{},[13,73,74],{},"apps/web/app/layouts/fudosan-toshi.vue"," を新規作成し、",[13,77,78],{},"\u003CBreadcrumb />"," をヘッダー直下に置く",[70,81,82,84,85,87],{},[13,83,15],{}," 配下の13ページに ",[13,86,58],{}," を1行追加",[70,89,90,93],{},[13,91,92],{},"apps/web/app/utils/breadcrumbs.ts"," に各 path のラベルを登録",[10,95,96],{},"実装が走り終わってから、ハブ・ガイド章（zentaikan / bukken / yushi 等）・Q&A 章の3パターンをそれぞれブラウザで開いて、パンクズが「ホーム > 不動産投資ガイド > 第N章」の形で並ぶことを確認した。フォントサイズも左マージンもホームと揃っていて、追加コードがレイアウトに閉じている分だけ、章ページ側の Vue は触らずに済んでいる。",[10,98,99,102,103,106],{},[13,100,101],{},"breadcrumbs.ts"," を触ったので、ユニットテストも追加した。",[13,104,105],{},"pnpm test:run"," で31テスト全部 pass。これで午前パートは閉じた。",[25,108,110],{"id":109},"違和感その2-9章の地図がない","違和感その2: 9章の地図がない",[10,112,113,115],{},[13,114,15],{}," のハブをもう一度開いたとき、今度は別の違和感に手が止まった。章カードが9枚ベタッと並んでいるだけで、「どれから読むのが自然か」「章同士がどう繋がるのか」が見えない。",[10,117,118,119,122],{},"これも ",[13,120,121],{},"/tokibo/intro"," で先に解いていた問題だった。tokibo は8章を4STEPでグルーピングした「全章の見取り図」を SVG で描いて、初見の読者がそこから入れるようにしてある。同じパターンを fudosan-toshi にも持ち込みたかった。",[10,124,125,126,129],{},"別セッションで計画書だけ先に書いて、",[13,127,128],{},"memo/2026-06-14/fudosan-toshi-intro-plan.md"," に置いておいた。9章ある分、tokibo の4STEP より1STEP増やして5本立てにする方針も計画書側で決めた。",[25,131,133],{"id":132},"_5step-の配分-9章を読む順番に組み替える","5STEP の配分: 9章を「読む順番」に組み替える",[10,135,136],{},"計画書で決めた配分はこうなった。",[67,138,139,146,152,158,164],{},[70,140,141,145],{},[142,143,144],"strong",{},"STEP 00 — 全体観をつかむ",": 序章（玉川メソッドの4本柱）",[70,147,148,151],{},[142,149,150],{},"STEP 01 — 何を買うかを決める",": 第1章 収益とIRR / 第2章 物件選定",[70,153,154,157],{},[142,155,156],{},"STEP 02 — 仕組みを整える",": 第3章 銀行融資 / 第4章 税金",[70,159,160,163],{},[142,161,162],{},"STEP 03 — 運営して出口へ",": 第5章 賃貸運営 / 第6章 出口戦略",[70,165,166,169],{},[142,167,168],{},"STEP 04 — 規模拡大とリスク",": 第7章 資産管理と財務 / 第8章 シナリオ分析",[10,171,172],{},"最初は「収益指標」と「物件選定」を別 STEP にしようかと迷ったが、玉川メソッドの本筋が「IRRで測れる物件をIRRで選ぶ」と一本道だったので、同じ STEP に押し込んだ。「仕組みを整える」も同じで、融資と税金は別の話に見えて、レバレッジを掛けた瞬間に税の話が連動して走り出すので、ここも同居させた。",[10,174,175,176,179,180,183],{},"STEP 00 だけはカード1枚で全幅、STEP 01-04 は左右に2枚並ぶ。viewBox は当初 ",[13,177,178],{},"720 × 880"," を見積もったが、実装中に STEP 04 のカードが収まらなくて ",[13,181,182],{},"720 × 968"," まで縦に伸ばす羽目になった。8の倍数で刻むベースライン規律は守った。",[25,185,187],{"id":186},"計画書を-codex-に3回投げる","計画書を Codex に3回投げる",[10,189,190,191,194],{},"ExitPlanMode する前に、計画書を ",[13,192,193],{},"codex exec -m gpt-5.5"," でレビューしてもらった。グローバルルールに「致命的な点だけ指摘して、瑣末なクソリプはしないで」と添えて投げる作法を仕込んである。",[10,196,197,198,201,202,205,206,209,210,213,214,217],{},"初回レビューで返ってきた致命的指摘は3点あった。fudosan-toshi の章 URL が ",[13,199,200],{},"/fudosan-toshi/guide/{slug}"," の形（途中に ",[13,203,204],{},"guide"," が入る）で tokibo のフラットな ",[13,207,208],{},"/tokibo/{slug}"," と違うこと、TOC の id プレフィックスが衝突しないように ",[13,211,212],{},"fudosan-intro-h-{i}"," に切り替える必要があること、ハブの ",[13,215,216],{},".hub-card"," が tokibo と DOM 構造が違うのでスタイルを流用しきれないこと。どれも実装中にハマる地雷だったので、計画書側で先に明文化した。",[10,219,220,223,224,227,228,231,232,235],{},[13,221,222],{},"codex exec resume --last"," で2回目を回したら、SVG ルール側の指摘が来た。塗りで分離するルール（",[13,225,226],{},"\u003Crect>"," の ",[13,229,230],{},"stroke"," 禁止、",[13,233,234],{},"rx"," 禁止）と、サブタイトルに結論文を昇格させて図下にキーメッセージを別置きしないルール。これは午前のグリッド移行作業（後述）で固めた規律と同じなので、計画書本文に章ごとの SVG 設計（viewBox サイズと推奨レイアウト）を書き足した。",[10,237,238],{},"3回目で「致命的な指摘はない」と返ってきたので、計画書を確定して別セッションでの実装に渡した。",[25,240,242],{"id":241},"並列実装-5フェーズを一気に走らせる","並列実装: 5フェーズを一気に走らせる",[10,244,245],{},"実装セッション側では、計画書の Phase 1 〜 Phase 5 を頭から順に Claude Code に流させた。",[247,248,249,258,268,277,283],"ol",{},[70,250,251,253,254,257],{},[13,252,101],{}," に ",[13,255,256],{},"/fudosan-toshi/intro"," のラベルを追加",[70,259,260,263,264,267],{},[13,261,262],{},"FudosanIntroMap.vue"," を ",[13,265,266],{},"TokiboIntroMap.vue"," から派生して5STEP構成に組み替え",[70,269,270,263,273,276],{},[13,271,272],{},"FudosanIntroBody.vue",[13,274,275],{},"TokiboIntroBody.vue"," から派生して9セクション分のリードと SVG 図解を新規実装",[70,278,279,282],{},[13,280,281],{},"pages/fudosan-toshi/intro.vue"," を薄いページシェルとして作成",[70,284,285,288,289,292],{},[13,286,287],{},"FudosanHub.vue"," の章カード群の手前に「イントロダクション」カードを差し込み、",[13,290,291],{},"hub-card--intro"," クラスでマゼンタ左ボーダーを当てる",[10,294,295],{},"Phase 2 の途中で「STEP 04 が抜けていました。viewBox を広げて第7-8章のカードを追加します」とログに残っていて、計画段階で STEP 04 を見落としかけたのが透けて見える。グリッドの縦幅を伸ばす方向で吸収してもらった。",[10,297,298,299,301],{},"Phase 6 のブラウザ検証では Chrome DevTools MCP を使ってナビゲートと CTA リンクの先を全部踏ませた。9セクションすべてに ",[13,300,200],{}," が正しく刺さっていることを目視確認。SVG をクリックして拡大モーダルが開き、Esc で閉じる挙動も問題なし。",[25,303,305],{"id":304},"副産物-9章の-svg-をグリッドに揃え終えた","副産物: 9章の SVG をグリッドに揃え終えた",[10,307,308,309,312,313,315,316,318],{},"イントロ実装と並行して、午前から ",[13,310,311],{},"memo/2026-06-14/fudosan-toshi-grid-migration-plan.md"," 側の作業も走らせていた。これは ",[13,314,15],{}," 配下の全 SVG（Guide 57 + QA 77 = 約128枚）を、Müller-Brockmann グリッドルール（viewBox 720×N、12カラム、塗りで分離、",[13,317,234],{}," 禁止）に揃えるタスク。",[10,320,321],{},"Phase 1.1 で Zentaikan（1図）を片付けたあと、Phase 1.2 を Yushi / ShuekiIrr / Zaimu / Zeikin / Scenario / Unei / Deguchi の7章に分けて、サブエージェントを並列起動して書かせた。1章 = 1サブエージェント。Q&A 側13章も同じ要領で並列に処理して、午後の途中で全 128 枚のグリッド化が終わった。",[10,323,324],{},"並列で走らせる利点は、メインセッションのコンテキストが SVG 文字列で膨らまない点。1ファイル平均150行 × 128ファイル = 約 19,200 行をメインで読んでいたら、tool call malformed で落ちていた可能性が高い。",[10,326,327,328,331,332,335],{},"イントロページに埋め込んだ9枚の SVG 図解も、この同じグリッドルールに沿って描いた。Inter + Noto Sans JP、タイトル font-size 20 / サブタイトル font-size 15、",[13,329,330],{},"#111315"," ink と ",[13,333,334],{},"#ed1e79"," マゼンタアクセント。tokibo の SVG と並べても、同じ言語で書かれた図に見える。",[25,337,339],{"id":338},"学び-レイアウト1枚で13ページ分の編集を1ヶ所に集約する","学び: レイアウト1枚で「13ページ分の編集」を1ヶ所に集約する",[10,341,342],{},"今日の作業を通して、改めて手応えがあったのは「同じ違和感を13回直しに行かない」設計判断のところ。",[67,344,345,352,358],{},[70,346,347,348,351],{},"パンクズを13ページに貼って回るのではなく、",[13,349,350],{},"layouts/fudosan-toshi.vue"," に集約する",[70,353,354,355,351],{},"章URLのラベルを13箇所に分散させずに ",[13,356,357],{},"utils/breadcrumbs.ts",[70,359,360,361,351],{},"章の見取り図を各章ページに書き散らさず、",[13,362,256],{},[10,364,365,368,369,371],{},[13,366,367],{},"tokibo"," で先に正解パターンを踏んでいたからこそ、",[13,370,54],{}," 側で同じ判断が秒で出せた。1回目で迷って正解を引いた経験を、2回目で再利用するときの速度の差は大きい。",[10,373,374],{},"もうひとつ、計画書を ExitPlanMode する前に Codex に3回投げる作法も、今日効いた。1回目で章URL構造の差分、2回目で SVG ルール、3回目で「致命的指摘なし」と落ちる流れになっていて、計画段階で潰せた地雷が実装フェーズで顔を出さなかった。",[25,376,377],{"id":377},"残タスク",[67,379,380,385,388],{},[70,381,382,384],{},[13,383,15],{}," トップと各 Guide / 各 QA 章のブラウザ目視確認（chrome-devtools MCP がハング気味なので、ユーザー手元の dev で巡回するのが早い）",[70,386,387],{},"旧 Diagram の削除タイミングを別計画書に切り出す（比較期間中は新旧並列表示のまま）",[70,389,390,391,394,395,397,398,401],{},"本番デプロイ後の ",[13,392,393],{},"_payload.json"," 検証（",[13,396,256],{}," が SSG で正しく出るか、",[13,399,400],{},"useAsyncData"," を使っていないので payload null 化リスクはないはずだが、デプロイ後に1回踏む）",{"title":403,"searchDepth":404,"depth":404,"links":405},"",2,[406,407,408,409,410,411,412,413,414],{"id":27,"depth":404,"text":28},{"id":62,"depth":404,"text":62},{"id":109,"depth":404,"text":110},{"id":132,"depth":404,"text":133},{"id":186,"depth":404,"text":187},{"id":241,"depth":404,"text":242},{"id":304,"depth":404,"text":305},{"id":338,"depth":404,"text":339},{"id":377,"depth":404,"text":377},"dev",null,"tokibo の intro パターンを fudosan-toshi に転用し、9章を「全体観 / 何を買うか / 仕組み / 運営と出口 / 拡大とリスク」の5STEPでグルーピングしたイントロページを追加した。あわせて、ハブから章ページまで13ページに layout 経由でパンクズを差し込んで戻り導線を統一した記録。","md",{},true,"/fudosan-toshi-intro-5step","mdx-playground",false,"2026-06-14T00:00:00.000Z",{"title":5,"description":417},"2026-06/2026-06-14/fudosan-toshi-intro-5step",[54,428,429,430,431],"イントロダクション","パンクズリスト","SVG","Nuxt","-DcKJgBlB1NU-WXyQ2YTS-v1R52FECm0EEUBXRAZqps",[],[435,439,443,446,449],{"title":436,"path":437,"publishedAt":438},"過去記事に散らばったSVG図版を一覧するギャラリービューアを作った","/svg-gallery-viewer","2026-07-01T00:00:00.000Z",{"title":440,"path":441,"publishedAt":442},"2026年6月30日の開発日記 - つくみセミナードラフトとSVG 17枚スライド","/2026-06-30-diary","2026-06-30T00:00:00.000Z",{"title":444,"path":445,"publishedAt":424},"カメラの露出シミュレーターを Nuxt のページに移植して、SS/F値/ISO の三角関係を体感する","/camera-exposure-simulator",{"title":447,"path":448,"publishedAt":424},"宅建オリジナル教科書プロジェクト Phase 1.5 着手 — 金型 5_1『宅地建物取引業・免許』の本文 + SVG 17 枚をサブエージェント並列で生成した","/takken-textbook-phase-1-5-start",{"title":450,"path":451,"publishedAt":424},"ガイド /tokibo に第1〜8章を俯瞰する『イントロダクション』を入れて、各章へのSVG地図リンクを埋め込んだ","/tokibo-introduction-chapter","https://log.eurekapu.com/og/blog/fudosan-toshi-intro-5step.png?v=2026-06-14T00%3A00%3A00.000Z&title=%E4%B8%8D%E5%8B%95%E7%94%A3%E6%8A%95%E8%B3%87%E3%82%AC%E3%82%A4%E3%83%89%20%2Ffudosan-toshi%20%E3%81%AB5STEP%E6%A7%8B%E6%88%90%E3%81%AE%E3%82%A4%E3%83%B3%E3%83%88%E3%83%AD%E3%82%92%E8%B6%B3%E3%81%97%E3%80%819%E7%AB%A0%E3%81%99%E3%81%B9%E3%81%A6%E3%81%AB%E3%83%91%E3%83%B3%E3%82%AF%E3%82%BA%E3%82%92%E9%80%9A%E3%81%97%E3%81%9F&author=Kei%20Komatsu&sig=8a7e083c81c47098",1785379837787]