ChatGPTでコード生成する方法｜コピペOKのプロンプト例と修正のコツ

はじめに

ChatGPTは、文章作成だけでなくコード生成にも活用できます。たとえば「PythonでCSVを読み込むコードを書いて」「JavaScriptで計算ツールを作って」「このHTMLとCSSを修正して」と指示すれば、目的に合わせたコード案を出力できます。

ただし、ChatGPTで生成したコードをそのまま使えば必ず動くわけではありません。実行環境の違い、ライブラリのバージョン、指定不足、セキュリティ上の問題などによって、エラーが出ることもあります。OpenAIの利用規約でも、出力は常に正確とは限らず、利用前に人間が内容を評価する必要があるとされています。

この記事では、「chatgpt コード」で検索している方に向けて、ChatGPTでコード生成する基本手順、コピペOKのプロンプト例、エラー修正のコツ、安全に使うための注意点をまとめて解説します。

1. ChatGPTでコード生成は何ができる？検索ユーザーが知りたい基本

ChatGPTのコード生成とは、自然な日本語で「作りたいもの」や「直したいコード」を伝えることで、プログラムのひな形や修正版を出力してもらう使い方です。

たとえば、次のような相談ができます。

「PythonでCSVファイルを読み込んで、特定の列だけ表示するコードを書いてください」

「HTMLとCSSで、スマホ対応のお問い合わせフォームを作ってください」

「このJavaScriptコードでエラーが出ます。原因を説明して修正してください」

ChatGPTは、会話形式で質問に答えたり、追加の指示をもとに内容を修正したりできるため、コードを一度出して終わりではなく、対話しながら改善できる点が特徴です。OpenAIも、ChatGPTはユーザーの質問や指示を理解して応答するAIサービスだと説明しています。

1-1. ChatGPTで生成できるコードの例

ChatGPTでは、さまざまな種類のコードを生成できます。代表的な例は以下のとおりです。

Web制作では、HTML、CSS、JavaScriptを使ったページ、ボタン、フォーム、メニュー、計算ツールなどを作れます。

業務効率化では、PythonでCSVやExcelを処理したり、ファイル名を一括変更したり、データを集計したりするコードを作れます。

スプレッドシート関連では、Google Apps ScriptやExcel VBAを使って、シートの自動整形、メール送信、定期処理などのコードを生成できます。

バックエンド開発では、Node.js、PHP、Python、Rubyなどを使ったAPI処理、データベース接続、ログイン機能のサンプルなども作れます。

ただし、ChatGPTが出すコードは「完成品」ではなく「たたき台」と考えるのが安全です。特にログイン、決済、個人情報の保存、外部API連携などは、セキュリティ確認が必須です。

1-2. コード生成が向いている作業・向いていない作業

ChatGPTでコード生成が向いているのは、目的や条件を言葉で説明しやすい作業です。

たとえば、以下のような作業に向いています。

簡単な関数の作成、サンプルコードの作成、既存コードの修正、エラー原因の説明、コードへのコメント追加、処理の流れの解説、テストコードの作成、リファクタリング案の提案などです。

一方で、向いていない作業もあります。

大規模システム全体の設計、複雑なセキュリティ要件を含む実装、金融・医療・法務など高リスク領域の自動判断、社内の機密仕様を含むコード生成、実行環境を確認しないまま本番投入する作業には不向きです。

ChatGPTは便利な補助ツールですが、最終的な動作確認、セキュリティ確認、品質判断は人間が行う必要があります。

1-3. 初心者でもChatGPTでプログラミングできるのか

初心者でもChatGPTを使ってプログラミングを始めることはできます。むしろ、何から書けばよいかわからない初心者ほど、ChatGPTを「質問できる先生」として使うメリットがあります。

たとえば、次のように質問できます。

Python初心者です。
CSVファイルを読み込んで、1行ずつ表示するコードを作ってください。
コードの下に、各行が何をしているのかも初心者向けに説明してください。

このように依頼すれば、コードだけでなく解説も一緒に得られます。

ただし、「ChatGPTに聞けばプログラミング学習をしなくてもよい」という意味ではありません。コードをコピーして動かすだけでは、エラーが起きたときに対応できません。最低限、変数、関数、条件分岐、繰り返し、ファイル操作などの基本を学びながら使うのがおすすめです。

1-4. ChatGPTでコードを書くメリットと注意点

ChatGPTでコードを書くメリットは、作業時間を短縮できることです。ゼロから文法を調べるよりも、まず動きそうなコードを生成し、それを修正しながら理解できます。

また、エラーメッセージの意味を説明してもらえるため、初心者でも原因を追いやすくなります。既存コードの改善案や、別の書き方を提案してもらえる点も便利です。

