16万スター、750万ダウンロード。なのにチュートリアルがないって知ってた? 今日はMatt Pocock氏の超人気「skills repo」を正しく使うための全工程を解説するよ! まずは準備。Node.jsが入っていれば、ターミナルでこのコマンドを打つだけ。 VercelのCLIが起動するから、リストの中から「mappococ skills」を選んでインストールしてね。 これのすごいところは、Claude CodeやCursorなど、…
シーン 1
16万スター、750万ダウンロード。なのにチュートリアルがないって知ってた?
Shocked anime girl pointing at a huge GitHub star count screen, vertical 9:16, clean virtual studio, light gradient background, presenter safe zone, 5600K key light
シーン 2
今日はMatt Pocock氏の超人気「skills repo」を正しく使うための全工程を解説するよ!
Kurage VTuber explaining with a friendly smile, tech background, vertical 9:16, floating UI panels, soft rim light, friendly AI explainer atmosphere
シーン 3
まずは準備。Node.jsが入っていれば、ターミナルでこのコマンドを打つだけ。
Terminal screen showing 'npx skills@latest add mappococ/skills', vertical 9:16, white tech studio, subtle data particles, caption-safe lower area
シーン 4
VercelのCLIが起動するから、リストの中から「mappococ skills」を選んでインストールしてね。
Selection menu in a CLI tool highlighting 'mappococ skills', vertical 9:16, professional educational set, calm motion graphics, bright optimistic lighting
シーン 5
これのすごいところは、Claude CodeやCursorなど、どのAIエージェントでも使えるってこと!
Logos of Claude and Cursor connected to a central skill hub, vertical 9:16, clean virtual studio, light gradient background, presenter safe zone, 5600K key light
シーン 6
ここで超重要。コツは「一つの連続したコンテキスト」で、上から順番に進めること!
A single continuous glowing thread connecting different tasks, vertical 9:16, floating UI panels, soft rim light, friendly AI explainer atmosphere
シーン 7
ステップ1は `/grill-with-docs`。まずドキュメントを読み込ませて、AIと認識を完全に合わせるよ。
AI reading a large document and nodding in agreement, vertical 9:16, white tech studio, subtle data particles, caption-safe lower area
シーン 8
次に `/to-spec` と `/to-tickets`。これで仕様書とチケットを自動生成して、やることを明確にするんだ。
AI generating a structured spec sheet and task tickets, vertical 9:16, professional educational set, calm motion graphics, bright optimistic lighting
シーン 9
そして `/implement` で実装!これにはコードレビューの工程も最初から組み込まれてるよ。
AI writing code while a 'Code Review' checkmark appears, vertical 9:16, clean virtual studio, light gradient background, presenter safe zone, 5600K key light
シーン 10
なぜこれがいいのか?AIが勝手に進むんじゃなくて、仕様や基準と照らし合わせながら進むから精度が高いんだ。
Comparison screen showing 'Spec' vs 'Code' with a green checkmark, vertical 9:16, floating UI panels, soft rim light, friendly AI explainer atmosphere
シーン 11
「ドキュメント確認→仕様作成→チケット発行→実装」のこの流れをセットで使うのが正解だよ。
Flowchart showing the 4 steps in a loop, vertical 9:16, white tech studio, subtle data particles, caption-safe lower area
シーン 12
これで開発効率が爆上がりするはず!詳細はMatt Pocock氏のレポをチェックしてみてね。
Kurage VTuber waving goodbye with a 'Check GitHub' button, vertical 9:16, professional educational set, calm motion graphics, bright optimistic lighting