日本語でAIに指示してアプリやサイトを作る『バイブコーディング』を、プログラミング未経験でこのサイトを作って運営する筆者が解説。始め方の手順、事故らないための約束事、できること・できないことまで実体験から正直に整理しました。
本ページはアフィリエイトプログラムを利用しています。掲載の料金・条件は調査時点の情報で、変動する場合があります。最新は各公式サイトでご確認ください。
バイブコーディングとは、日本語でAIに指示を出し、AIが書いたコードを確認・修正しながらアプリやサイトを作る開発スタイルです。プログラミング未経験でも始められます。実際にあなたが今読んでいるこのサイトが、未経験の私がバイブコーディングで作ったものです。ただし「誰でも簡単」ではなく、小さく作る・自分で確認する・秘密情報と課金を守る、という約束事が要ります。
この記事では、始め方の5ステップと、事故らないための約束事7つ、できること・できないことの正直な線引きを実体験からまとめました。
この記事でわかること
- バイブコーディングの意味と語源。従来のプログラミングと何が違うか
- 非プログラマーの筆者が実際にどこまで作れたか（このサイトが実物）
- 最初の1個を作るまでの5ステップと、ツールの選び方
- バックアップ・秘密情報・課金上限など事故らないための約束事7つ
- できること・できないことの正直な線引きと、よくあるつまずきの対処
実体験メモ
私はプログラミング未経験の会社員です。コードは今も書けません。それでも、AIエージェント（Claude Code）に日本語で指示を出す方法で、このサイト「くらべてナビ」を作り、公開し、記事まわりの小さなツールも作りながら運営しています。順調な話だけではなく、あいまいな指示で的外れなものが出てきたり、AIの事実誤りに気づかず危うく公開しかけたりと、つまずきも一通り経験しました。この記事は、その経験を「これから始める人が同じ穴に落ちないように」という視点で整理したものです。
バイブコーディングとは？日本語の指示でAIにコードを書かせる開発スタイル
バイブコーディング（Vibe Coding）とは、コードを自分で書く代わりに、「こういうものを作りたい」と自然言語でAIに伝え、AIが書いたコードを確認・修正しながら作っていく開発スタイルのことです。指示は日本語で構いません。
言葉の由来ははっきりしています。2025年2月、AI研究者のAndrej Karpathy氏がXへの投稿で、コードの存在を忘れるくらいAIとの対話に身を任せて作る新しいスタイルを「vibe coding」と呼んだのが始まりです。もともとは「雰囲気（vibe）に乗って作る」という半分冗談めいたニュアンスの言葉でしたが、AIにコードを書かせる開発の呼び名として一気に広まりました。
従来のプログラミングとの違いは、人間の仕事の中身です。
| 従来のプログラミング | バイブコーディング | |
|---|---|---|
| コードを書くのは | 人間 | AI |
| 人間の主な仕事 | 文法を覚えて書く | 何を作るかを言葉で伝える |
| 必要な力 | プログラミング言語の知識 | 目的・完成イメージの言語化と、結果の確認 |
| つまずく場所 | 文法エラー・設計 | あいまいな指示・確認不足 |
つまり、「書く力」の代わりに「伝える力」と「確かめる力」が要るのがバイブコーディングです。ここを誤解して「何もしなくても作ってくれる」と思って始めると挫折します。逆に言えば、この2つさえ意識すれば、プログラミングの知識ゼロでも入口に立てます。
実例：このサイトはバイブコーディングで作られている
「未経験でも作れる」という話は、証拠がないとただの宣伝文句です。そこで実例を出します。あなたが今読んでいるこのサイト自体が、プログラミング未経験の私がバイブコーディングで作ったものです。
私がやったことは、一貫して「日本語で伝えて、出てきたものを確認して、直してほしい所をまた日本語で伝える」の繰り返しです。その方法で、ここまで到達できました。
- サイトの構築と公開：デザイン・ページ構成・記事の仕組みまで、指示と修正の往復で形にし、無料の構成でインターネットに公開（手順は 無料でWebサイトを公開する方法 に書きました）
- サイトの継続的な改修：「ここの見た目をこう変えて」「この機能を足して」という日々の修正
- 記事まわりの小さなツールづくり：運営作業を楽にするための道具も、同じやり方で用意
一方で、正直に書くと、私はいまだにコードを読めるようになっていません。出てきたコードの中身を理解しているのではなく、「動くかどうか」「見た目や挙動が意図通りか」を自分の目で確かめることで品質を担保しています。バイブコーディングの実像は、魔法ではなくこの地道な確認の積み重ねです。
私が使っているツールの詳しい体験談は Claude Codeをノンプログラマーが使ってみた にまとめています。
何から始める？最初の1個を作るまでの5ステップ
始め方は次の5ステップです。
- 作るものを決める：小さくて、自分が毎日使うものにする
- ツールを1つ選ぶ：まずはどれか1つ。比較で悩む時間はいらない
- 目的と完成イメージを日本語で伝える：「何のために・どう動けば完成か」を先に言葉にする
- 動かして自分で確認する：AIの「できました」で終わりにしない
- 直してほしい点を言葉で伝える：一度で完成を狙わず、修正の往復で仕上げる
順に、判断に迷いやすいポイントを補足します。
作るものの決め方：小さく、自分が毎日使うもの
最初の1個の選び方が、続くかどうかをほぼ決めます。おすすめの基準は2つです。
- 小さいもの：画面1枚で完結する道具。割り勘計算機、単位換算、持ち物チェックリストなど
- 自分が毎日（または頻繁に）使うもの：使う場面が具体的だと、完成イメージも具体的に言葉にできる
逆に、最初の1個に向かないのは「ログイン機能つきの本格的なアプリ」「人に売るためのサービス」です。大きいものは指示も確認も難しくなり、未経験だと収拾がつかなくなります。私も一度に大きく頼んで迷走した経験があり、小さく分けることが最大の挫折対策だと痛感しました。
作るものが決まったら、指示を出す前に目的・完成イメージ・制約を紙に書き出しておくと手戻りが激減します。この「書かせる前の準備」は AIにコードを書かせる前に決めておくこと に詳しくまとめました。
ツールはどれ？：Claude Codeとブラウザ完結型
バイブコーディングのツールは、大きく2タイプに分かれます。
タイプ1：自分のパソコンで動くAIエージェント型
代表が、Anthropicが提供する Claude Code です。日本語で指示すると、ファイルの作成・編集からコマンドの実行まで進めてくれます。ブラウザ完結型より自由度が高く、このサイトのような「作って終わりでなく、育てていくもの」に向きます。私が使っているのもこれです。利用にはPro/MaxプランまたはAPIの従量課金が必要で、無料枠はありません。最新の料金は公式サイトで確認してください。全体像は Claude Codeとは で解説しています。
タイプ2：ブラウザだけで完結する型
インストール不要で、ブラウザ上の入力欄に作りたいものを書くと、その場でアプリの画面ができていくタイプです。代表的なサービスに次のものがあります。
| サービス | 提供元 | 無料で試せるか |
|---|---|---|
| Lovable | Lovable社 | 無料枠あり（クレジット制などの上限つき） |
| Bolt | StackBlitz | 無料枠あり（上限つき） |
| v0 | Vercel | 無料枠あり（上限つき） |
| Replit | Replit, Inc. | 無料枠あり（上限つき） |
いずれも「無料で始められる」のは事実ですが、無料枠にはクレジット制や日次上限などの条件がつきます。上限の中身は変わるため、最新は各公式サイトで確認してください。なお、私が実体験として語れるのはClaude Codeで、この4つは比較情報としての紹介です。
選び方の目安はシンプルで、「まず雰囲気を体験したい」ならブラウザ完結型の無料枠、「自分のサイトやツールを本格的に作って育てたい」ならClaude Codeです。
指示→確認→修正のループの回し方
どのツールを選んでも、作業の本体は同じループです。
- 指示：「何のために・誰が使い・どう動けば完成か」を日本語で伝える
- 確認：出てきたものを実際に動かし、意図とのズレを探す
- 修正：ズレを「ここをこう直して」と具体的に伝える
コツは、確認を「コードを読む作業」だと思わないことです。読めなくても、使う人として触ればズレは見つかります。ボタンを押す、変な値を入れる、スマホ幅で見る。それで見つけたズレを言葉で返せば、AIが直してくれます。
もうひとつ大事なのは、AIの出力は間違う前提で確認する姿勢です。AIは自信ありげに間違えます。私も事実誤りに気づかず危うく公開しかけたことがあり、それ以来「確認してから世に出す」を徹底しています。この姿勢の作り方は AIの回答は間違う前提で使う をどうぞ。
事故らないための約束事7
バイブコーディングは楽しい反面、「分からないまま進められてしまう」からこその事故があります。始める前に、次の7つを自分に約束してください。
- 元に戻れる状態を作ってから触る：うまくいっている状態のバックアップ（ファイル一式のコピーでも可）を取ってから変更する。「戻れる」と分かっていれば、失敗が怖くなくなる
- 秘密情報を指示文に貼らない：パスワード・APIキー・個人情報をAIへの指示文やコードに直接書かない。公開するファイルに書かせない
- AIの「できました」を信じない：完了報告ではなく、自分で動かした結果だけを信じる
- 課金の上限を決めてから使う：従量課金のツールは、使いすぎ防止の上限や通知を先に設定する。定額プランでも利用上限の仕組みを把握しておく
- 一度に大きく頼まない：小さく分けて、1つ確認してから次へ。大きく頼むほど、どこが壊れたか分からなくなる
- 分からない操作は実行前に説明させる：「このコマンドは何をするの？」とその場でAIに聞く。特に削除・上書き系は要注意
- 大事なデータの場所で練習しない：本番のファイルや仕事のデータがある場所ではなく、練習用の場所で試す
7つのうち、取り返しがつきにくいのは2（秘密情報）と4（課金）です。作り直せば済む失敗と違い、漏れたキーや膨らんだ請求は後から消せません。この2つだけは、慣れてきても省略しないでください。
できること・できないことの正直な線引き
私の実体験の範囲で、正直に線を引きます。
できたこと
- プログラミング未経験のまま、Webサイトを作って公開し、運営し続ける
- 「ここをこう変えたい」という日々の改修を、日本語の指示だけで回す
- 自分の作業を楽にする小さなツールを必要に応じて作る
- 分からない専門用語をその場でAIに聞きながら前に進む
できなかったこと・今もできないこと
- コードを読んで中身を理解すること：今もできません。動作確認で代替しています
- あいまいな指示で意図通りのものを出させること：「いい感じにして」では、思った結果になりませんでした
- 一度の指示で完成させること：必ず修正の往復が要ります。一発完成を期待すると失望します
- 確認を省くこと：AIの間違いは今もなくなりません。確認の手間は「なくなる」のではなく「慣れて速くなる」だけでした
まとめると、バイブコーディングは「作れるかどうか」の壁は大きく下げてくれますが、「確かめる責任」は下げてくれません。ここを引き受けられるなら、未経験でも十分に実用になります。
よくあるつまずきと対処
始めたばかりの頃に私がハマった順に挙げます。
- 何を頼めばいいか分からない → 最初の1個を「小さくて毎日使うもの」に固定する。頼む内容が決まれば指示は書ける
- 指示があいまいで的外れなものが出る → 目的・対象・制約を先に渡す。準備の型は AIにコードを書かせる前に決めておくこと へ
- 専門用語で手が止まる → その場で「これはどういう意味？」とAIに聞く。調べるためにブラウザを開く必要すらありません
- エラーが出て固まる → エラーの文面をそのままAIに貼って「原因と直し方を教えて」と聞く。意味が分からなくても大丈夫です
- 一度に頼みすぎて収拾がつかない → バックアップまで戻り、小さく分けてやり直す
つまずきの共通対処は「前提を具体的に・その場で聞く・小さく試す」の3つです。
この記事の前提と注意
本記事の体験談は、プログラミング未経験の筆者が主にClaude Codeを使って当サイトを構築・運営した個人の経験にもとづくもので、成果を保証するものではありません。Lovable・Bolt・v0・Replitは比較情報としての紹介であり、筆者の利用体験にもとづく評価ではありません。各サービスの機能・無料枠・料金は変更されることがあるため、最新の条件は必ず各公式サイトでご確認ください。また、AIが生成するコード・文章には誤りが含まれることがあります。公開前の動作確認と、秘密情報・課金の管理はご自身の責任で行ってください。
まとめ：伝えて、確かめる。それがバイブコーディング
- バイブコーディングは日本語の指示でAIにコードを書かせ、確認・修正しながら作る開発スタイル。2025年2月にKarpathy氏の投稿から広まった
- 必要なのは書く力ではなく、伝える力と確かめる力。未経験の私がこのサイトを作れたのが実例
- 始め方は5ステップ。小さくて毎日使うものを、指示→確認→修正のループで作る
- 事故防止の要はバックアップ・秘密情報・動作確認・課金上限。特に秘密情報と課金は取り返しがつきにくい
- できないことも正直に。一発完成はなく、確認の責任はなくならない。それでも「作れる側」に回れる価値は大きい
概念が分かったら、次は手を動かす番です。実際にツールを1つ作るところまでは、コピペで使える指示文つきの Claude Codeの使い方（30分で初ツールを作る） で体験できます。今日の30分が、最初の1個になります。
関連記事：Claude Codeとは／Claude Codeをノンプログラマーが使ってみた／AIにコードを書かせる前に決めておくこと／無料でWebサイトを公開する方法／AIの回答は間違う前提で使う。AI活用の記事一覧は AIノウハウ からどうぞ。
よくある質問（FAQ）
バイブコーディングとは何ですか？
コードを自分で書く代わりに、「こういうものを作りたい」と自然言語（日本語でOK）でAIに伝え、AIが書いたコードを確認・修正しながら作っていく開発スタイルです。2025年2月にAI研究者のAndrej Karpathy氏がXへの投稿で使った言葉が広まりました。コードの細部を読み込むことよりも、対話しながら動くものを作ることに重心があります。
プログラミング未経験でもバイブコーディングはできますか？
できます。実際に筆者はプログラミング未経験のまま、日本語の指示だけでこのサイトを作って運営しています。ただし「誰でも簡単に」とは言えません。指示があいまいだと思った結果にならず、AIの間違いに気づく確認の手間も必要です。小さく作って動かして確認する、を繰り返す姿勢があれば未経験でも到達できます。
バイブコーディングは何から始めればいいですか？
①小さくて自分が毎日使うものを作ると決める、②ツールを1つ選ぶ、③目的と完成イメージを日本語で伝える、④動かして自分で確認する、⑤直してほしい点を言葉で伝える、の5ステップです。最初の1個は「割り勘計算機」のような、画面1枚で完結する小さなものがおすすめです。
バイブコーディングは無料でできますか？
Lovable・Bolt・v0・Replitなどのブラウザ完結型には無料枠がありますが、いずれもクレジット制や日次上限などの条件付きです。Claude CodeはPro/MaxプランまたはAPI従量課金での利用となり無料枠はありません。料金体系は変わることがあるため、最新は各公式サイトで確認してください。
バイブコーディングで事故らないために最低限守ることは？
①元に戻れる状態（バックアップ）を作ってから触る、②パスワードやAPIキーなどの秘密情報を指示文や公開ファイルに書かない、③AIの「できました」を信じず自分で動かして確認する、④従量課金なら上限を設定してから使う、の4つがまず重要です。特に秘密情報と課金は、後から取り返しがつきにくい事故につながります。