一方で、注意点もあります。ChatGPTは、存在しない関数や古い書き方を出すことがあります。実行環境に合わないコードを出すこともあります。また、個人情報やAPIキー、パスワード、社内コードをそのまま入力すると情報管理上のリスクがあります。

ChatGPTでコード生成を使うときは、「生成する」「実行する」「エラーを確認する」「修正する」「安全性を確認する」という流れで進めましょう。

2. ChatGPTでコード生成する基本手順

ChatGPTでコードを作るときは、いきなり「コードを書いて」と依頼するよりも、目的や条件を整理してから依頼するほうが精度が上がります。

基本の流れは次のとおりです。

1つ目は、作りたい機能や目的を明確にすることです。

2つ目は、使用するプログラミング言語を指定することです。

3つ目は、入力、出力、条件を具体的に伝えることです。

4つ目は、生成されたコードを実行することです。

5つ目は、エラー内容をChatGPTに伝えて修正することです。

2-1. 作りたい機能や目的を明確にする

まずは、何を作りたいのかを明確にします。

悪い例は次のような指示です。

便利なコードを書いてください。

これでは、ChatGPTは何を作ればよいかわかりません。

良い例は次のような指示です。

Pythonで、sales.csvというファイルを読み込み、
「商品名」と「売上金額」の列だけを表示するコードを書いてください。

目的が明確になると、ChatGPTは必要な処理を判断しやすくなります。

2-2. 使用するプログラミング言語を指定する

ChatGPTでコードを生成するときは、使用する言語を必ず指定しましょう。

たとえば、同じ「フォームを作る」でも、HTMLで作るのか、Reactで作るのか、PHPで送信処理まで作るのかによってコードは変わります。

次のように指定すると、回答のブレを減らせます。

HTMLとCSSだけで、お問い合わせフォームの見た目を作ってください。
JavaScriptやPHPは使わないでください。

または、次のように指定します。

Node.jsとExpressを使って、POSTリクエストを受け取るAPIのサンプルコードを書いてください。

言語だけでなく、フレームワークやライブラリも指定すると、より実用的なコードになります。

2-3. 入力・出力・条件を具体的に伝える

コード生成では、「何を入力して、何を出力するのか」を具体的に伝えることが重要です。

たとえば、Pythonで消費税を計算するコードが欲しい場合は、次のように書きます。

Pythonで消費税込み価格を計算する関数を作ってください。

条件:
- 入力は税抜価格 price
- 税率は10%
- 戻り値は税込価格
- 小数点以下は四捨五入
- 関数名は calculate_tax_included にしてください

このように、入力、出力、条件、関数名まで指定すると、意図に近いコードが生成されやすくなります。

2-4. 生成されたコードをコピーして実行する

ChatGPTが出力したコードは、実際に実行して確認します。

Pythonなら、ローカル環境、Google Colab、VS Codeなどで実行できます。

JavaScriptなら、ブラウザの開発者ツール、CodePen、JSFiddle、ローカルHTMLファイルなどで確認できます。

HTML・CSSなら、テキストエディタでファイルを作り、ブラウザで開いて表示を確認できます。

大切なのは、出力されたコードを読まずに本番環境へ貼り付けないことです。まずはテスト用の環境で動かし、期待どおりに動くか確認しましょう。

2-5. エラー内容をChatGPTに伝えて修正する

コードが動かない場合は、エラーメッセージをそのままChatGPTに貼り付けます。

たとえば、次のように伝えます。

先ほどのPythonコードを実行したところ、以下のエラーが出ました。

エラー:
FileNotFoundError: [Errno 2] No such file or directory: 'sales.csv'

実行環境:
Google Colab

やりたいこと:
アップロードしたCSVファイルを読み込んで、商品名と売上金額を表示したいです。

原因と修正コードを教えてください。

エラー文だけでなく、実行環境と期待する動作も伝えると、修正の精度が上がります。

3. コピペOK｜ChatGPTでコード生成するプロンプト例

ここからは、ChatGPTでコード生成するときにそのまま使えるプロンプト例を紹介します。必要に応じて、言語名、ファイル名、条件、出力形式を書き換えて使ってください。

3-1. 基本のコード生成プロンプト

まずは、どの言語でも使いやすい基本形です。

以下の条件でコードを作成してください。

目的:
[作りたい機能を書く]

使用言語:
[Python / JavaScript / HTML / CSS / PHP など]

条件:
- [条件1]
- [条件2]
- [条件3]

出力してほしいもの:
- 完成コード
- 実行方法
- 初心者向けの解説
- 注意点

例として、次のように使えます。

以下の条件でコードを作成してください。

目的:
入力された数値が偶数か奇数かを判定する

使用言語:
Python

