[{"data":1,"prerenderedAt":291},["ShallowReactive",2],{"content-/skill-to-lesson-first-run":3,"all-pages-for-dir":289,"og-image-/skill-to-lesson-first-run":290},{"id":4,"title":5,"body":6,"category":271,"concepts":272,"description":273,"extension":274,"meta":275,"navigation":249,"ogImage":272,"path":276,"project_name":277,"published":278,"publishedAt":279,"seo":280,"stem":281,"tags":282,"todo":272,"unpublished":278,"updatedAt":272,"__hash__":288},"pages/2026-07/2026-07-04/skill-to-lesson-first-run.md","Claude Codeスキルの更新を教材に同期する「skill-to-lesson」を初実運用した",{"type":7,"value":8,"toc":258},"minimark",[9,13,17,21,24,37,45,49,56,59,73,76,83,87,90,93,101,104,115,118,122,125,128,135,142,146,149,152,163,167,170,173,187,190,193,200,203,235,238],[10,11,5],"h1",{"id":12},"claude-codeスキルの更新を教材に同期するskill-to-lessonを初実運用した",[14,15,16],"p",{},"スキルを直したら教材も直る——そういう仕組みを作ってあったのを、今日初めて本番で回した。svg-diagram スキル側の追補をSVG図解講座のレッスンコンテンツに同期させ、図が抜けていたセクションはNG/OK対比図つきに格上げして公開まで持っていった。",[18,19,20],"h2",{"id":20},"積み残しの棚卸しから開始",[14,22,23],{},"朝一番に「積み残しがいくつかあると思うので調べて」と Claude Code に棚卸しさせた。出てきたのは3系統。",[25,26,27,31,34],"ul",{},[28,29,30],"li",{},"7/2 に立てた次セッション実装計画（品質チェックスクリプト＋大物選定）が丸ごと未着手",[28,32,33],{},"SVG図解講座（draft）の公開前の仕上げが残り",[28,35,36],{},"git の未整理ファイル",[14,38,39,40,44],{},"このうち2番目、SVG図解講座の仕上げに着手することにした。本体は 7/3 にコミット済みで、ESLint・テスト2,631件・表示確認まで通っている。残っていたのは原典スキルとの対応表 ",[41,42,43],"code",{},"mappings/svg-diagram.md"," の同期まわりだった。",[18,46,48],{"id":47},"公開前仕上げ-crlfに足を取られつつ-draft-解除まで","公開前仕上げ — CRLFに足を取られつつ draft 解除まで",[14,50,51,52,55],{},"仕上げは配布物側の同期から進めさせた。途中、改行コード（CRLF）が ID 比較を壊して照合が全滅し、",[41,53,54],{},"tr -d '\\r'"," を挟んで再実行する場面があった。Windows 環境で文字列比較をやるときの定番の罠に、またかかった。",[14,57,58],{},"そこからは一気通貫で流れた。",[25,60,61,64,67,70],{},[28,62,63],{},"本文反映 → toc と millerSlideCounts の更新",[28,65,66],{},"draft 解除 → content JSON 再生成（69ファイル）",[28,68,69],{},"ESLint 指摘ゼロ → テスト2,631件 全PASS",[28,71,72],{},"dev サーバーで表示確認 → コミット＋デプロイ",[14,74,75],{},"表示確認では、講座一覧に「ドラフト」表示が7件残っているように見えて一瞬ひやりとしたが、当該カード周辺を確認させたら他講座のものだった。SVG図解講座側はすべて反映済み。",[14,77,78,79,82],{},"ひとつだけ本番で引っかかった。トップの講座一覧カードの画像が404を返す。原因は、検証で叩いた素のURLに404が4時間キャッシュされていたことだった。講座の全ページ・全画像・配布zipはすでに正常配信されていて、残っていたのはこのカード画像1枚だけ。講座画像一式を R2 にアップロードし、",[41,80,81],{},"?v=1"," を付与して再デプロイしたら直った。公開作業はこれで完了。",[18,84,86],{"id":85},"skill-to-lesson-の初実運用","skill-to-lesson の初実運用",[14,88,89],{},"ここからが今日の本題。SVG図解講座には「原典スキルが更新されたらコンテンツにも反映できる」仕組みを仕込んであった。svg-diagram スキル側の内容は実際に変えてあるので、これを試すことにした。",[14,91,92],{},"まずスキル側の変更履歴を git で管理し始めたいので、現時点でコミットさせた。そのうえで skill-to-lesson スキルを使い、原典スキルの変更内容を確認して講座へ同期させた。",[14,94,95,96,100],{},"結果は意外なもので、",[97,98,99],"strong",{},"スキル側の追補（「フロー図は縦に流す」など新セクション2つ＋禁止事項の改稿）は、今朝の公開仕上げで mappings 経由の同期が走った時点ですでに講座・配布物・本番のすべてに反映済み","だった。今回新たに同期するものはゼロ。仕組みが先回りして仕事を終えていた形になる。",[14,102,103],{},"とはいえ「反映済みです」だけでは信用しない。「表示確認してもらってますか」と聞いてみると、実画面の確認は生成JSONとHTTP応答のチェックまでだと分かった。そこで本番URLで3箇所をスクリーンショットで目視させた。",[25,105,106,109,112],{},[28,107,108],{},"「フロー図は縦に流す」（レイアウトの章）— チャプター列の5番目に表示、スライドカウントも「5/16」に更新",[28,110,111],{},"もう1つの新セクション — 本文・コード例・右側目次まで正常",[28,113,114],{},"改稿した禁止事項 — 更新後の文面で表示",[14,116,117],{},"「URLっていうか、どこですか？パス」と聞いて、本番とローカルホストのURLを並べて出させ、自分の目でも場所を押さえた。",[18,119,121],{"id":120},"どのsvgがビフォアか分からない往復","「どのSVGがビフォアか分からない」往復",[14,123,124],{},"表示を眺めていて気づいた。「フロー図は縦に流す」のセクションに、ビフォア・アフターの図が具体的にない。修正したSVGは手元にあるはずなのに、それがどれか分からないのか？と聞いてみた。",[14,126,127],{},"返ってきた説明はこうだった。原典スキルの追補にはNG/OK画像が無く本文＋コード例だけだったので、講座側もそれに合わせて文章のみのB型で反映した。スキルの手順上「NG/OK例が変わったルールだけSVGを再作成する」なので、図なしはルール通り——と。",[14,129,130,131,134],{},"理屈は通っているが、実物があるなら図にしたい。コード例の文言を手がかりに探させかけたところで、こちらから ",[41,132,133],{},"apps/web/public/images/genai-idea-after-filing/figure-02.svg"," のパスを渡した。「今がアフターで、ビフォアは git の履歴から見て」と伝えると、履歴から旧版を掘り出してNG/OKのSVG2枚を作成、XMLチェックを通し、講座データをB型からA型（対比図つき）に書き換えてくれた。テストは2,631件PASS。",[14,136,137,138,141],{},"書き換え後も「NG対比図はどこに入れたのか」とパスを確認する往復を挟んだ。SVGファイルの場所と表示されるページを出させ、自分で確認してからコミット（",[41,139,140],{},"05eae56e","、SVG2枚＋データ＋slideCounts＋mappings の5ファイル）。新画像2枚は R2 アップロード済みだったので、デプロイは自分側でやることにして午前を締めた。",[18,143,145],{"id":144},"夕方-次にコンテンツ化するスキルを洗い出す","夕方 — 次にコンテンツ化するスキルを洗い出す",[14,147,148],{},"夕方、完成したレッスンコンテンツを改めて開いた。章立てとスライド送りの構成を眺めて、素直によくできていると思った。それなら、他の自作スキルも同じ型でコンテンツ化できるはずだ。「どのスキルをコンテンツにすればいいか、優先度をつけて列挙して」と頼んだ。",[14,150,151],{},"SVG図解講座がなぜ成立したかを4つの評価軸に分解したうえで全スキルを仕分けさせたところ、最有力は excel-html-mock、次点が visual-design-essentials と japanese-tech-writing という結果になった。",[14,153,154,155,158,159,162],{},"ただ、チャット上の一覧は文字の壁で、目が上下に往復するばかりだった。そこで ",[41,156,157],{},".html"," でドキュメント化させ、Chrome DevTools 経由で表示させた。",[41,160,161],{},"memo/2026-07-04/skill-lesson-candidates.html"," に候補マトリックスとしてまとまり、格段に見通しが良くなった。",[18,164,166],{"id":165},"スキルってこれだけ-走査漏れの指摘","「スキルってこれだけ？」— 走査漏れの指摘",[14,168,169],{},"マトリックスを見て違和感が湧いた。スキルの数が少なすぎる。mdx-playground のプロジェクトレベルのスキル、スラッシュコマンド、ユーザーレベルのスキルとコマンド——これも全部スキルと同等のはずだが、見てくれているのか？",[14,171,172],{},"案の定、見落としだった。最初の走査は「ユーザーレベルのスキル」と「eurekapu のプロジェクトスキル」の2箇所だけ。漏れていたのは以下だった。",[25,174,175,178,181,184],{},[28,176,177],{},"ユーザーレベルのスラッシュコマンド 12件",[28,179,180],{},"mdx-playground のプロジェクトスキル 10件",[28,182,183],{},"mdx-playground のスラッシュコマンド 23件",[28,185,186],{},"eurekapu のスラッシュコマンド 4件",[14,188,189],{},"全6箇所を走査し直させ、HTMLをv2に更新、Chromeのタブも再読み込みして網羅を確認した。スキル10件・コマンド計39件が候補の母集団に加わったので、明日見るマトリックスは景色が変わっているはずだ。",[18,191,192],{"id":192},"進捗を残して明日へ",[14,194,195,196,199],{},"v2の確認は明日やることにして、進捗を残させた。",[41,197,198],{},"memo/2026-07-04/skill-lesson-progress.md"," に今日やったこと・選定結果・明日やることをチェックボックス形式で記録し、Googleタスクにも明日期日で登録。進捗は3箇所に残った状態で終了。",[18,201,202],{"id":202},"学び",[25,204,205,211,217,223,229],{},[28,206,207,210],{},[97,208,209],{},"スキル→教材の同期は「仕組みが先回りする」形で動いた","。skill-to-lesson を明示的に回す前に、公開仕上げの mappings 同期がスキル追補を取り込んでいた。差分ゼロの確認自体が初実運用の成果",[28,212,213,216],{},[97,214,215],{},"「反映済み」と「表示確認済み」は別物","。生成JSONとHTTP応答が通っていても、実画面のスクショ目視までやらせないと安心できない",[28,218,219,222],{},[97,220,221],{},"原典に図が無ければ教材も図なし、はルール通りだが最善ではない","。実物のSVGがあるならパスを渡してA型に格上げする、という人間側の一手で教材の質が上がった",[28,224,225,228],{},[97,226,227],{},"候補の洗い出しは走査範囲を先に確認する","。プロジェクトレベル・ユーザーレベル・スラッシュコマンドまで含めて6箇所、と指摘するまで2箇所しか見ていなかった",[28,230,231,232,234],{},"CRLF は今日も文字列比較を壊す。",[41,233,54],{}," を反射で挟めるようにしておく",[18,236,237],{"id":237},"明日やること",[25,239,242,252],{"className":240},[241],"contains-task-list",[28,243,246,251],{"className":244},[245],"task-list-item",[247,248],"input",{"disabled":249,"type":250},true,"checkbox"," 候補マトリックスv2を開いて、最有力 excel-html-mock のコンテンツ化に着手するか判断する",[28,253,255,257],{"className":254},[245],[247,256],{"disabled":249,"type":250}," 7/2 の次セッション実装計画（品質チェックスクリプト＋大物選定）の扱いを決める",{"title":259,"searchDepth":260,"depth":260,"links":261},"",2,[262,263,264,265,266,267,268,269,270],{"id":20,"depth":260,"text":20},{"id":47,"depth":260,"text":48},{"id":85,"depth":260,"text":86},{"id":120,"depth":260,"text":121},{"id":144,"depth":260,"text":145},{"id":165,"depth":260,"text":166},{"id":192,"depth":260,"text":192},{"id":202,"depth":260,"text":202},{"id":237,"depth":260,"text":237},"dev",null,"自作のskill-to-lessonスキルを初めて実運用し、SVG図解スキルの追補をレッスンコンテンツへ同期した。図なしセクションのNG/OK対比図への格上げと、次にコンテンツ化するスキル候補の洗い出しまでの記録。","md",{},"/skill-to-lesson-first-run","eurekapu-nuxt4",false,"2026-07-04T00:00:00.000Z",{"title":5,"description":273},"2026-07/2026-07-04/skill-to-lesson-first-run",[283,284,285,286,287],"Claude Code","skill-to-lesson","SVG図解","レッスンコンテンツ","eurekapu","5SDt2xvQnvSjgrDjBDyDlw2-hmlYh6hv3AYDblwXFH8",[],"https://log.eurekapu.com/og/blog/skill-to-lesson-first-run.png?v=2026-07-04T00%3A00%3A00.000Z&title=Claude%20Code%E3%82%B9%E3%82%AD%E3%83%AB%E3%81%AE%E6%9B%B4%E6%96%B0%E3%82%92%E6%95%99%E6%9D%90%E3%81%AB%E5%90%8C%E6%9C%9F%E3%81%99%E3%82%8B%E3%80%8Cskill-to-lesson%E3%80%8D%E3%82%92%E5%88%9D%E5%AE%9F%E9%81%8B%E7%94%A8%E3%81%97%E3%81%9F&author=Kei%20Komatsu&sig=5bc4d0ec0621b65e",1783483675806]