メインコンテンツへスキップ
そもそもVibe Codingってなに?
レッスン 1 / 15|31分で読めます

そもそもVibe Codingってなに?

Vibe Codingの全体像と、原理を知らなくてもアプリは作れるという話。学習の地図つき。

コードを書けない私が、半年で20本以上アプリを作りました。

きっかけは、2024年のある日でした。

Claudeを触っていたら、画面の中で動く小さなアプリが、勝手にできてしまったんです。 コードは書いていない。 ただ会話していただけ。

Claude.aiの画面イラスト。左に日本語の指示プロンプトと生成されたコード、右のArtifactパネルに解熱薬計算ミニアプリが表示されている
Claude.ai の Artifact 機能で、会話の隣にアプリが現れる瞬間。ここからすべてが始まりました。

俺もアプリ作れるんじゃね。 そう思った、まさにその瞬間でした。

ただ、すぐ次の疑問が出てきました。

これ、どこで修正するんだろう。 どうやってAppストアに乗せるんだろう。 そもそも、誰かに使ってもらうには何が必要なんだろう。

ぱっと思いつくだけで3つは出てくる。 そして、ここからが、わりと大変な道のりでした。

正直に言うと、ゼロ知識のままアプリが世に出る、というほど甘くはありません。 ある程度の勉強は、いまでも要ります。

ただ、その勉強の量と難しさが、昔とは比べものにならないくらい下がっています。 半年でかかったのは、まとまった休日の数日と、外来の合間の細切れの時間。 コードを一行ずつ書いた記憶は、ほとんどありません。 やったのは、AIに「こういうのが欲しい」と話しかけて、返ってきたものを動かす。 動かなければ「直して」と頼む。 それだけです。

この作業全体のことを、Vibe Coding(バイブコーディング)と呼びます。

第1回は、これがそもそも何なのか。 途中で専門用語が出てきたら、その都度、生活に近い例えでほぐしていきます。

まず、自分の話を少し

私は、小児科医をしています。 AMPLという、医療×AIの小さな会社をやっています。

「専門の人ですよね」と必ず返されますが、コードを一行ずつ書くことは、ほぼありません。 書いているのは、AIへの指示文だけです。

ここで「コード」というのは、コンピュータへの指示書のこと。 料理でいうレシピを、コンピュータ向けに書いたものだと思ってください。 それを、いまはAIが代わりに書いてくれます。

minatonという、東京都港区の子育て情報サイトを動かしています。 機能の8割くらいは、AIに「こういうのが欲しい」と話しかけて作ってもらった結果です。

minaton(港区子育て情報サイト)のスマホ画面イラスト。中央にスマホ、周囲に「信頼できる子育て情報」「港区の医療機関情報」「予防接種スケジュール管理」など機能の吹き出し
minaton(港区の子育て情報サイト)。机上の話ではなく、実際に動いているプロダクトです。

特殊スキルではなく、今日から始められる作業です。 そう言いきれるまで、自分で試しました。

「みんな」って、誰のこと?

この連載で「みんな」と呼んでいるのは、医療現場で働くすべての方です。

  • 医師(診療科を問わず)
  • 看護師、保健師、助産師
  • 薬剤師
  • 理学療法士、作業療法士、言語聴覚士
  • 歯科医師、歯科衛生士
  • 臨床検査技師、診療放射線技師、臨床工学技士
  • 管理栄養士、ケアマネージャー
  • 医療事務、医療秘書

職種は問いません。 プログラミング経験も、ゼロでOKです。

ちなみにプログラミングというのは、コンピュータに「こう動いてね」と命令する作業のこと。 そのために使う専用の言葉が、プログラミング言語。 PythonやJavaScript、HTMLという名前を聞いたことがある人もいるかもしれません。 今日は名前があるな、というところまでで十分です。

Vibe Codingって、何?

提唱したのは、Andrej Karpathy(アンドレイ・カルパシー)さん。 ChatGPTを作っているOpenAI(オープンエーアイ)という会社の、初期メンバーのひとりです。 電気自動車のテスラでも、AI部門のトップを務めていた人。 AI業界のスター選手みたいな存在です。