条件:
- ユーザーから数値を入力してもらう
- 偶数なら「偶数です」と表示する
- 奇数なら「奇数です」と表示する
- 初心者でもわかるようにコメントを付ける

出力してほしいもの:
- 完成コード
- 実行方法
- コードの解説

3-2. Pythonコードを生成するプロンプト例

Pythonコードを作りたいときは、入力データの形式や使用ライブラリを指定すると精度が上がります。

Pythonで以下の処理を行うコードを書いてください。

目的:
CSVファイルを読み込み、売上金額の合計を計算する

条件:
- ファイル名は sales.csv
- 列名は product, price, quantity
- 売上金額は price × quantity で計算
- 全商品の売上合計を表示
- pandasを使用
- 初心者向けにコメントを付ける

出力:
- 完成コード
- 必要なライブラリのインストール方法
- 実行方法

ChatGPTからは、たとえば次のようなコードが生成されます。

Python
import pandas as pd

# CSVファイルを読み込む
df = pd.read_csv("sales.csv")

# 売上金額を計算する
df["sales"] = df["price"] * df["quantity"]

# 売上合計を計算する
total_sales = df["sales"].sum()

# 結果を表示する
print(f"売上合計: {total_sales}円")

3-3. JavaScriptコードを生成するプロンプト例

JavaScriptでは、ブラウザで動かすのか、Node.jsで動かすのかを指定しましょう。

JavaScriptで、ブラウザ上で動く簡単な計算ツールを作ってください。

目的:
入力した単価と数量から合計金額を計算する

条件:
- HTML、CSS、JavaScriptを1つのHTMLファイルにまとめる
- 単価と数量を入力できる
- ボタンを押すと合計金額を表示する
- 入力が空の場合はエラーメッセージを表示する
- 初心者向けにコメントを付ける

出力:
- 完成コード
- 使い方
- カスタマイズ方法

このように依頼すると、HTML、CSS、JavaScriptをまとめたサンプルを出してもらえます。

3-4. HTML・CSSコードを生成するプロンプト例

Webページの見た目を作る場合は、デザイン条件を具体的に書きます。

HTMLとCSSで、シンプルなお問い合わせフォームを作ってください。

条件:
- 名前、メールアドレス、お問い合わせ内容の入力欄を作る
- 送信ボタンを配置する
- スマホでも見やすいレスポンシブデザインにする
- 色は白背景、ボタンは青系
- JavaScriptとPHPは使わない
- HTMLとCSSを分けて出力する

色、余白、横幅、フォント、スマホ対応の有無を指定すると、実際の制作に使いやすいコードになります。

3-5. Excel・Googleスプレッドシート自動化のプロンプト例

ExcelやGoogleスプレッドシートの作業も、ChatGPTでコード化できます。

Excel VBAの場合は、次のように依頼します。

Excel VBAで以下の処理を行うマクロを作ってください。

目的:
A列に入力された名前をもとに、重複している行を赤く塗る

条件:
- 対象シートは「顧客リスト」
- 1行目は見出し
- A列の2行目以降をチェック
- 重複しているセルの背景色を赤にする
- 実行手順も説明する

Google Apps Scriptの場合は、次のように依頼します。

Google Apps Scriptで以下のコードを作ってください。

目的:
スプレッドシートのA列にあるメールアドレス宛に、定型メールを送信する

条件:
- シート名は「送信リスト」
- 1行目は見出し
- A列にメールアドレス
- B列に名前
- 件名は「ご案内」
- 本文に名前を差し込む
- 送信済みの場合はC列に「送信済み」と記録する
- 誤送信を防ぐため、実行前の注意点も書く

メール送信や外部共有を伴う処理は、必ずテスト用データで確認してから使いましょう。

3-6. API連携コードを作るプロンプト例

API連携では、APIキーの扱いに注意が必要です。実際のAPIキーはChatGPTに貼り付けず、仮の文字列で説明しましょう。

Pythonで外部APIにGETリクエストを送るサンプルコードを作ってください。

条件:
- requestsライブラリを使用
- APIキーは環境変数 API_KEY から読み込む
- エンドポイントURLは https://example.com/api/items とする
- レスポンスがJSONの場合、nameとpriceを表示する
- エラー時の例外処理を入れる
- 実際のAPIキーはコードに直接書かない

生成されるコード例は以下のようになります。

Python
import os
import requests

api_key = os.getenv("API_KEY")
url = "https://example.com/api/items"

headers = {
    "Authorization": f"Bearer {api_key}"
}

try:
    response = requests.get(url, headers=headers, timeout=10)
    response.raise_for_status()

    data = response.json()

    for item in data:
        print(item["name"], item["price"])

except requests.exceptions.RequestException as e:
    print(f"APIリクエストでエラーが発生しました: {e}")

