「vibe coding」「バイブコーディング」という言葉を最近よく見るけれど、結局それは何なのか。この記事だけで一通り分かるようにまとめました。
書いているのは、React / Next.js / TypeScript で受託開発をしている現役エンジニアです。実際に毎日AIコーディングツールを使って納品している立場から、宣伝抜きで書きます。
vibe coding（バイブコーディング）とは（30秒で分かる説明）
バイブコーディング（vibe coding）とは、コードを自分で書く代わりに、AIに自然言語で指示してソフトウェアを作る開発スタイルのことです。
読み方は「バイブコーディング」。英語表記は vibe coding です。
いちばん大事なのは、役割分担が変わったという点です。
- あなたの仕事＝ 何を作りたいか（What）を伝えること
- AIの仕事＝ どう実装するか（How）を考えて書くこと
「プログラミング＝英語や記号を打ち込む作業」というイメージが、ここで崩れます。日本語で「こういうアプリを作って」と伝えるだけで、動くものが出てくる。それがバイブコーディングです。
「vibe coding」の意味
vibe coding の vibe は、英語で「雰囲気」「ノリ」を指す言葉です。
細かい仕様を詰める前に、「こんな感じのものが欲しい」という雰囲気を伝えて作り始める。その進め方を指してこう呼ばれるようになったそうです。従来の開発が「仕様書を固めてから書く」だったのに対し、こちらは動くものを先に出して、見ながら直すやり方です。
言葉自体は2025年ごろから急速に広まりました。
従来のプログラミングと何が違うのか
| 従来のプログラミング | バイブコーディング | |
|---|---|---|
| 書く人 | 人間 | AI |
| 必要なもの | 文法の知識 | 伝える力 |
| 進め方 | 仕様を固めてから書く | 動かしながら直す |
| つまずく場所 | 書けない | 意図が伝わらない／確認できない |
| 最初の成果まで | 数週間〜数ヶ月 | 数十分〜数日 |
注目してほしいのはつまずく場所が移動していることです。「書けなくて詰まる」から「思った通りに動いているか判断できなくて詰まる」に変わりました。ここが後述する落とし穴に直結します。
vibe coding でできること
実際に個人が到達できる範囲を、難易度順に挙げます。
初日に届くもの
- 自己紹介・ポートフォリオの1ページサイト
- 計算ツール（見積もり・割り勘・単位換算）
- 定型文を作るジェネレーター
数日で届くもの
- 読書記録・経費メモなど、データを保存するアプリ
- CSVの整形・集計ツール（Excel作業の置き換え）
- 社内向けのチェックリストや申請フォーム
1〜3週間で届くもの
- 会員登録つきのWebアプリ
- LINEボット・チャットボット
- 業務システムの動くたたき台
「エンジニアじゃないと無理」だった領域が、指示の出し方さえ覚えれば個人でも触れるようになってきました。より詳しい一覧は作れるもの10例にまとめています。
逆に、まだ厳しいこと
宣伝ではないので、はっきり書きます。次の領域はAIに任せきりにすべきではありません。
- お金を扱うシステム（決済・会計の本番運用）
- 個人情報を大量に扱うシステム
- 止まると業務が止まる基幹システム
共通しているのは「間違えたときのコストが高い」ことです。作れるかどうかではなく、責任を取れるかどうかの問題になります。
vibe coding のやり方は3ステップ
1. vibe coding に使うツールを1つ用意する
よく名前が挙がるのは Cursor、Claude Code、GitHub Copilot あたりです。ただ、この3つはどれもパソコンに入れて使います。とりあえず1回動かしてみたいだけなら、インストールの要らないブラウザ型のほうが早いです。
| ツール | 使う場所 | インストール | 最初の1本に |
|---|---|---|---|
| v0 | ブラウザ | 不要 | ◎ とにかく早く動くものを見たい人 |
| Cursor | エディタ | 必要 | ◎ 何が起きているか見ながら進めたい人 |
| Claude Code | ターミナル | 必要 | ○ まとめて任せたい人 |
| GitHub Copilot | エディタの拡張 | 必要 | △ すでにコードを書く人向け |
私は普段 Claude Code や Cursor などを組み合わせて納品しています。ただ、人に最初の1本を聞かれたときは v0 や Cursor を答えます。
かつては「本格的な開発にはターミナル（黒い画面）が必須」と言われていましたが、最近はブラウザやエディタのアプリ上（GUI）だけで、データベースや認証を含む本格的で実用的なアプリが十分に作れるようになっています。ターミナル操作に不慣れな初心者でも、画面を見ながら直感的にバイブコーディングを進められます。Claude Code は一括処理や自律的な開発が非常に強力ですが、まずは敷居の低いアプリ型・ブラウザ型から触ってみるのがおすすめです。
どれも無料で試せる範囲があります。まずはそこで、AIに指示して何かが動くところまで行ってください。エディタ型の詳しい違いは主要5種の比較に、ブラウザ型はAIアプリビルダー比較にまとめました。
2. 作りたいものを日本語で指示する
いきなり大きなものを狙わないでください。
悪い例：「SNSを作って」 良い例：「投稿を1件保存して、一覧に表示するページを作って」
1画面・1機能まで小さくするのがコツです。
とはいえ、初回から良い指示を書くのは無理があります。何を書けば伝わるのか、そもそも分からないからです。当サイトで無料公開している要件定義プロンプトビルダーは、そこを質問形式で埋めるだけの道具です。登録は要りません。作りたいもの、想定する使い手、やらないこと、といった項目に答えると、v0 / Cursor / Claude Code それぞれの書き方に合わせた指示文が出てきます。
3. 出てきた結果を動かして、直す
ここを飛ばす人がとても多いのですが、読んだだけで次に進むと間違いが積み上がります。
- 出てきたものを実際に動かす
- 期待どおりか自分の目で確認する
- 違っていたら「押しても何も起きない」など観測した事実を伝える
実際の所要時間と費用
「数十分で作れる」と書くと大げさに聞こえるので、直近の実測を置いておきます。
このサイトで公開している要件定義プロンプトビルダーは、v0 に3回指示を出して作りました。かかったのは約7分、2.05ドルです。内訳はこうでした。
| 回 | やったこと | 所要 | 消費 |
|---|---|---|---|
| 1 | ゼロから1ページ生成 | 5分06秒 | 1.13ドル |
| 2 | 公開向けに6点まとめて修正 | 1分23秒 | 0.59ドル |
| 3 | 自分で触って見つけた不具合を修正 | 24秒 | 0.33ドル |
早いです。ただ、そのまま人に見せられるかというと微妙でした。3回目で直したのは、入力欄を空のままにすると生成される指示文が「未定」だらけになる、という不具合です。仕様を眺めていても気づきません。自分で空欄のまま操作して、初めて分かりました。
さらにこのあと、自分のサイトに載せるための作業が別途かかっています。AIが7分で出すのは「動くもの」であって、「公開できるもの」ではない。この差を、最初から見込んでおいてください。詳しい記録はv0の無料クレジット2ドルで公開できるツールは作れるかに残しました。
初心者がつまずく3つのポイント
1. 作りたいものが大きすぎる
最頻出です。「業務システムを作りたい」で始めると、ほぼ確実に迷子になります。1画面・1機能まで落としてください。
2. エラーを要約して伝えてしまう
「なんかエラーが出ました」では、AIも答えようがありません。画面に出た文字を全文そのままコピーして貼るのが正解です。行番号もファイル名も、全部が手がかりになります。分からないものほど、加工せずに渡してください。
3. 「動いたから完成」で止めてしまう
AIの出力は、間違っていてもエラーを出さないことがあります。画面は表示されるし、ボタンも押せる。なのに保存されていない、他人のデータが見えている。こういう壊れ方をします。
対策は初心者がやりがちな失敗7つに、指示のコツは7つのコツにまとめました。
プログラミングの勉強は必要なのか
よく聞かれます。結論はこうです。
- 文法の暗記は不要。そこはAIが肩代わりします
- 「読める」ようにはなったほうがいい。AIが書いたものが意図と合っているか判断するため
目指すのは「書ける」より先に「読める」です。詳しくはもうプログラミングは学ばなくていい？で掘り下げています。
よくある質問（FAQ）
Q. vibe coding の読み方と意味は？
A. 読み方は「バイブコーディング」です。vibe は「雰囲気・ノリ」を意味し、vibe coding で「雰囲気を伝えて作る開発スタイル」を指します。日本語記事では「バイブコーディング」、英語では vibe coding と表記されます。
Q. プログラミング未経験でも本当にできますか？ A. 1ページのサイトや計算ツールなら、初日に作れます。ただし他人に使わせる段階になると、セキュリティの判断が必要になります。自分用から始めるのが安全です。
Q. どのツールから始めればいいですか？ A. インストール不要で即座にアプリを作りたいなら v0、画面でコードとプレビューを見ながら本格的に作り込みたいなら Cursor です。最近はターミナル（黒い画面）を使わなくても、ブラウザやエディタのアプリ上だけで実用的なWebアプリが十分に作れます。より高度な自律エージェントや一括開発を求める段階になったら Claude Code などを検討するとスムーズです。詳しくは主要5種の比較をどうぞ。
Q. 無料でできますか？ A. できます。主要ツールには無料枠があり、公式の無料リソースだけでも相当な範囲まで届きます。課金は「無料枠で物足りなくなってから」で十分です。ちなみに v0 の1日分の無料枠（2ドル）で実際に何が作れるかは、3回の指示で使い切った記録に実測を載せました。
Q. どれくらいで作れるようになりますか？ A. 個人差はありますが、3ヶ月で自分用のツールが作れるあたりが現実的な目安です。手順は独学ロードマップに3段階でまとめました。
Q. 仕事になりますか？ A. なります。ただし「AIが使えます」自体は売り物になりません。売れるのは困りごとを形にする力と責任を持って納める力です（→副業はできる？）。
Q. AIが書いたコードは信用していいですか？ A. 鵜呑みにしないでください。一見動いていても、セキュリティの考慮が抜けていることがあります。公開前の確認は自分の責任です。
まとめ
- vibe coding（バイブコーディング）とは、AIに日本語で指示してソフトを作る開発スタイル。
- vibe＝「雰囲気」。仕様を固める前に、動くものを出して直す進め方から来ている。
- What（何を作るか）はあなた、How（どう作るか）はAI。
- 1ページサイトや計算ツールは初日に届く。お金・個人情報・基幹系は任せきりにしない。
- つまずくのは「書けない」ではなく「確かめられない」。だから読めるようになるのが先。
次に読む
- 実際に何が作れるか → 作れるもの10例
- 3ヶ月の学習設計 → 独学ロードマップ
- ツール選び → AIコーディングツール主要5種を比較
- 導入手順 → Claude Codeの始め方
- 学習は必要か → もうプログラミングは学ばなくていい？
- 公開する前に → 公開前チェックリスト（無料ツール）