山田隆一公式サイト

1555.【GPT-5】コードの修正も、ChatGPTにおまかせあれ!【JavaScript】

2025/08/27

...

生成AI「ChatGPT」の使い方はぜひこちらをご覧くださいませ。

...

今回は、先日作ったアプリの修正をしてみました。

パズルのようなもの』修正版

今回は、『パズルのようなもの』を修正してみました。

このアプリの詳細はこちらの記事でご紹介しております。

「凸凹パズルのようなもの」

(画像をクリック・タップすると遊べます)

こちらのゲームですが、パソコン上では問題なく動作したものの、スマホで動かそうとしてみるとうまく動きませんでした。

ということで、スマホでも動くようにChatGPTに新たに指示してみました。

「凸凹パズルのようなもの」修正指示

指示すると、スマホでも動かすためのイベント"touchstart","touchmove","touchend"のイベントを提案してくれました。

そしてそのまま全コードを書き換えることを依頼するとうまくいきませんでした。

いろいろと格闘し、

「凸凹パズルのようなもの」修正指示

このように指示することで適切なコードを教えてくれました。

「凸凹パズルのようなもの」修正指示

全てのコードをここに掲載すると冗長になってしまいますのでこれだけ掲載しますが、パソコン用の3つのイベント・mousedown/mousemove/mouseupと、スマホ用の3つのイベント・touchstart/touchmove/touchendを共通のhandleStart/handleMove/handleEndという3つの関数にまとめてシンプル化してくれました。

これを該当部分に書き換えると、見事にスマホでも動くようになりました!嬉しいです!

私はJavaScriptは少しかじったくらいで修正コードを自力で書くとなると調べながら時間をかけて書くことになりますが、ChatGPTに依頼すればすぐ適切で美しいコードを提案してくれました!

そして、こうやってChatGPTに依頼することで私自身もJavaScriptを少し学ぶことができます。

こうやって、プログラミングに関してもわからないことがあったらChatGPTに質問してその都度学ぶ、ということを私はこれからも繰り返していくことでしょう。

...

ChatGPTなどの生成AIの登場で、ノーコード(コーディングの知識不要)でも様々なアプリを作ることができるようになってきておりますが、コーディングの知識があるに越したことはありません。

私のコーディング技術は独学でとてもプロには及ばないのですが、ChatGPTを通して学ぶことによりこれから上達していくかもしれませんね。

...

お読みいただき、ありがとうございました。