APIキーやアクセストークンをコードに直接書くと、GitHubなどに誤って公開したときに悪用される可能性があります。環境変数やシークレット管理機能を使うのが基本です。

3-7. 既存コードを改善するプロンプト例

既存コードを改善したい場合は、目的を明確にしてからコードを貼り付けます。

以下のコードを改善してください。

改善したい点:
- 読みやすくしたい
- 重複処理を減らしたい
- 変数名をわかりやすくしたい
- 処理内容が変わらないようにしたい

お願い:
- 修正後のコードを出してください
- どこを変更したか説明してください
- 動作が変わる可能性がある点があれば指摘してください

コード:

このあとに既存コードを貼り付けます。

重要なのは、「速くして」「きれいにして」だけでなく、何を改善したいのかを指定することです。

4. 精度の高いコードを出すプロンプトの書き方

ChatGPTのコード生成は、プロンプトの書き方で結果が大きく変わります。OpenAIのプロンプト作成のベストプラクティスでも、目的、文脈、出力形式、スタイルなどを具体的に書くことが推奨されています。

4-1. 目的・前提条件・制約をセットで伝える

コード生成では、目的だけでなく前提条件と制約も伝えましょう。

たとえば、次のような情報です。

目的は「何を実現したいか」。

前提条件は「どの環境で、どんなデータを使うか」。

制約は「使ってよいライブラリ、使ってはいけない技術、コード量、命名ルール」などです。

プロンプト例は以下です。

目的:
CSVファイルから売上合計を計算したい

前提条件:
- Python 3.11
- pandasを使用
- CSVの列名は date, product, price, quantity

制約:
- 関数化する
- グローバル変数は使わない
- 初心者向けにコメントを付ける

このように整理すると、ChatGPTが条件を取り違える可能性を減らせます。

4-2. 実行環境やバージョンを指定する

コードが動かない原因の多くは、実行環境の違いです。

Pythonなら、Pythonのバージョン、使用するライブラリ、実行場所を伝えます。

JavaScriptなら、ブラウザで動かすのか、Node.jsで動かすのかを伝えます。

PHPなら、PHPのバージョン、フレームワークの有無、サーバー環境を伝えます。

例は以下です。

実行環境:
- Python 3.11
- Windows 11
- VS Code
- pandas 2.x

この環境で動くコードを書いてください。

環境を指定するだけで、古い書き方や環境違いによるエラーを減らせます。

4-3. コードの長さや書き方のルールを指定する

ChatGPTは、指定しないと長いコードや複雑なコードを出すことがあります。

初心者の場合は、次のように制限を付けると読みやすくなります。

以下のルールでコードを書いてください。

- できるだけ短くする
- 初心者向けにする
- 難しい構文は使わない
- 1つの関数は20行以内にする
- コメントを多めに付ける
- 外部ライブラリは使わない

逆に実務向けなら、次のように指定できます。

以下のルールでコードを書いてください。

- 型ヒントを付ける
- 例外処理を入れる
- 関数単位に分割する
- テストしやすい構造にする
- PEP 8に沿ったPythonコードにする

コードの品質基準を伝えることで、目的に合った出力になりやすくなります。

4-4. コメント付きで出力させる

初心者がChatGPTでコードを学ぶ場合は、コメント付きで出力させるのがおすすめです。

コードには、各処理が何をしているか分かるコメントを付けてください。
また、コードの下に初心者向けの解説も書いてください。

コメント付きのコードは理解しやすい一方で、本番コードではコメントが多すぎると読みにくくなることもあります。学習用ならコメント多め、実務用なら必要な箇所だけコメント、というように使い分けましょう。

4-5. テストコードも一緒に作らせる

ChatGPTで生成したコードは、テストコードも一緒に作らせると確認しやすくなります。

以下の関数を作成してください。
あわせて、pytestで実行できるテストコードも作ってください。

目的:
税込価格を計算する関数

条件:
- 関数名は calculate_tax_included
- 引数は price と tax_rate
- 戻り値は税込価格
- 小数点以下は四捨五入

テストコードを作ることで、期待どおりの結果になるかを自動で確認できます。

4-6. 悪いプロンプトと良いプロンプトの違い

悪いプロンプトは、条件があいまいです。

Pythonでいい感じのコードを書いて。

この指示では、何を作るのか、どんな入力を使うのか、どんな出力がほしいのかがわかりません。

良いプロンプトは、目的と条件が明確です。

Pythonで、リスト内の数値の平均値を計算する関数を作ってください。

条件:
- 関数名は calculate_average
- 引数は numbers
- numbersが空の場合は0を返す
- 外部ライブラリは使わない
- コードの下に使い方の例を付ける

