debugging
Scannednpx machina-cli add skill DojoCodingLabs/code-sensei/debugging --openclawDebugging — CodeSensei Teaching Module
What is Debugging?
- Analogy: Debugging is detective work. Something isn't working, and you need to find out why. Every error message is a clue.
- Key insight: Errors are NOT failures. They're the computer telling you exactly what went wrong and where. Learning to read errors is the single most valuable programming skill.
How to Read Error Messages
Teach users to look for these three things in EVERY error:
- What happened — the error type (TypeError, SyntaxError, 404, etc.)
- Where it happened — the file name and line number
- Why it happened — the description message
Example:
TypeError: Cannot read property 'name' of undefined
at UserCard (src/components/UserCard.jsx:12)
Translation: "On line 12 of UserCard.jsx, you tried to get .name from something that doesn't exist yet."
Common Error Types (teach as encountered)
Frontend Errors
- "Cannot read property X of undefined" — you're trying to use data that hasn't loaded yet. Like trying to read a book that hasn't been delivered.
- "X is not defined" — you're using a variable/function that doesn't exist. Likely a typo or missing import.
- "X is not a function" — you're trying to call something as a function, but it's not one.
- White screen of death — usually a component crashed during rendering. Check the browser console.
Backend Errors
- 404 Not Found — the URL/route doesn't exist. Like going to a room number that doesn't exist in the building.
- 500 Internal Server Error — something broke on the server. Check the server logs.
- 401 Unauthorized — you're not logged in (or your token expired).
- 403 Forbidden — you're logged in but don't have permission.
- CORS error — your frontend is trying to talk to a backend that doesn't trust it. Like calling a secure building and not being on the approved list.
Database Errors
- "relation X does not exist" — the table hasn't been created yet. Run your migrations.
- "unique constraint violation" — you're trying to add a duplicate entry (like two users with the same email).
- "null value in column X violates not-null constraint" — you forgot to include a required field.
The Debugging Mindset
- Don't panic — errors are normal. Every developer sees them constantly.
- Read the error — the answer is usually right there in the message.
- Google the error — copy the exact error message. Someone has had this problem before.
- Check what changed — what did you (or Claude) do right before it broke?
- Isolate the problem — narrow down which part is broken.
Teaching Opportunity
Every error is a learning moment. When Claude fixes an error, explain:
- What the error meant
- Why it happened
- How it was fixed
- How to prevent it next time
This is where real engineering intuition is built.
Source
git clone https://github.com/DojoCodingLabs/code-sensei/blob/main/skills/debugging/SKILL.mdView on GitHub Overview
Debugging is detective work where errors are clues. It teaches you to read messages, understand what went wrong, and fix bugs efficiently. This module covers reading error messages, common error types, and the mindset for diagnosing issues.
How This Skill Works
It centers on three things in every error: what happened, where it happened, and why it happened. By using the exact error message, the file and line, and the description, you locate the root cause and implement a fix.
When to Use It
- When a frontend error shows up in the UI (e.g., TypeError or undefined data).
- When an API call returns HTTP errors like 404, 500, or CORS issues.
- When a page crashes during render causing a white screen.
- When database errors occur, such as missing relations or constraint violations.
- When you need to isolate changes and verify what broke after a code modification.
Quick Start
- Step 1: Read the error message and identify what happened, where, and why.
- Step 2: Check recent changes and reproduce the issue.
- Step 3: Isolate the failing part, implement a fix, and verify the fix with tests or logs.
Best Practices
- Read the error and extract what happened, where, and why.
- Use the exact error message—Google it if needed.
- Check what changed right before the break.
- Isolate the problem to a specific component or module.
- Reproduce, fix, and add checks to prevent recurrence.
Example Use Cases
- TypeError: Cannot read property 'name' of undefined in UserCard.jsx:12
- "X is not defined" error from a missing import or typo
- "X is not a function" when calling a non-function
- 404 Not Found when a route doesn’t exist
- "relation X does not exist" in a database query