Day 02 of 21
The 4-part prompt formula that gets results every time
Goal: Vague prompts get vague results. Today you learn the formula that tells Claude Code exactly what to build and use it to create your first real webpage.
What to do
Navigate to your project folder
Open your terminal. Type this command and press Enter. Replace "YourName" with your actual Mac username, or on Windows use the path to your Desktop:
cd ~/Desktop/my-first-siteStart Claude Code
In the terminal, type:
claudeLearn the 4-part formula
Before typing anything, read these four parts. Every prompt you write should have all four: Part 1 — Context (what already exists). Part 2 — Ask (one specific thing only). Part 3 — Details (exactly how it should look or work). Part 4 — Constraint (what NOT to change).
Write your first 4-part prompt
Type this prompt into Claude Code, filling in your own details where shown:
I am starting a new website from scratch — this folder is empty. Build a homepage with: a navigation bar with links for Home, About, and Contact; a hero section with a heading that says "Welcome" and a short paragraph underneath; a button that says "Learn more". Keep the design clean, minimal, and modern. Do not add anything I have not asked for.Preview the result in your browser
What Claude Code built determines how you preview it. Type this to find out:
How do I view what you just built in my browser? I am a non-developer. Give me the exact steps for my operating system.Expected result
You used the 4-part formula to build your first real webpage and previewed it in a browser.
Key takeaway
- Vague prompts get vague results. The 4-part formula, Context, Ask, Details, Constraint, gives Claude Code everything it needs to build exactly what you want.