ChatGPTでコード生成を成功させるコツは、「人間のエンジニアに依頼するつもりで、仕様を具体的に書くこと」です。

5. ChatGPTが生成したコードを修正するコツ

ChatGPTで生成したコードが一度で動かないことは珍しくありません。重要なのは、エラーを正確に伝えながら修正していくことです。

5-1. エラーメッセージをそのまま貼り付ける

エラーが出たときは、エラーメッセージを要約せず、そのまま貼り付けましょう。

悪い例は次のとおりです。

なんかエラーが出ました。直してください。

良い例は次のとおりです。

以下のエラーが出ました。原因と修正方法を教えてください。

Traceback (most recent call last):
  File "main.py", line 5, in <module>
    df = pd.read_csv("sales.csv")
FileNotFoundError: [Errno 2] No such file or directory: 'sales.csv'

エラーには、原因の手がかりが含まれています。特に、ファイル名、行番号、エラー名は重要です。

5-2. 期待する動作と実際の動作を伝える

エラーが出ない場合でも、期待どおりに動かないことがあります。

その場合は、「期待する動作」と「実際の動作」を分けて伝えます。

期待する動作:
ボタンを押すと、入力した単価と数量を掛け算して合計金額を表示したいです。

実際の動作:
ボタンを押しても何も表示されません。
ブラウザのコンソールには以下のエラーが出ています。

エラー:
Uncaught TypeError: Cannot read properties of null

このように書くと、ChatGPTが原因を推測しやすくなります。

5-3. コード全体ではなく問題箇所を絞って相談する

長いコードをそのまま貼ると、ChatGPTが重要な箇所を見落とすことがあります。

問題がありそうな関数、エラーが出ている行、その周辺だけを貼ると、回答が具体的になります。

以下の関数だけを見てください。
この関数でエラーが出ています。

やりたいこと:
配列の合計を計算したい

問題:
空の配列を渡すとエラーになります

コード:

そのあとに該当箇所を貼り付けます。

ただし、問題箇所がわからない場合は、最初に全体像を説明し、次に関連するコードを貼るとよいでしょう。

5-4. なぜエラーになるのか解説させる

修正コードだけを受け取ると、同じミスを繰り返しやすくなります。

次のように、原因の説明も依頼しましょう。

修正コードだけでなく、なぜこのエラーが起きたのかを初心者向けに説明してください。
また、同じエラーを防ぐためのチェックポイントも教えてください。

原因を理解すれば、次回から自分で直せる可能性が高くなります。

5-5. 修正後のコードを再チェックさせる

ChatGPTに修正してもらったコードも、再度チェックしてもらうと安全です。

以下の修正後コードをレビューしてください。

確認してほしい点:
- 文法エラーがないか
- 例外処理が足りているか
- セキュリティ上の問題がないか
- より読みやすくできる箇所があるか

コード:

コードレビュー用のプロンプトを使うことで、単なる修正だけでなく品質改善にもつなげられます。

5-6. 動かないときに使える修正プロンプト例

コードが動かないときは、次のテンプレートを使ってください。

以下のコードが動きません。原因を特定して修正してください。

実行環境:
[OS、言語のバージョン、実行ツールを書く]

やりたいこと:
[期待する動作を書く]

実際の動作:
[実際に起きていることを書く]

エラーメッセージ:
[エラー文をそのまま貼る]

コード:
[問題のコードを貼る]

お願い:
- 原因を説明してください
- 修正後のコードを出してください
- 修正した箇所を説明してください
- 再発防止のポイントも教えてください

この形式で伝えると、ChatGPTが状況を把握しやすくなります。

6. ChatGPTでコード生成するときの実践例

ここでは、実際にChatGPTでコード生成するときの具体例を紹介します。

6-1. Webサイトのお問い合わせフォームを作る

プロンプト例は以下です。

HTMLとCSSで、お問い合わせフォームを作ってください。

条件:
- 名前、メールアドレス、件名、お問い合わせ内容の入力欄を作る
- 送信ボタンを付ける
- スマホ対応にする
- 白背景でシンプルなデザイン
- HTMLとCSSを別々に出力する
- 送信処理は不要

生成されるHTML例です。

HTML
<form class="contact-form">
  <label for="name">お名前</label>
  <input type="text" id="name" name="name" required>

  <label for="email">メールアドレス</label>
  <input type="email" id="email" name="email" required>

  <label for="subject">件名</label>
  <input type="text" id="subject" name="subject">

  <label for="message">お問い合わせ内容</label>
  <textarea id="message" name="message" rows="6" required></textarea>

  <button type="submit">送信する</button>
</form>

生成されるCSS例です。

CSS
.contact-form {
  max-width: 600px;
  margin: 0 auto;
  padding: 24px;
}

