0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

はじめに

今回はVibe Cordingというプログラミングの方法について、私なりの結論をお伝えしたいと思います。

そもそもVibe Cordingとは

Vibe Cordingとは自然言語(日本語とか英語とか)でAIに指示をだして、作りたいアプリを開発するというプログラミングの手法です。たまにプログラミングじゃない、と否定する人がいますが、それは一旦おいておきましょう。

この記事でわかること

  • Vibe Cordingの具体的な方法
  • Vibe Cordingで利用するべきAI
  • AIとの付き合い方

この記事でわからないこと

  • AIの仕組み
  • AIの作り方
  • どのAIの性能がいいのか
    ※ 今回の趣旨は性能のいいAIに課金してプログラミングをするということではありません。あくまで、無課金でもできるVibe Cordingについて私なりの結論をお伝えするというものです。

この記事の対象者

  • プログラミング言語がわからないけど、アプリとかウェブとか作りたい人
  • プログラミングはある程度できるけど、アプリとかウェブとか作りたい人
  • 人力のプログラミングにつかれた人

注意事項

AIの回答はランダムです。この記事はプログラミングによる成功を保証するものではございません。
また、今回の記事は私の主観です。異論は認めます。予めご了承ください。AIの使用については記事執筆時(2026年5月1日)のものです。

Vibe Cordingで利用するAI

Vbe Cordingで利用するAIは私の中で結論が出ています。ズバリ!Google AI Studioです!さて、反応がいくらかわかれたかと思います。Google AI Studioを使うならGeminiでいいだろという人。Google AI Studioよりも〇〇の方が性能がいいだろという人。そのそもGoogle AI Studioを知らない人。AIに詳しくない人。いろいろいると思います。

どうしてGoogle AI Studioなのか

Google AI Studioを私がVibe Cordingに選ぶのにはいくつか理由があります。そこでメリットデメリットを挙げていこうと思います。

メリット.txt
過去の送信内容を編集できる
AIのメッセージ、自分のメッセージを適宜削除できる
いつ送信したのか、返信されたのかわかる
使っていいツールなどを具体的に設定できる
引き継ぎが簡単(私の中で諸説あり)
ファイル添付数無制限
デメリット.txt
さほど性能がよいわけではない
回答に時間がかかる
たまにどっちの回答が好みか聞かれる(めんどい)
ウェブサイトの言語が英語(私英弱なんで)
トークン制限がある
ファイルアップロードに対応していない、プログラミング業界の拡張子が多い(tsxとかiniとかダメなんよ)

と、こんなもんですかね。Google AI Studioを選んだ最も大きな理由が「過去の送信内容を編集できる」と「AIのメッセージ、自分のメッセージを適宜削除できる」になります。

Vibe Cordinのコツ

ここからはいよいよGoogle AI Studioを利用したVibe Cordingのコツについて説明していきます。

プロジェクトを始める

まずは、何を作りたいのかできる限り具体的に説明します。例えば、ゲームやツールなど。何が作りたいのかによって開発に使用するツールやプログラミング言語が変わってきます。この段階である程度、Vibe Cordingをする側がプロジェクトとそのアルゴリズムを理解しておく必要があります。わからないことがあれば、わからないことを明確に説明して、質問してみましょう。(わからないことを明文化して説明しないとAIは理解できないんです...)
この段階で、具体的にライブラリの名前とかを決める必要はありません。どのプログラミング言語でどんな感じのアプリで、どのツールを使って開発するのかくらいがわかっていれば問題ありません。

開発環境を整える

初めてVibe Cordingをする場合、開発環境を整えるところから始まります。前にプログラミングをしたことがあれば、そのまま流用できることもあります。開発環境の整え方、アプリのインストール方法はすべてGoogle AI Studioで質問していきます。インストール画面の言葉を読めない場合は、写真を送信したり、自分でタイピングしたりしてAIの指示を仰ぎます。インストール手順を説明してくれている場合はその通りに進めばおおよそうまくいきますが、もしかしたらAIの指示にない画面が表示されたり、指示にあるボタンがなかったりというトラブルが発生することがあるかもしれません。その場合はどんどんAIに聞いていきます。

AIのチャットは基本的には訳ない方がいいですが、開発環境を整えるうえで、アプリのインストール方法がわからないなど、開発から少し脱線しそうで会話履歴が引き継がれなくても相手が答えられそうな場合はチャットを分けた方がいいです。Google AI Studioのトークンはチャットごとにカウントされるので、開発用チャットのトークンは節約した方が後々楽になります。

コーディングの指示

環境が構築できたらコーディングを指示します。ここが肝です。ミスすると、過去に作成した部分がすべて吹っ飛ぶ可能性があります。
まず、開発環境ができてから最初に送るプロンプトの形式はおおよそテンプレがあります。

