【Web制作】 ChatGPTを使ったプログラミング勉強方法＆活用法

2023年6月21日2023年10月14日

こんにちは、ここぽてとです。本日は、話題のChatGPTが学習の中で出てきたので、登録方法や使い方やプログラミングにどう活用するのかをまとめました。プログラミング以外の学習としても利用できますので、みなさん使ってみてくださいね！

ChatCPTとは

ChatGPTは、高度な自然言語処理技術を用いて、人工知能による自動応答を行うことができます。そのため、プログラミングにおいても、コーディングや開発に関する質問や疑問を簡単に解決できます。ChatGPTは機械学習のため、正確な答えではない可能性があります。しかし、気を付けて使用すれば、学習する補助ツールとして、便利に使用することができます。

Chat GPTを使うための登録方法

英語ばかりで、少し抵抗あるかもしれませんが、簡単です。

１．https://openai.com/blog/chatgptにアクセスする。

２．右上のmenuをクリックし、「Sign up」をクリック。

３．次ページで「Create your account(アカウントを作る)」で、Emailアドレスを記入。Googleアカウントでログインしたいなら下の方のメニューをクリックします。

４．メールアドレス宛に届いたOpenAIの英語メールの「Vertify email address(メールアドレス確認)」という緑色のボタンを押してメールアドレス認証。

５．「First nane(名)」と「Last name(姓)」を入力。(ニックネームでも可)

６．SMSを受信するための携帯電話番号を入れて、「Send code(コード送信)」を押す。

７．届いたSMSコードを入力して登録が完了。

Chat GPTログイン方法

１．https://openai.com/blog/chatgptにアクセスする。

２．右上のmenuをクリックし、「Login」をクリック。

３．ログイン画面が表示されますので、登録したメールアドレスとパスワードを入力し、ログイン。

４．出てきた画面のChatGPTをクリックすると吹き出しが出てくるので「next」を押す

５．最後の吹き出しで「Done」というボタンを押すと、フォームが出てきて、Chat GPTを利用できます。画像の赤枠のところに入力すると、質問に答えてくれます。

ChatGPTを使ったプログラミング勉強方法

ChatGPTをプログラミングにどう活かせるかについて解説していたものをリストにしておきます。

辞書として使う

タイポのチェックに使う

わからないところを辞書として使うのはもちろん、プログラミング初心者のエラーの原因としても特に多いタイポ（誤字のチェック）を目的としてChatGPTしても使うことが出来ます。下の画像は実際に私が、コーディングに行き詰まり、ChatGPTに質問したものです。

実際にコーディングしていてCSSが適用されなくて、どこが問題をチェックしているところです。Chat GPTにこんな感じで質問するとミスをチェックしてくれます。チェックして修正したものをきちんと載せてくれるので、そのままコピーも可能です。

ここぽてと

コメントアウトに対しても反応してくれてる！なんか嬉しい（笑）

他にも…

ChatGPTに従い、次のコードを入れると、無事にjQueryが作動しました！toggleClassがtoggleだけになっていたので、それでうまく作動しなかったようです。

ここぽてと

4時間も問題を探していたのに、ChatGPTで一瞬で解決しました（笑）
これからはすぐにChatGPTに頼ります！

エラーメッセージの理解に使う

エラーメッセージを直接ChatGPTに聞くことで、エラーメッセージの翻訳をしなくてもエラーの意味を理解することができます。

コードの解説

記事の解説に使う

ネットでエラーを調べていて、関連する情報をネット上の解説記事で調べていて意味がわからないときに、ChatGPTに聞くと解説してくれます。

ChatGPTを使うときのポイント

できるだけ質問を詳しく明確に書く

このようにコードを書くことももちろんそうですが、「Sassで教えてください」のように指定しないと、CSSでのコードの解説があったりします。もちろん私のコードはSassで書いているので、CSSで解説するchatGPTからすれば、私のコードは間違いという認識になるので、Sassの質問をするときは、「Sassで解説してください」とできるだけ詳しく伝えて、解説をお願いしましょう。

ポイント
質問はできるだけ詳しく明確に書くことで、AIの誤答を防げる可能性も上がります。
（でもたまに、本当に間違いを教えてくることもあるので注意）→翻弄されまくりました笑