Debugging when you are stuck

Stuck is normal. Panic is optional. Do these in order.

1. Read the error

Browsers tell you more than you think.

• Open Inspect or Developer tools → Console. The red line is a sentence. Read the file name and the line number.
• null / Cannot read properties usually means querySelector found nothing. Check the id. Check that the script runs after the HTML.
• A blank page often means a missing > or a <script> in the head that dies before body exists.
• “It works on the laptop and not the phone” is often a path (styles.css in the wrong folder) or a missing viewport.

Write down the exact message. Do not paraphrase it into “JavaScript is broken”.

2. Rubber-duck

Say out loud, to a person or a wall:

1. What I wanted the tap to do.
2. What I see instead.
3. The last change I made.

Half the bugs die here. The other half become a question you can ask.

3. Ask an assistant well

Paste the error, the relevant 20 lines, and the device. Not the whole internet.

Job: explain this error, then two things to try
Device: Chrome on Android
Must not: rewrite the whole page, add a framework
Error: [paste]
Code: [paste]

If the first fix fails, say what you tried. Do not start a new chat that forgets the file.

4. When to walk away

Twenty minutes. Then a glass of water. Then one more try. A tired fix at midnight is how you delete the list.