2025年の頭、彼はSNS(XやInstagramのような投稿サービス)にこう書きました。 「最近の自分のコーディングは、Vibe Codingだ」と。

Andrej Karpathy が2025年2月にXに投稿したVibe Coding提唱ポストの再現画像。本文「There is a new kind of coding I call vibe coding」
2025年初頭、KarpathyがXに投げた一言。これが世界中に広まりました。

直訳すると「雰囲気で書くコーディング」。 かなりラフな言い回しです。

意味はシンプル。 普段使っている日本語や英語(これをまとめて「自然言語」と呼びます)でAIに指示を出して、返ってきたものをそのまま動かす。 これだけです。

中身のコードを、一行ずつ読まなくていい。 動けばOKという割り切りで進めます。

国内でもこの言葉は一気に広がっていて、無料で学べる講座もすでに公開されています(記事末尾にリンクを置いておきます)。

原理を知らなくても、サービスは作れる

少し例え話をさせてください。

私たちは毎日スマホを使っています。 でも、こう聞かれて答えられる人は、ほとんどいません。

  • なぜ画面を指でなぞると反応するのか
  • なぜ小さな穴から大きな音が出るのか
  • なぜ今いる場所でWi-Fiがつながるのか
  • なぜカメラのアプリが、あんなにサクサク動くのか

タッチパネルの原理、スピーカーの構造、無線通信の仕組み、画像処理のアルゴリズム。 本気で説明しようとしたら、本が何冊も書けます。

でも、ほぼ誰もこれらを知らないまま、スマホでLINEを使い、地図で店を探し、写真を撮ります。

そして、スマホで動くサービスを作って成功している企業は、たくさんあります。 タッチパネルを設計した人と、LINEを作った人は、別人です。 スピーカーを発明した人と、Spotifyを作った人も、別人です。

スマホを使う側(左)とスマホを作った側(右)の対比イラスト。左は普通の人がメッセージアプリを使っている様子、右はエンジニアが複数モニタの前で設計している様子
原理を作る人と、原理の上で価値を作る人は、別の役割です。

Vibe Codingも、これと同じ立ち位置です。

コンピュータがどう動いているか、コードが裏でどう実行されているか。 これらを知らないままで、誰かに使ってもらえるアプリを作れる。 それが、いま起きていることです。

「原理を知ってからじゃないと始めちゃいけない」は、思い込みです。 使いながら、必要になったときに覚えていけば、それで間に合います。 私自身、半年たった今でも、知らないまま動かしている部分がたくさんあります。

だからまず、今日、動かしましょう。 原理は、後ろからついてきます。

これまでと、何が変わるのか

これまでの「アプリを作る」は、こんな流れでした。

  • プログラミング言語を学ぶ(数ヶ月)
  • 書き方を覚える(数週間)
  • 書いてみる(時間がかかる)
  • 動かない、で挫折

私もここで、過去2回挫折しました。

Vibe Codingは、流れがこう変わります。

  • 「こういうのが欲しい」と日本語で書く(1分)
  • AIがコードを書いて動かす(数十秒)
  • 違和感があれば「ここを直して」と話す(30秒)
  • 想定通りになるまで、会話を繰り返す
左に従来のプログラミング学習(教科書山積み・コード画面・数ヶ月の長い道のり)、右にVibe Coding(吹き出しで日本語指示・完成アプリ・1分の短い道のり)の左右対比図
左:教科書を山積みにして数ヶ月。右:日本語で1分話して動くものが手元に。同じゴールに辿り着くまでの距離が、根本から変わりました。

書く工程が、話す工程に変わる。 ここに、地味だけど大きな転換があります。

試しに、3分でやってみる

今この瞬間、私がClaude Codeに送っている指示は、これだけです。

ここで出てくるClaude Code(クロード・コード)は、ChatGPTのライバルにあたるClaudeというAIが、自分のパソコンの中で実際にファイルを作ったり修正したりしてくれる、ちょっと進んだ道具のこと。 詳しくは第4回で扱うので、いまは「そういう便利なものがある」くらいで構いません。

