エラー調査テンプレート：何を見て、何を貼って、どう質問するか

入門 | 9分 で読める | 2026.07.09

公式ドキュメント

今回やること

エラー調査で大事なのは、最初から答えを当てることではありません。

何が起きたかを、他人が再現できる形に整理することです。

この記事では、質問前に集める情報と、貼るテンプレートを整理します。

まず見る場所

Webのエラーでは、まず次を見ます。

場所見るもの
画面何が起きているか
ConsoleJavaScriptエラー
Network通信、status、Response
ElementsHTML/CSSの状態
ApplicationlocalStorage、Cookie

全部を毎回見る必要はありませんが、画面だけで判断しないことが大切です。

質問テンプレート

## やりたいこと

例：問い合わせフォームを送信したい

## 起きていること

例：送信ボタンを押すと「送信に失敗しました」と出る

## 期待する動き

例：送信後に完了メッセージを表示したい

## 再現手順

1. /contact を開く
2. フォームに入力する
3. 送信ボタンを押す

## Consoleのエラー

```text
ここにエラー文を貼る
```

## Networkの情報

- Request URL:
- Method:
- Status:
- Response:

## 該当コード

```js
ここに関係するコードを貼る
```

## 試したこと

- パスを確認した
- console.logで値を見た
- Networkでstatusを見た

やりたいこと

最初に「何を作ろうとしているか」を書きます。

悪い例:

動きません

よい例:

Todoアプリで、削除ボタンを押したら該当行を消したいです。

目的が分かると、回答者は正しい方向で見られます。

起きていること

実際に起きていることを書きます。

例:

  • ボタンを押しても何も起きない
  • 404が出る
  • ConsoleにTypeErrorが出る
  • APIは200だが画面に表示されない

「おかしい」ではなく、観察できる事実を書きます。

ConsoleとNetwork

Consoleのエラーは全文を貼ります。

TypeError: Cannot read properties of null (reading 'addEventListener')
    at main.js:12:8

Networkでは、最低限これを見ます。

  • Request URL
  • Method
  • Status Code
  • Response

API相談では、Responseに原因が書かれていることが多いです。

試したこと

試したことを書くと、同じ確認を繰り返さずに済みます。

例:

  • セレクタ名を確認した
  • ファイルパスを確認した
  • console.log で値を見た
  • Networkで404を確認した
  • 別ブラウザでも試した

「何もしていません」でも、正直に書いた方が次の手順を出しやすくなります。

貼ってはいけないもの

秘密情報は貼りません。

  • APIキー
  • パスワード
  • Cookie
  • 認証トークン
  • .env の値
  • 個人情報

必要なら、値を伏せます。

Authorization: Bearer ***masked***

注意: エラー調査のためでも、秘密情報をそのまま貼らないでください。再発行が必要になることがあります。

まとめ

エラー調査では、やりたいこと、起きていること、期待する動き、再現手順、Console、Network、該当コード、試したことを整理します。

テンプレートに沿って質問すると、AIにも人間にも伝わりやすくなり、原因に早く近づけます。

次に読む記事

おすすめ記事

← 一覧に戻る
PR
PR
PR
PR