書くだけでできるコーディング、バイブコーディング
コードを知らなくても大丈夫。作りたいものをチャットに書くだけで、リエンがすぐにアプリを作って画面に見せてくれます。気に入らなければ、また書いて直せます。
こんなものが作れます
下をタップすると、リエンがすぐに作り始めます。
バイブコーディングとは?
作りたいものの雰囲気や動きを文章で説明し、と一緒に結果をすぐ見ながら直していくの方法です。
いつ使うの?
アイデアをすばやく試したり、小さなWebアプリやゲームを作ったり、・・を楽しく学ぶときにぴったりです。
どうやるの?
① 何を作るか書く → ② リエンがコードを作る → ③ プレビューを確認 → ④ また書いて直す。これをくり返します。
リエンに上手に頼むコツ
リエンは、あなたが書いた言葉どおりに作ります。頼む文で思い描いた姿がはっきりしているほど、最初の結果が想像に近くなり、直す回数も減ります。
-
何なのかを言う
まず種類を書きましょう。ゲーム、クイズ、タイマー、ホームページなどです。「8歳の弟が遊ぶ」のように、誰のためのものかも添えましょう。
-
見た目を言う
色・大きさ・位置を書きましょう。「濃い青の背景」「大きくて丸いボタン」「点数は上の隅に」。友だちに話すときの言葉で十分です。
-
何が起きるかを言う
押したとき、キーを打ったとき、時間切れになったとき、どうなりますか?「スペースキーを押すと、ネコがジャンプする。」ルールがあると、絵がアプリに変わります。
-
一度に一つずつ直す
最初の結果が出たら、メッセージ一つにつき直してほしいことを一つだけ頼みましょう。「ネコをもっと大きく」、その次に「音を入れて」。何かが壊れても、どの頼みが原因かすぐに分かります。
同じアイデア、二通りの頼み方
ゲームを作って。
矢印キーで動くネコが、落ちてくる星を集めるゲームを作って。点数は上に表示して、30秒たったら終わるようにして。
ぼんやりした頼みが間違いというわけではありません。リエンはそれでも何かを作りますが、残りを推測するしかないので、結果は思いがけないものになります。はっきりした頼みは、その推測に前もって答えてくれます。
うまく動かないとき
はっきり頼んでも、アプリが思ったとおりに動かないことがあります。それは普通のことです — プログラマーはだれでも、何度も直しながら作ります。抜け出す道は三つあります。
-
リエンにエラーを直してもらう
プレビューにが出ると、リエンがそのエラーの文を受け取って、一度は自動で直そうとします。それでもエラーが残っていれば、ボタンを押してもう一度任せられます。全部で3回試してもうまくいかなければ、止まってあなたに尋ねます。同じ直し方をくり返しても、うまくいくことはめったにないからです。
-
見えたことを言う
期待したことと実際に起きたことの違いを書きましょう。「スペースキーを押しても何も起きない。ネコがジャンプするはず。」リエンにはあなたの画面が見えないので、言葉で描いた絵がいちばん早い直し方です。プレビューの横のにはエラーが並びます。一つをコピーしてチャットに貼りましょう。
-
うまく動いていたバージョンに戻る
保存するたびに — あなたが保存しても、リエンが保存しても — 新しいバージョンができ、プロジェクトごとに最新の50個が残ります。変更で前より悪くなったら、履歴を開いて、うまく動いていたバージョンに戻しましょう。戻したことも新しいバージョンとして保存されるので、何も失われません。
安全に共有する
プロジェクトを作ったときは、共有はオフになっています。オンにすると、アドレスを知っている人ならだれでもアプリを開いて動かせます。オフにするとそのアドレスは開けなくなります。もう一度オンにすると、実行アドレスはそのままもう一度開き、共有画面のアドレスだけが新しくできます。共有したアプリは別の鍵のかかった箱の中で動くので、だれのSONUBアカウントにも届きません。それでも、共有するアプリにパスワードや個人情報を絶対に入れないでください。ほかの人のアプリにも入力しないでください。
リエンが書いたコードが気になりますか?
リエンが作るアプリは、CSSとJavaScriptが入ったHTMLファイル一つです。始めるときは読まなくても大丈夫です。一行を自分で直したいときや、なぜ壊れたのか知りたいときは、次のページが役に立ちます。
中でどう動いているか知りたいなら? 学ぶ
このプロジェクトにはリエンのコード付きの回答がありますが、アプリに保存されていませんでした。そのコードで復元できます。
このプロジェクトはまだ空です。作りたいものをチャットに書いてみましょう。
下をタップすると、リエンがすぐに作り始めます。
まだ何もありません。