子どもの体重を入力すると、解熱薬(アセトアミノフェン)の1回量を計算してくれるツールを作ってください。 体重(kg)を入れたら、おおよその目安量がmgで表示される、シンプルなWebページにしてください。 一枚のHTMLファイルにして、ブラウザで開けるようにしてください。

Claude Codeのターミナルウィンドウのイラスト。CLAUDEロゴと、解熱薬計算ツール作成の指示プロンプトが入力されている様子
ターミナルにこのまま日本語で打ち込みます。プログラミング言語ではなく、ふだんの言葉で十分です。

短い指示にも、IT寄りの言葉が混じっています。 初出のものだけ、私のイメージを添えてほぐしておきます。

  • Webページ:ChromeやSafariで見られる画面のこと。お店のサイトもニュース記事も、見ているものは全部Webページです。私のイメージは、紙のページ1枚分です。
  • HTML:Webページの設計図にあたるファイルの種類。文字や画像をどこに置くか、ボタンをどう並べるかが書かれています。私のイメージは、家を建てる前の間取り図です。
  • HTMLファイル:拡張子が「.html」で終わるファイル。ダブルクリックすると、勝手にブラウザが立ち上がって表示されます。間取り図を、ぺら一枚にした書類、というイメージです。
  • ブラウザ:Webページを見るための入れ物アプリ。Chrome、Safari、Edge、Firefoxなど。Webの世界を、こちらからのぞく窓、というイメージです。

数十秒で、index.htmlというファイルが手元にできます。 index.htmlは、Webページにとっての「玄関」にあたる、最初に開かれるファイルとしてよく使われる名前です。

macOS Finder のvibe-testフォルダに index.htmlファイルが新規生成された画面イラスト。ファイルアイコンの周囲にティールのスパークル、矢印で「いま、生まれた」の注釈
数十秒で、index.html がフォルダの中に生まれます。「自分の手で書いていない」のに、自分のフォルダに在る不思議な感覚。

ダブルクリックで開くと、入力欄と結果がブラウザに出ます。

ブラウザに表示された解熱薬の用量計算ツール画面イラスト。体重12kgを入力した結果として「目安量: 120 mg 〜 180 mg」が表示されている完成画面
ダブルクリックすれば、ブラウザがそのまま「アプリ」になります。サーバーもインストールも、要りません。

これを家のパソコンに置いておけば、ちょっとした計算ツールになります。

完璧ではありません。 年齢別の補正、薬の種類、剤形(シロップか坐薬か)など、追加で詰めることはたくさんあります。

でも、「一行もコードを書かずに、動くものが手元にある」という事実が、まずは大事です。

これが、いま誰でもできる体験になっています。

始める前に、4つだけ伝えさせてください

始める前に押さえる4つの注意点を2x2グリッドで示したインフォグラフィック。①一発で完璧には動かない ②いい感じでは伝わらない ③AIは堂々と間違える ④個人情報は渡さない
この4つだけ最初に揃えておけば、9割の事故は防げます。

ここから一緒に手を動かしていく前に、知っておいてほしいことがあります。

1. 一発で完璧には動かない

AIが書くコードは、最初から完璧じゃありません。 動かしてみて、おかしいところを直す。 これを繰り返します。

「うまくいかない」は、失敗ではなく、過程です。

2. 「いい感じに」では伝わらない

AIへの指示は、何を、どう、どこまで、を具体的に書きます。 「いい感じに作って」では、返ってくるものがブレます。

具体的な指示が、そのまま成果物の質になります。 ここは、書きながら少しずつ慣れる部分です。

3. AIは堂々と間違える

知らないことも、自信満々に書きます。 特に、命やお金や法律に関わる分野は要注意です。

書かれたものを鵜呑みにせず、必ず一次情報で確認します。 医療なら、添付文書やガイドライン。 法律やお金なら、専門家。 ニュースなら、元の報道。

「自分で確認する癖」だけで、9割の事故は防げます。

4. 個人情報は、AIに渡さない

AIサービス(ChatGPTやClaudeのこと)は、入力された情報を品質改善に使う場合があります。