.contact-form label {
  display: block;
  margin-top: 16px;
  font-weight: bold;
}

.contact-form input,
.contact-form textarea {
  width: 100%;
  padding: 10px;
  margin-top: 6px;
  border: 1px solid #ccc;
  border-radius: 4px;
}

.contact-form button {
  margin-top: 20px;
  padding: 12px 24px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}

このコードは見た目だけのフォームです。実際にメール送信やデータ保存を行う場合は、サーバー側の処理、バリデーション、スパム対策、個人情報保護の確認が必要です。

6-2. CSVファイルを読み込むPythonコードを作る

プロンプト例です。

PythonでCSVファイルを読み込むコードを書いてください。

条件:
- ファイル名は users.csv
- pandasを使う
- name列と email列だけを表示する
- ファイルが存在しない場合のエラー処理を入れる
- 初心者向けにコメントを付ける

コード例です。

Python
import pandas as pd

file_path = "users.csv"

try:
    df = pd.read_csv(file_path)
    print(df[["name", "email"]])

except FileNotFoundError:
    print(f"{file_path} が見つかりません。ファイル名と保存場所を確認してください。")

except KeyError:
    print("name列またはemail列が見つかりません。CSVの列名を確認してください。")

ChatGPTに依頼するときは、CSVの列名やサンプルデータを一緒に伝えると、より正確なコードになります。

6-3. JavaScriptで簡単な計算ツールを作る

プロンプト例です。

JavaScriptで、税込価格を計算するツールを作ってください。

条件:
- HTML、CSS、JavaScriptを1つのHTMLファイルにまとめる
- 税抜価格を入力する
- ボタンを押すと税込価格を表示する
- 税率は10%
- 入力が数値でない場合はエラーを表示する

JavaScript部分の例です。

JavaScript
function calculatePrice() {
  const priceInput = document.getElementById("price").value;
  const price = Number(priceInput);

  if (isNaN(price) || price < 0) {
    document.getElementById("result").textContent = "正しい金額を入力してください。";
    return;
  }

  const taxIncludedPrice = Math.round(price * 1.1);
  document.getElementById("result").textContent = `税込価格は${taxIncludedPrice}円です。`;
}

「数値でない場合」「空欄の場合」「マイナスの場合」など、例外条件を指定すると実用性が上がります。

6-4. CSSでボタンデザインを作る

プロンプト例です。

CSSで、Webサイト用のボタンデザインを作ってください。

条件:
- 丸みのあるボタン
- ホバー時に少し浮き上がる
- スマホでも押しやすいサイズ
- HTML例も付ける
- 色は後から変更しやすいようにCSS変数を使う

CSS例です。

CSS
:root {
  --button-bg: #2563eb;
  --button-text: #ffffff;
  --button-hover: #1d4ed8;
}

.button {
  display: inline-block;
  padding: 12px 24px;
  background-color: var(--button-bg);
  color: var(--button-text);
  text-decoration: none;
  border-radius: 999px;
  transition: transform 0.2s ease, background-color 0.2s ease;
}

.button:hover {
  background-color: var(--button-hover);
  transform: translateY(-2px);
}

ChatGPTに「CSS変数を使って」と伝えると、後から色を変更しやすいコードになります。

6-5. 既存コードをリファクタリングする

リファクタリングとは、処理内容を変えずにコードを読みやすく整理することです。

プロンプト例です。

以下のコードをリファクタリングしてください。

条件:
- 処理結果は変えない
- 関数名と変数名をわかりやすくする
- 重複している処理をまとめる
- 修正前後の違いを説明する
- 変更によって動作が変わる可能性があれば指摘する

リファクタリングを依頼するときは、「処理結果は変えない」と明記することが重要です。指定しないと、ChatGPTが勝手に仕様を変更する場合があります。

6-6. コードにコメントや解説を追加する

既存コードの意味がわからない場合は、コメントを追加してもらうのも便利です。

以下のコードに、初心者向けのコメントを追加してください。

条件:
- コード自体は変更しない
- 各処理の目的がわかるコメントを付ける
- コードの下に全体の処理の流れを説明する

この使い方は、他人が書いたコードを読むときや、学習中にコードの理解を深めたいときに役立ちます。

7. ChatGPTで生成したコードを安全に使うための注意点

ChatGPTでコード生成を使うときは、安全性の確認が欠かせません。特にWebサービス、業務システム、個人情報を扱うツールでは慎重に確認しましょう。

7-1. 生成コードをそのまま本番環境で使わない

ChatGPTが生成したコードは、必ずテスト環境で動作確認してから使いましょう。

確認すべきポイントは、文法エラーがないか、期待どおりに動くか、想定外の入力で壊れないか、セキュリティ上の問題がないか、不要な処理が含まれていないかです。