プロンプト.txt
さて、実際に〇〇を開発していきたいと思います。まずは、〇〇の部分を作成したいと思います。どのファイルに何を書いたらいいのか教えてください。
ここで、今後のソースコードの提示しについて非常に重要な約束があります。ソースコードを提示する際は必ず、ペーストするだけで動作する完全なソースコードとそのファイル名(プロジェクトディレクトリからの相対パス)を必ず提示するようにお願いします。

2文目でどの部分を作成するのか明記します。Vibe Cordingではこのように、開発を段階的に分割することが重要となります。
そして2段落目の内容が非常に重要です。まるまるコピペしても構いません。「ペーストするだけで動作する完全なソースコード」というのがキーワードです。私たちVibe Corder(?)はプログラミング言語がわからないという体で進めています。そのため、ソースコードは修正できません。故に、AIが省略したりしたらその時点でアプリやウェブサイトは壊れてしまうのです。完全なソースコードとは「省略のないソースコード」とほぼ同意です。
これが私の、ソースコードを省略させない呪文です。

AIがコードを省略した

この呪文を唱えても、AIは忘れて、ソースコードを省略したりしだします。省略をしたら、チャットは継続しません。まず初めに、ソースコードを1段階元に戻し、省略のない状態にしておきます。
そしたら、AIの回答を削除します。ここで2通りの方法があります。
一つはAIを信じる方法。この場合は、
image.png
自分の先ほど入力したプロンプトの右上にあるGeminiのアイコンをクリックします。そうすると、AIの回答が再生成されます。冒頭にお伝えした通り、AIはランダムです。回答は乱数によって多少変化します。
もう一つはAIに約束を確認する内容をプロンプトに含ませる方法。この場合は

プロンプト.txt
最後に入力したプロンプト
念のため確認しますが、ソースコードを提示する際は必ず、ペーストするだけで動作する完全なソースコードとそのファイル名(プロジェクトディレクトリからの相対パス)を必ず提示するようにお願いします。

このように確認をするメッセージを入れるだけでモAIは思い出して、約束を守ってくれます。まぁ、それでも守ってくれない場合もあるんだけど。

ソースコードが長すぎる

Vibe Cordingをしているとソースコードが長くなりすぎて、AIがどうしても省略をしてくる場合があります。省略を許してはいけません。
その場合はファイルを分割しましょう。多くの言語において、ファイルを分割しても同じ動作を指せることができる機能が備わっているはずです。そこで、AIに以下のプロンプトを送信してみましょう。

プロンプト.txt
そろそろ〇〇.〇〇(長くなってきたファイルのファイル名)が長くなってきたので、ファイルを分割してほしいです。現在存在する機能をすべて維持して、複数のファイルに分割してください。分割したファイルはそれぞれプロジェクトディレクトリからの相対パスと、そのファイルのペーストするだけで動作する完全なソースコードを提示するようにお願いします。

すると、AIはファイルを分割してくれます。ファイル分割は結構難しいという経験があるので、ここでは性能のよいAIを使います。Google AI Studioはチャットの途中で回答するモデルを変更できます。ここでGemini 3.1 Pro Previewなどの最も性能の良いとされているモデルを選択します。それ以外のタイミングではあまり最高品質のモデルを使わないことをお勧めします。(性能の良いモデルは利用制限がかかりやすい)
場合によっては分割後のファイルが多すぎて一度で提示しきってくれない場合もあるので、その場合は続きを提示するようにお願いしてみましょう。

AIがバカ

時々、最高性能のモデルにしてもバグやエラーがなおらない場合があります。そのような場合は、最後の回答内容から、どのファイルがそのバグの問題となっているのか見極めて、ChatGPTやClaude, Copilot, Grokなどといった他のAIにファイルをそのままペーストしたり、添付したりして、〇〇というバグが発生している、と伝えれば解決策を教えてくれます。(この時Google AI Studioが生成したなどの詳細な情報を提示する必要はありません。)
そしてGoogle AI Studioに戻り、

〇〇というバグについて他のエンジニアについて聞いたところ以下の回答がありました。
以下他のAIの回答

するとおおよそ修正してくれます。うまくいかない場合は再生成やモデルを変更するなどして試行錯誤しましょう。乱数なのでうまくいく時が来るかもしれません。

まとめ

結局、私はこの方法が最も安定して開発ができます。AIにどのようなプロンプトを送るかは人によってかなり異なりますが、自分の思い通りの回答を得るコツがあるので、それさえマスターしてしまえば、Vibe Cordingも意外と簡単にできます。最後までお読みいただきありがとうございました。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?