Debug Like a Pro

Debugging is where vibe coding really shines. Instead of spending hours searching Stack Overflow, you describe the problem and Claude fixes it.

The Debug Prompt Template

What I expected: [describe expected behavior]

What happened: [describe actual behavior]

Error message: [paste exact error if any]

Steps to reproduce: [how to trigger the bug]

Common Debugging Scenarios

"It's not showing up"

"The button I added isn't appearing on the page. Can you check if it's being rendered and if there are any CSS issues hiding it?"

"It works sometimes"

"The form submits correctly sometimes but other times nothing happens. Can you add console.logs to help debug the flow?"

"It looks wrong"

"The layout breaks on mobile. The cards stack but there's no padding. Can you fix the responsive styles?"

💡 Pro Tip

Ask Claude to add "debug mode" — console.logs or visual indicators that help you understand what's happening. Remove them once the bug is fixed.