OpenAIの利用規約でも、出力を利用または共有する前に、用途に対して正確性と適切性を評価する必要があるとされています。

7-2. セキュリティ上危険なコードを確認する

WebアプリやAPI連携では、以下のようなリスクに注意してください。

SQLインジェクション、クロスサイトスクリプティング、認証不備、APIキーの直書き、パスワードの平文保存、入力値チェック不足、外部からのファイルアップロード処理などです。

ChatGPTに次のようにレビューを依頼できます。

以下のコードをセキュリティ観点でレビューしてください。

確認してほしい点:
- SQLインジェクションのリスク
- XSSのリスク
- APIキーやパスワードの扱い
- 入力値チェック
- 本番環境で使う前に修正すべき点

ただし、ChatGPTのレビューだけで安全性が保証されるわけではありません。重要なシステムでは、専門家によるレビューも必要です。

7-3. 個人情報や機密情報を入力しない

ChatGPTにコードを貼るときは、個人情報、社内情報、APIキー、パスワード、アクセストークン、顧客データなどを含めないようにしましょう。

たとえば、以下のように置き換えてから相談します。

APIキー: YOUR_API_KEY
メールアドレス: user@example.com
顧客名: 山田太郎 → サンプルユーザー
会社名: 株式会社〇〇 → サンプル会社

ChatGPTは便利ですが、機密情報を扱う場合は、自社のセキュリティポリシーや利用規約を必ず確認してください。

7-4. ライブラリやバージョンの違いに注意する

ChatGPTが生成したコードが動かない原因として、ライブラリのバージョン違いがあります。

たとえば、古いバージョンでは使えた関数が新しいバージョンで非推奨になっていたり、逆に新しい機能が古い環境では使えなかったりします。

プロンプトには次のように書きましょう。

Python 3.11、pandas 2.xで動くコードにしてください。
古い書き方や非推奨のメソッドは使わないでください。

実行環境を指定するだけで、不要なエラーを減らせます。

7-5. 著作権やライセンスの確認をする

ChatGPTで生成したコードを商用利用する場合は、利用規約やライセンスを確認しましょう。OpenAIの利用規約では、適用法の範囲内で、ユーザーは入力の権利を保持し、出力を所有するとされています。

ただし、生成コードに外部ライブラリを使う場合、そのライブラリのライセンスは別途確認が必要です。MIT、Apache、GPLなど、ライセンスによって利用条件が異なります。

また、ChatGPTに「このコードはライセンス上問題ありませんか」と聞くことはできますが、最終判断は公式ライセンスや専門家の確認をもとに行いましょう。

8. ChatGPTのコード生成でよくある失敗と対処法

ChatGPTでコード生成を使っていると、よくある失敗パターンがあります。原因を知っておくと、短時間で対処できます。

8-1. コードが動かない

最も多い失敗は、生成されたコードが動かないケースです。

原因としては、ファイル名が違う、ライブラリが入っていない、実行環境が違う、コードの一部が欠けている、入力データの形式が違う、といったものがあります。

対処法は、エラー文をそのまま貼り、実行環境と期待する動作を伝えることです。

このコードが動きません。
エラー文、実行環境、期待する動作をもとに原因を特定してください。

8-2. 古い書き方のコードが出力される

ChatGPTが古い書き方のコードを出すことがあります。

対処法は、バージョンを明記することです。

Python 3.11で動く、現在一般的な書き方のコードにしてください。
古い構文や非推奨の書き方は避けてください。

JavaScriptなら、次のように指定できます。

モダンJavaScriptで書いてください。
varではなくconstまたはletを使ってください。

8-3. 指示と違うコードが生成される

指示と違うコードが出た場合は、最初のプロンプトがあいまいだった可能性があります。

たとえば、「フォームを作って」とだけ言うと、送信処理まで含めるのか、見た目だけなのかが曖昧です。

対処法は、条件を箇条書きにすることです。

条件を再指定します。

- HTMLとCSSのみ
- JavaScriptは使わない
- 送信処理は不要
- 見た目だけ作成
- スマホ対応にする

この条件で作り直してください。

8-4. エラー修正を繰り返しても解決しない

何度修正しても解決しない場合は、ChatGPTが前提を誤解している可能性があります。

その場合は、会話を続けるよりも、情報を整理して新しいプロンプトで聞き直すのがおすすめです。

これまでの修正では解決しませんでした。
以下の情報をもとに、原因を最初から整理してください。

目的:
実行環境:
コード:
エラーメッセージ:
試したこと:
期待する動作:
実際の動作:

「試したこと」を書くと、同じ修正案を繰り返されにくくなります。

8-5. 長いコードで途中から破綻する

