14
12

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

【HTML+JS】コードを書くのがめんどくさいのでAIにやってもらった

Last updated at Posted at 2023-03-23

巷で流行っているAIChatBotの一種、ChatGPT。
様々な使い方をされている中、プログラム・スクリプトを提案してもらえるという話を小耳に挟んだので、筆者も使ってみることにしました。
※執筆当時のバージョン3を使用しています。

ChatGPTの登録方法・使用方法については割愛させていただきます。

要件を伝える

まずは画像の通り、要件を伝えました。

「ゴリラ」ボタンを押すと、テキストエリアに🦍が出る。連打するといっぱい出る。
という内容です。AIが相手なので少し細かく記載しました。

返答を確認する

こちらがChatGPTからの返答です。

シンプルに完成度の高いコードを書いてくれました。
addGorillagorillaTextareaなど良い感じの変数・関数名も設定されています。
コードの説明もされているので、後から自分が手を加えるときも楽そうです。

動かしてみる

これを実際に動かしてみると……。

ゴリラが増える!!!!

要件に忠実に沿っていて、実際の動作も問題ないですね。

ただ、要件を伝えたとき
「ボタンの 下部 のテキストエリアに~」と書いていたのですが、
改行がされておらず、テキストエリアがボタンの右に位置してしまっています。
理想通りのものが提案されなかった場合、こういった箇所は手作業で修正を加える必要がありますね。

AI利用のメリット・デメリット

色々あるかと思いますが、筆者が使用する範囲で思いつくのはこれでしょうか。

メリット

  • 指示した要件でのコードを提案してもらえる
  • 変数名や関数名のみ提案してもらうこともできる
  • コードの最適化など、ぐちゃぐちゃなコードの整形もできる
  • やりたいことが言語化さえできれば、手を動かす工数を大幅に減らせる

デメリット

  • 100%の正確性はないので、自分が理解できないレベルのコードを生成されても修正できない
    →人に聞くという手段もありですが、とある質問サイトではAI生成されたコードに関する質問が制限されているケースもあるようです。
    参考:https://www.itmedia.co.jp/news/articles/2212/06/news069.html

  • 質問が学習されている可能性があり、セキュリティの面で懸念がある
    →使用を禁止している会社も多く、仕事で使用する場合は先方の意向に注意したいです。
    参考:https://www.businessinsider.jp/post-265674

AIと和解せよ

あまりアンテナを張っていない筆者でも、AIの分野の成長のめざましさには目を見張るものがあります。
賛も否も意見がたくさんありますが、筆者個人としては程よい距離感で新しい技術に触れて、楽しみつつプログラミング学習のサポートとして利用できたらと思っています。

14
12
2

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
14
12

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?