氏名、住所、電話番号、生年月日、ID、写真。 これらは原則、AIに渡しません。

ダミーのデータ(架空の名前や数字)で試すか、構造だけを共有する。 最初に身につけると、あとが楽です。

AIに渡す情報のNG(左)とOK(右)の二段組チェックリスト。NGは氏名・住所・APIキーなど、OKはダミー名・公開ガイドラインの内容など
迷ったら、このチェックリストに照らして判断します。日常で口癖にしておくと、自然にできるようになります。

今日のまとめ

3行で振り返ります。

  • Vibe Codingは、日本語で話せばアプリが作れる新しい開発スタイル
  • 学習に何ヶ月もかけずに、今日からアプリが手元に持てる時代になった
  • ただし、間違いと個人情報は、最後まで人間の責任

これから一緒に歩く道

連載は全15回。 最終的に、自分で作ったアプリを家族や同僚にURLで送れるところまで、一緒に行きます。 最初に、これからどこを歩くのか地図だけ渡しておきます。

全15回の道のり地図。左の麓から右の山頂まで、6段(全体像→最初の1本→道具→育てる→世に出す→振り返る)の旗マーカー付き登山道
6段の登山道です。途中で見失ったら、いつでもこの地図に戻ってきてください。

第1段 全体像をつかむ(01〜04)

  • 01 そもそもVibe Codingってなに?(いまここ)
  • 02 「俺もアプリ作れるんじゃね」を体験する
  • 03 知っておきたい7つの言葉(前半:LLM〜IDE)
  • 04 知っておきたい7つの言葉(後半:Git〜デプロイ)

第2段 最初の1本を作る(05〜07)

  • 05 ChatGPTで最初の1本
  • 06 直しを話しかけるコツ
  • 07 コラム 詰まったときの抜け方

第3段 道具を増やす(08〜10)

  • 08 Claude Codeを準備する
  • 09 ターミナルって怖くない
  • 10 Claude Codeで実際に作る

第4段 育てる(11〜12)

  • 11 アプリを育てる① 機能を足す
  • 12 アプリを育てる② ファイルを分ける

第5段 世に出す(13〜14)

  • 13 GitHubに上げる
  • 14 Vercelで世界に出す

第6段 振り返る(15)

  • 15 大事だった3つ、これから

次回予告

第2回は、私が「俺もアプリ作れるんじゃね」と思った瞬間と同じ感覚を、あなたにもブラウザだけで体験してもらいます。 所要時間8分、インストールも登録の山もなしです。


学ぶ時間がない、お金がない、頼める人がいない。 これまでアプリ作りを止めていた3つの理由が、2025年から1つずつ崩れています。

連載の更新は、メルマガ「おかもんだより」でお知らせします。 よかったら、登録してお待ちください。


演習:30分の宿題

ここまで読んでくれて、ありがとうございます。 今日のうちに、自分の手でも一度だけ、Vibe Codingに触れてもらいたい。 所要時間は30分。必要なものは、ChatGPTかClaudeのアカウントだけです。

自分の現場で、繰り返し説明している「あれ」を1つ選ぶ

職種ごとに、3つだけ題材を置いておきます。 全部やる必要はありません。自分の現場に近いものを1つ選んで、ChatGPTかClaudeに頼んでみてください。

題材A(医師向け)

自分の外来で、保護者・患者にいつも同じ説明をしている内容を1つ選び、A4一枚分のHTMLにまとめてもらってください。

例:解熱薬の使い方、抗生剤を使わない理由、便秘の対処、アトピーの保湿、予防接種の副反応。

題材B(看護師・薬剤師向け)

病棟・薬局で、新人スタッフに繰り返し説明している手順を、シンプルなチェックリストアプリにしてもらってください。

例:申し送りテンプレ、与薬前の6Rチェック、麻薬管理の流れ、相互作用の早見表。

題材C(PT/OT・ST・検査・栄養・事務向け)

自分の業務で、毎週・毎月のように繰り返している計算や記録作業を、入力フォーム化してもらってください。

