当サイトはアフィリエイト広告（PR）を利用しています。

バイブコーディングとは？プログラミング初心者がAIでサイトを作ってわかったこと

正直に言うと、このサイトの中の人はプログラミングが「少しわかる」程度です。GitもGitHubも、Cloudflareも、最初は何のことだかさっぱりでした。

それでも、このIT職タイプ診断サイトは公開できています。キャラクターの描き直しも、ミニRPGの追加も、AIと会話しながら進めました。これがまさに、いま話題の「バイブコーディング」です。

この記事では、バイブコーディングとは何か、どう始めればいいか、そして使ってみて感じた注意点をまとめます。

バイブコーディングとは

バイブコーディング（Vibe Coding）は、作りたいものを普通の言葉でAIに伝えて、コードはAIに書いてもらう作り方のことです。

言葉自体は、AI研究者のアンドレイ・カーパシー氏が2025年に使い始めたもので、同年にはイギリスのコリンズ英語辞典の「今年の言葉」にも選ばれました。「コードの細かいところは気にせず、ノリ（vibe）で作る」というニュアンスがあります。

従来のプログラミング バイブコーディング
自分でコードを1行ずつ書く 「こういうものを作って」とAIに頼む
文法を覚えてから作り始める 作りながら必要なことを知る
エラーは自分で調べて直す エラー文をAIに見せて一緒に直す

どんなツールで始めるの？

代表的なのは次のようなツールです。どれもサービス内容はよく変わるので、使う前に公式サイトで最新の情報を確認してください。

いちばん手軽なのはチャット型です。「家計簿の計算ツールをHTMLで作って」と頼むだけで、動くものが出てきます。

始め方：最初の1つを作るまで

  1. 作るものを1つに絞る：「家族の予定表」「ゲームのダメージ計算機」くらいの小さいものがおすすめです
  2. 完成のイメージを言葉にする：誰が使うか、何ができればいいかを3行くらいで書く
  3. AIに頼む：書いた3行をそのまま渡します
  4. 動かして、気になる点を伝える：「ボタンをもっと大きく」「スマホで見ると崩れる」など、感じたことをそのまま返す
  5. 公開してみる：人に見せられる形にすると、一気に「作った」実感がわきます

コツは、一度に全部を頼まないこと。このサイトも、「キャラが地味だから魅力的にして」「トップの絵も変えて」と、少しずつ頼んで形にしていきました。

バイブコーディングの進め方。1 作るものを1つに絞る、2 完成を3行の言葉にする、3 AIに頼む、4 動かして気になる点を伝える（3と4を少しずつくり返す）、5 公開する。注意点は、中身を知らずに公開、セキュリティの穴、直せなくなる、AIが自信満々に間違えるの4つで、動かして確かめるのが安全策
始め方の5ステップと、知っておきたい注意点

やってみてわかったメリット

知っておきたい危険性・デメリット

便利な一方で、注意しておきたいこともあります。

中の人も、AIに作ってもらった部分を「本当に表示されているか」は毎回スマホで確認しています。任せきりにしないことが、いちばんの安全策です。

バイブコーディングでエンジニアになれる？

「AIが書いてくれるなら、プログラミングを学ぶ意味はない？」と思うかもしれません。

実際は逆で、AIに上手に頼むためにこそ、基礎の知識が役に立ちます。HTMLとCSSが何をしているかを知っていれば、「この部分の余白を広げて」と的確に頼めますし、AIの間違いにも気づけます。

バイブコーディングで「作る楽しさ」を知り、そこから基礎を学ぶ。未経験の人には、この順番がいちばん続けやすいと感じています。

まとめ

「作るのが好きかも」と思った人は、Webエンジニアタイプかもしれません。IT職タイプ診断で、自分に向いている職種を見てみてください。学ぶ順番はWebエンジニアになるには？の記事でまとめています。

※2026年10月時点の情報です。ツールの機能や料金は変わることがあるため、利用前に各公式サイトをご確認ください。

参考：Collins Dictionary「今年の言葉」に関する報道（News on AIR）

→ 自分に合う職種を「IT職タイプ診断」で調べる