長いコードを一度に生成すると、途中で構成が崩れたり、関数名が不一致になったりすることがあります。

対処法は、機能ごとに分けて依頼することです。

まずは全体設計だけを出してください。
その後、機能ごとにコードを作成します。

または、次のように依頼します。

以下の順番で進めてください。

1. ファイル構成を提案
2. 各ファイルの役割を説明
3. まずHTMLだけ作成
4. 次にCSSを作成
5. 最後にJavaScriptを作成

大きなコードは、分割して作るほうが成功しやすくなります。

8-6. 日本語の指示がうまく伝わらない

日本語の指示があいまいだと、ChatGPTが別の意味で解釈することがあります。

対処法は、専門用語や条件を具体的に書くことです。

悪い例です。

いい感じに整えてください。

良い例です。

以下の条件でCSSを調整してください。

- 横幅は最大960px
- 中央寄せ
- スマホでは1カラム
- PCでは2カラム
- 余白は上下40px
- 文字サイズは16px

「いい感じ」「シンプル」「おしゃれ」などの言葉だけではなく、数値や条件を入れると精度が上がります。

9. ChatGPTでコード生成する際によくある質問

9-1. ChatGPTで作ったコードは商用利用できる？

OpenAIの利用規約では、適用法の範囲内で、ユーザーは出力を所有するとされています。

ただし、商用利用する場合でも、生成コードの動作確認、セキュリティ確認、ライブラリのライセンス確認は必要です。特に外部ライブラリを含むコードでは、そのライブラリの利用条件を必ず確認しましょう。

9-2. プログラミング初心者でも使える？

初心者でも使えます。むしろ、コードの意味を説明してもらったり、エラーの原因を教えてもらったりできるため、学習補助として役立ちます。

ただし、コピーして動かすだけでは理解が深まりません。コードの下に解説を付けてもらい、1行ずつ意味を確認しながら使うのがおすすめです。

9-3. どのプログラミング言語に対応している？

ChatGPTは、Python、JavaScript、HTML、CSS、PHP、Ruby、Java、C#、C、C++、Go、Swift、Kotlin、SQL、VBA、Google Apps Scriptなど、幅広い言語のコード生成に対応できます。

ただし、対応できることと、常に正しいコードを出せることは別です。マイナーな言語や特殊なライブラリでは、公式ドキュメントと照らし合わせて確認しましょう。

9-4. 無料版でもコード生成できる？

ChatGPTの無料版は利用可能で、有料プランでは追加機能やより高い利用枠などが提供されています。OpenAIの料金ページでも、無料版は誰でも利用でき、有料プランでは追加機能やより強力な体験が提供されると説明されています。

また、OpenAIのCodexはコードの作成、レビュー、出荷を支援するAIエージェントとされ、対象プランにはFreeも含まれますが、利用上限はプランによって異なります。

9-5. ChatGPTだけでアプリやWebサービスは作れる？

小さなツールや簡単なWebページであれば、ChatGPTを使ってかなりの部分を作れます。

ただし、公開するWebサービスや業務アプリでは、要件定義、設計、セキュリティ、データベース、認証、テスト、運用、保守などが必要です。ChatGPTだけに任せるのではなく、開発の補助ツールとして使うのが現実的です。

9-6. コードレビューにも使える？

ChatGPTはコードレビューにも使えます。

たとえば、次の観点でレビューを依頼できます。

以下のコードをレビューしてください。

確認してほしい点:
- バグになりそうな箇所
- 読みにくい箇所
- セキュリティ上の問題
- パフォーマンス改善
- 命名の改善
- 初心者にもわかる説明

ただし、ChatGPTのレビューは万能ではありません。重要なプロジェクトでは、自動テスト、静的解析ツール、人間のレビューを組み合わせることが大切です。

まとめ

ChatGPTでコード生成を使えば、Python、JavaScript、HTML、CSS、VBA、Google Apps Scriptなど、さまざまなコードを効率よく作成できます。

成功のポイントは、作りたい機能、使用言語、入力、出力、条件、実行環境を具体的に伝えることです。「コードを書いて」ではなく、「何を、どの環境で、どの条件で動かしたいのか」を明確にするほど、精度の高いコードが生成されます。

また、生成されたコードは必ずテスト環境で実行し、エラーが出たらエラーメッセージをそのままChatGPTに伝えましょう。修正を依頼するときは、期待する動作、実際の動作、実行環境、試したことをセットで伝えると解決しやすくなります。

ChatGPTはコード作成、修正、解説、レビューに役立つ便利なツールですが、出力をそのまま本番環境で使うのは危険です。セキュリティ、ライセンス、個人情報、ライブラリのバージョンを確認しながら、安全に活用しましょう。