バイブコーディングとは

バイブコーディングって何？

• コードを知らなくてOK

  プログラミング言語を知らなくても大丈夫。ふだんの言葉で十分です。

• 説明するだけ

  友だちへのメッセージのように、欲しいものをチャットに書きます。AIがそれを本当に動くコードに変えてくれます。

• すぐに目で見られる

  結果はチャットの横のキャンバスにすぐ現れます。押して、遊んで、使ってみましょう。

使い方

3つのステップ、そして繰り返し。それだけです。

1. 1
   話す チャットで

   作りたいものを書いて送ります。例：「今の時刻を大きな数字で表示する時計を作って」

2. 2
   見る キャンバスで

   AIがコードを書き、結果がキャンバス（チャット横のプレビュー画面）に現れます。そこですぐに試せます。

3. 3
   直す 会話を続ける

   気に入らなければ、変えたいことを言います。「数字を青にして」「停止ボタンを付けて」。AIが直してくれます。気に入るまで繰り返しましょう。

今ここで試してみる

これがバイブコーディングのウィジェットです。例を選ぶか自分のアイデアを書いて、キャンバスに現れるのを見てください。

どのページでも、画面の隅にある魔法の杖ボタンを押すと同じウィジェットが開きます。学びながらすぐに作れます。

上手に頼むコツ

• 具体的に

  「ゲームを作って」では曖昧です。「スペースキーでジャンプしてブロックを飛び越えるゲームを作って」と言えば、AIは作れます。

• 一度に一つずつ

  一つ頼んでキャンバスを確認し、それから次を頼みます。小さな一歩のほうが確認も修正も簡単です。

• 動かなければ伝える

  何も表示されない、ボタンが効かない？ 何がおかしいかをそのまま伝えればOK。「ボタンを押しても何も起きない。直して」