前フリ（読まくていいです💦）
この本を読んで退職された先生とメールでやりとりしてAIに対する考え方がまた変わりました。とにかく自分でできそうなことも とりあえずAIでやってみる をやっています。
節分だったのでお櫛田さんにお参りに行ってきました。商店街で昼飲みしていい気分で帰宅しました。今日は仕事はしない日と思いテレビをぼーっと見ていましたがさすがに飽きてきたのでPCに向かうことに。
あまり見たいコンテンツもなかったので最近ほとんど見なくなったHacker NewsとLobstesを眺めていましたら面白い記事がたくさん。。。
この記事はまさにそうだな。。。と思うものでした。LLMがいくら新しいデータを仕込んでいるとはいえ発信された確証の高いデータを突っ込んでいると思われます。大多数の人が投稿している記事をベースに回答が返ってくるとすると流行ってない技術（これからの技術）については結果が出にくいのでしょう。ロングテールといいますか。どこまで対応するかでしょうかね？
この記事に書かれていたhtmxって何？と。。。知りませんでした。早速、ぐぐるとQiitaの記事が。勉強になりました。DHHも似たようなことを言ってましたね。JSフレームワークを使わなくてもできるようにしたい的な。
さて、ここまできたところでお勉強はひとまずおいておいて。
今日、風呂に入りながら、 久しぶりにp5jsでインベーダーゲームでも作りたいなぁ。。。 と思いました。 自分でチマチマ作るのも面白いけど、cursor使ったらどんな感じでできるんだろう？ って思ったんです。
cursorはリリースされた頃に少し遊んですぐにアンインストールしました。関心がなかったので。。。ちょうどその頃、repl.itもAI対応して ああいうのやられると。。。授業とか困るなぁ と当時は感じた（拒絶感？）からだったような気がします。１年か２年くらい前だったと思います。
で、試しにcursorを起動して作ってみました（いや、僕が作ったわけではなく作ってもらっただけですが）。インベーダーゲームを。
cursorでAIにインベーダーゲームを作ってもらう
cursorをインストールします。
起動すると、vscodeと同じだなと思いながらファイルを新規作成します。
ちなみにcursorの使い方はよくわからなかったので、以下の有料級の記事を参考にさせていただきました。太っ腹です。ちなみに、自分のゼミの学生さんにこの記事をSlackで布教しました。ありがとうございます。
cursorの右ペインにchatウィンドウが表示します。表示されていなければ右上のアイコンの右から２番目（下図の赤○）を押します。AI Paneっていうらしいです。
インベーダーゲームを作りたい って入力しましたら。pygameのコードが出てきました。まさに上の記事ですね。。。いかにPython使いが多いかが証明されます。
さらに p5jsで作りたい って入れましたら、ちゃんとコードが出てきました💦
このままファイルを作ってほしいので Apply to a.js をクリックすると作成してくれました。
同じく作ってくれたhtmlファイルのところもApplyボタンを押しました。
ここでindex.htmlをダブクリすれば実行できることはわかりますが、知らない体で 実行するにはどうすれば？ と聞いてみましたら。。。３つ提案してくれました。vscodeに拡張機能を入れる方法、ローカルサーバーを利用する方法、p5.js Web Editorを利用する方法です。どれも正解ではありますが。。。まぁいいです。
凄いですね。。。動きます。砲台は動くし弾も出ます。しかも連続発射できます。敵の折り返し方がちょっと違いますが。
ちなみに、最初にコードを生成してもらったときに、拡張方法も提案してくれていましたが。。。それは無視して思った感じにお願いしていきます。JSのコード全体を選択状態にして⌘-Kを押します。
スコア機能をつけて とお願いするとコードをサーチして、差分表示で教えてくれます。コードは見ません。そのままAcceptボタンを押したら反映されます。
ついちゃいました。。。
あとは 自機と敵の間に隠れる場所を４個所つけて と 敵も攻撃するようにして といいましたらあっという間です。コードは全く読んでません。
ちょっと意地悪して、ゲーム画面を９０度回転してもらいました。 ゲーム画面を横にして だけです。
惜しい。。。なんか違います。自機がいません。ゲーム画面外なのでしょう。。。
まだコードを見ません。またコード全体を選択して 自機が表示されていません、修正できますか？ と聞いてみましたら文句も言わずにやってくれました。完璧です。
飽きたので ３ｄゲームにしてください と無茶振り。。。でも、やってくれました。でも弾が当たりません。
弾が当たらなくなりました。直せますか？ と。直りませんでした。。。プロンプトが悪いのでしょう。しかたがないので ３ｄにする前の状態に戻してください と頼むと戻してくれました。コンテキストを理解しています。
敵と自機を逆にしてください と伝えると忠実に逆にしてくれました。恐ろしいゲームですが。。。
ちょっと意地悪で、drawメソッドのトップで全消しするbackground(0)を削除しました。結果はこんな感じです。当然ですね。
で、しれっと 表示がおかしくなりました、どこが問題ありますか？ と聞いたら。。。
ちゃんと修正してくれました。
ちなみにChatウィンドウで尋ねるとうまく行きませんでした。cursorの機能なんですね（バックエンドはclaude-3.5-sonnetとのことですが）。。。凄い。
ここまで来るとやはりプログラミング教育のあるべき姿というのが変わっていかなければならないことを痛感します。
小さなブロックを覚えてそのブロックを組み合わせて自在にプログラムを作れるようになることを目指した教育をこれまで長年やってきたわけですが。。。
要求に対する単純化したコードを動かして結果を見て要求との差を見て、もし要求と異なればさらにプロンプトを書いて修正していく。。。これで終わりなら絵がかけなくても画像が得られるAIの利用と大差ないですが、場合によってはこれだけで十分なケースもあるでしょう。そのコードを動かすための最低限の知識を身につけるところがまずは重要になるのかな、というところです。
その中の仕組みについてもAIが個別に解説してくれます。
そもそも問を立てるにはどうすればいいか？問に対する答えがわからなければどうすればいいか？その辺りの知識をオンデマンドでサポートして付けてもらいながら少しずつコードの成り立ちを理解していく。。。そんなアプローチでも結果的には同じくらいのスキルが身につく可能性が十分に考えられます。
本当の基礎は導入で学んだとしても、そのコードの組み合わせ方は実践を通して学んでいくスタイル、ちょうど私がこの５年くらいやり続けている情報学プロジェクトのスタイルに近い方法で学生が主体的に学んでいくのがいいのかな。。。と思えてきています。
もちろん、もっともっと体系的に学びたいという気持ちがわいてくれば設計手法やデザインパターンなども学んでいけばいいのでしょうし。まずは、自分で作れる感覚を得るってところが重要なのかなと思います。
とりあえず、今日はここまで。
