Lesson format
Reading lesson with structured written material and clear navigation inside the course flow.
Reading lesson with structured written material and clear navigation inside the course flow.
This lesson is free and open to all visitors.
The difference between a frustrating Claude Code session and a magical one usually comes down to one thing: how you ask. The quality of your prompt directly determines the quality of Claude's output. In this lesson, you'll learn the patterns that separate beginners from power users.
Let's start with what NOT to do. These prompts produce vague, wrong, or incomplete results:
These prompts fail because they assume Claude has the same context as you. It doesn't. Claude reads your files but doesn't know what you're looking at, what you just tried, or what "it" refers to.
A good prompt includes four elements: What, Where, Why, and How to verify.
Compare this transformation:
| Bad Prompt | Good Prompt |
|---|---|
| "Fix the login" | "In src/auth/login.ts, the handleSubmit function throws a TypeError when email is empty. Add validation before the API call to check that email is a non-empty string." |
| "Add a button" | "In src/components/Header.tsx, add a 'Sign Out' button next to the user avatar. Use the LogOut icon from lucide-react. On click, call the signOut() function from next-auth." |
| "Make it responsive" | "The pricing cards in src/landing/Pricing.tsx stack vertically on mobile but the gap is too large. Change the gap from gap-8 to gap-4 on screens below md breakpoint." |
| "It doesn't work" | "Running npm run build fails with 'Module not found: @/lib/stripe'. I removed the Stripe integration yesterday. Find all remaining imports of @/lib/stripe and remove them." |
| "Add dark mode" | "Add a dark/light mode toggle to the Settings page at src/app/settings/page.tsx. Store the preference in localStorage under key 'theme'. Use the Sun and Moon icons from lucide-react for the toggle." |
| "Write docs" | "Create JSDoc comments for all exported functions in src/lib/utils.ts. Include @param types, @returns description, and a one-line @example for each function." |
Every prompt should answer three questions:
For example: "In src/components/PaymentForm.tsx, change the currency display from USD to the user's locale currency. We're expanding to international markets and users are confused by dollar signs."
The "why" (international expansion, user confusion) helps Claude make decisions you haven't explicitly stated — like also updating error messages and confirmation text to be locale-aware.
One of the most powerful habits is referencing files by their exact path:
// Instead of:
"Update the header component"
// Say:
"In src/components/layout/Header.tsx, add a notification bell icon
between the search bar and user avatar"When you name the file, Claude immediately reads it, understands the existing code structure, and makes changes that fit perfectly. Without a file path, Claude might find the wrong file, create a new one, or make changes that conflict with existing code.
This is the single most underrated prompting technique. Compare:
What only: "Add a 2-second delay before the API call in handleSubmit."
What + Why: "Add a 2-second debounce before the API call in handleSubmit. Users are accidentally double-submitting the form, causing duplicate payments."
With the "why", Claude might also add a loading state, disable the button during submission, and add an idempotency key — all without being asked. It understood the real problem, not just the surface-level fix.
Perfect prompts on the first try are rare. The real skill is in the iteration loop:
Each iteration gets you closer to exactly what you want. Don't try to describe everything perfectly upfront — it's faster to iterate in 2-3 rounds than to write a 500-word prompt.
Here are advanced prompting patterns used by experienced Claude Code users:
Even experienced users fall into these traps:
The best prompt is the one that would make sense to a talented colleague who's new to your project. Specific, contextual, and purposeful.