ChatGPT にエラー解決をお願いする際、毎回プロンプトを手作業で書いているという方も多いのではないでしょうか？
そんな方向けに、3 ステップでプロンプトを自動生成できるサイトを作成しました。
もしよろしければ、ぜひご活用ください！
🛠 どんなサイト？
このサイトは、以下の情報を元に ChatGPT 用のプロンプトを自動生成します：
・エラー文
・該当ソースコードファイル（ファイルアップロード）
生成されるプロンプトは以下の形式で構成されます：
下記のエラーの原因と解決する方法を教えて頂けますか？
[エラー文]
関連するファイルの内容は以下の通りです。'ファイル名'
[ファイルの内容(各行の先頭に行数を入れる)]
エラーの要点や注意点があればそれも合わせて教えてください。
✅ 特徴
・ソースコードに自動で行番号を付与
ChatGPT にコードを送る際、行番号があると文脈理解の精度が圧倒的に向上します。
「何行目でエラーが出ているか？」といった質問にもスムーズに対応してくれるようになります。
・プロンプトをそのままコピペできるボタン付き
生成されたプロンプトは「プロンプトをコピー」ボタンで一発コピー可能です。
・ファイルアップロード対応
JavaScript/TypeScript/Python/HTML/CSS など、テキストベースのコードファイルであればほぼ対応可能です。
🚀 使い方は3ステップ
-
エラー文を貼り付ける（省略可）
空欄でも問題ありませんが、あると ChatGPT の精度が上がります。 -
該当ソースコードファイルを選択する
ローカルファイルを選ぶだけで、自動的に行番号付きで表示されます。 -
「プロンプトをコピー」ボタンを押すだけ！
あとは ChatGPT に貼り付けて質問するだけです。
🎯 こんな方におすすめ
・エラー解決のたびにプロンプトを書くのが面倒
・プロンプトのテンプレを毎回探している
・初心者だけど、AIを活用して学習したい
📌 技術的な補足（開発者向け）
このツールは HTML + JavaScript（Vanilla JS）で構成されており、以下のような技術を使っています：
・FileReader API でローカルファイル読み取り
・自動的に行番号を付加
・navigator.clipboard.writeText によるコピー操作
・入力欄や表示はプレーンな HTML/CSS でシンプルに構成
ソースは GitHub Pages 上で公開 しているため、ローカル環境不要でそのまま使えます。
※情報漏洩が心配な方は、GitHub Pages 上の index.html をローカルにダウンロードし、そのソースコードを ChatGPT に貼り付けて「情報を送信するような処理が含まれていないか」を確認したうえで、ローカル環境でご利用いただくことをおすすめします。
なお、本ツールは GitHub Pages で公開しているため、もし情報を抜き取るような処理が含まれていれば誰でもソースコードを見て簡単に気付くため、その点はご安心いただければと思います。
🙌 最後に
「プロンプトを書く」という作業が少しでも楽になり、皆さんが ChatGPT を活用する時間がより快適になれば、とても嬉しいです。
ご意見やフィードバックがあれば、ぜひコメントで教えてください！
追記
この文章は ChatGPT で添削しています。
生成 AI による添削が苦手な方は申し訳ありません。