結論から
vibe codingは「プロンプトを書けば動くものが出てくる」ところまでは誰でもすぐに到達できます。差がつくのはその先で、完成体験→実践→公開前チェック→自走という4段階を意識して学ぶかどうかです。順番を飛ばして「なんとなく作れるけど、公開していいのか分からない」状態で止まってしまう人が一番多いパターンです。
- ステップ1〜2は「作れる」を増やすフェーズ
- ステップ3は「壊さず出せる」を身につけるフェーズ
- ステップ4は「一人で完走できる」フェーズ
このロードマップは、Cursor・Claude CodeなどのAIコーディングツールを日常的に使い始めた人が、迷わず次に何をすべきか判断できるように整理したものです。
なぜ「学習ロードマップ」が必要なのか
AIツールが書けるコード量そのものは、もう個人のスキルとほぼ無関係になりました。1文のプロンプトで、見出し・本文・ボタンが揃ったページが10分で手に入る時代です。
ただし、それは「作れる」が増えただけで、「何を作るべきか」「これは公開して大丈夫か」を判断する力は別に鍛える必要があります。ロードマップを意識せずに進むと、次のどちらかにハマりがちです。
- プロンプトを書き続けるだけで、同じレベルの成果物を量産してしまう
- 逆に「事故が怖い」と手が止まり、何も公開できないまま終わる
段階を区切って学ぶことで、この両方を避けられます。
ステップ1：完成体験を作る（目安：初日）
最初の目的は「動くものが自分の手元に残る」経験を1つ作ることです。複雑な機能である必要はありません。ランディングページ1枚、フォーム1つなど、10分〜30分で完成する題材を選びます。
ここで身につけたいのは技術ではなく、「誰に」「何を」「どう見せるか」を1文にまとめてAIに渡す感覚です。曖昧なプロンプトほど手戻りが増えるので、最初の題材はできるだけ小さく絞り込みましょう。
ステップ2：手を動かして実践する（目安：2〜4週間）
完成体験を1回作ったら、次は題材を少しずつ複雑にしていきます。フォーム送信、簡単なデータ保存、複数ページの遷移など、「動く」だけでなく「使われる」ことを意識した機能に挑戦する段階です。
この段階では、作ったものが実際にどう動いているかにも目を向けます。たとえば入力したデータがどこに保存されているかは、見た目では分かりません（データはどこに保存される？）。
このフェーズで意識したいのはスピードより再現性です。うまくいったプロンプトの型、AIとのやり取りの進め方を、自分なりにメモしておくと後で効いてきます。
ステップ3：公開前に安全を確認する
AIが生成したコードは、見た目が動いていても内部に見落としが混ざっていることがあります。特に個人開発では、このチェックを飛ばしてそのまま公開してしまうケースが多く見られます。
最低限、公開前に確認したいポイントは次の3つです。
- フォームやAPIの送信先が正しく、想定外の場所にデータが飛んでいないか
- APIキーやパスワードなどの秘匿情報がコード内に直接書かれていないか
- 個人情報を扱う場合、通信や保存が暗号化されているか
「動いている」ことと「安全に使える」ことは別の話です（「動く」と「安全に使える」はなぜ別の話なのか）。このステップだけは「慣れ」で済ませず、毎回同じチェックリストを通す運用にすることをおすすめします。
ステップ4：一人で作り切れるようになる
ここまで来ると、思いついたアイデアを自分だけで形にして公開できる状態になっています。最後の段階は、AIに頼る部分と自分で判断する部分の境界線を、自分の中にはっきり持つことです。
具体的には次のような判断です。
- 生成されたコードをそのまま使うか、書き直すか
- 公開して問題ない規模か、一度誰かにレビューしてもらうべき規模か
- 継続的に運用する前提か、検証用の使い捨てで十分か
この判断軸ができると、学習ロードマップは一周し、あとは題材を変えながら経験を積み重ねる段階に入ります。
よくある質問
プログラミングの経験がなくても、このロードマップは進められますか。
進められます。ステップ1〜2はプロンプトを書く力が中心で、コードを直接読み書きする必要はありません。ステップ3以降で、最低限「何を確認すべきか」を知っていれば十分です。
どのくらいで一通り終わりますか。
題材の複雑さ次第ですが、ステップ1は初日、ステップ2は2〜4週間を目安に考えると進めやすいです。ステップ3・4は一度身につければ、以降はどの題材にも繰り返し使えます。
公開前チェックに自信が持てません。
自己判断が不安な場合は、公開前に第三者の目を通すのも一つの方法です。VibeCode本番化では、AIで作ったプロダクトの本番化診断・改修を行っています。