例:歩行訓練の記録シート、嚥下機能評価の入力フォーム、検査値の経時変化チャート、栄養必要量の計算ツール、よくある問い合わせの定型回答テンプレ。

詰まったら、こう書く

うまく動かなかったら、次の3行だけAIに伝えます。

事実:{何が起きているか}
想定:{本当はどうなってほしかったか}
直してほしい点:{どこをどう直してほしいか}

第6回で詳しく扱う「3行ルール」の予告編です。


医療職別 実例ギャラリー

私や、私の周りの医療者が実際に作って、現場で使っているツールを3つだけ紹介します。

例1:小児科医・解熱薬の用量計算ツール(自分用)

私が初めて作ったアプリです。 体重を入れると、アセトアミノフェンの目安量と最大量が出る、シンプルなHTML一枚。

外来で「体重12kgのお子さんに何mg?」を電卓で叩く時間が、ゼロになりました。

実装プロンプト(ChatGPTにそのまま貼って動きます):

子どもの体重(kg)を入れると、アセトアミノフェンの1回量を計算する
シンプルなHTMLページを作ってください。

計算式:体重 × 10〜15 mg/kg
最大量:500mg/回
表示:目安量を「◯mg〜◯mg」の形で表示し、その下に
「実際の使用は医師の指示に従ってください」と注意書き。

一枚のHTMLファイルにして、ブラウザで開けるようにしてください。

所要時間20分・難易度★☆☆。

例2:看護師・申し送りテンプレ生成ツール(同僚作)

患者の症状3つを入力すると、申し送り用の定型文が組み立てられるWebアプリ。 夜勤明けのカンファ前に、5分の作業が30秒になったそうです。

特に新人看護師の「何をどの順番で言えばいいか分からない」を解消する効果があったとのこと。

例3:医療事務・問い合わせ定型回答ツール(同僚作)

「予約変更したい」「診療時間は?」「駐車場ある?」など、よくある電話問い合わせの定型回答を、ボタンひとつでコピーできるアプリ。 新人スタッフの研修期間が、ぐっと短くなったそうです。

3例とも、HTMLファイル1枚で完結しています。 データベースもサーバーも、要りません。


もっと深く:Vibe Coding 提唱の文脈

Vibe Codingという言葉は、急に空から降ってきたわけではありません。

歴史を辿ると、開発スタイルは大きく3段階で進化してきました。

第1段階:手で書く時代(〜2021)

エンジニアが、自分の頭の中でロジックを組み、キーボードでコードを打ち込む。 プログラミング言語の文法を覚え、フレームワークを学び、エラーをひとつずつ潰す。 これが「コーディング」と呼ばれてきた、長い時代の姿です。

第2段階:補完する時代(2021〜2024)

GitHub Copilotが2021年に登場しました。 コードの「次の1行」をAIが提案する。エンジニアが書く労力は減りましたが、主役はまだエンジニアでした。 AIは、隣で「こう書きませんか?」と耳打ちする副操縦士。

第3段階:話す時代(2025〜)

そしてAndrej Karpathyが2025年初頭に「最近の自分のコーディングは、Vibe Codingだ」とXに投稿します。 意味は、「コードを書く」のではなく「やりたいことを話して、出てきたものを動かす」。 副操縦士から、操縦士へ。AIの役割が反転した瞬間でした。

ここで重要なのは、この変化の主役が「専業エンジニア」ではないということ。 コードを書けない医療職・教師・行政職員・主婦が、自分のために小さな道具を作れるようになる。 これが、Karpathyの提唱が世界中に刺さった理由です。

私たち医療職は、第3段階から入る世代です。 過去の手書きの労力を負わずに、いきなり「話して作る」から始めていい。 これは、不公平でも横着でもなく、時代に正しく乗っているだけです。


動画で見る

文字より動きで見たい人へ:


参考・出典

  • Karpathy, A. (2025). 「Vibe Coding」提唱投稿(X)
  • paiza株式会社「バイブコーディング入門 Claude Code編」 https://paiza.jp/works/vibe-coding-claude-code/trial
  • 安野貴博「バイブコーディング超入門講座」シリーズ(YouTubeチャンネル「安野貴博の自由研究」)