ec708ba943
Complete companion repo for "Your First Hour with Claude Code" article. Includes step-by-step prompts, example output, troubleshooting, and cost guide. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
33 lines
1.2 KiB
Markdown
33 lines
1.2 KiB
Markdown
# Prompt 02: Add Categories
|
|
|
|
Copy and paste this into Claude Code:
|
|
|
|
---
|
|
|
|
Add color-coded categories to the todo app. Requirements:
|
|
|
|
- Four categories: Work (blue #5B9FD6), Personal (green #4DB8A4), Health (orange #E87020), Learning (purple #A87BDB)
|
|
- When adding a task, show a dropdown to pick the category
|
|
- Each task shows a small colored dot or badge indicating its category
|
|
- Add filter buttons at the top: "All", "Work", "Personal", "Health", "Learning"
|
|
- Clicking a filter shows only tasks in that category
|
|
- "All" shows everything
|
|
- Active filter button should be visually highlighted
|
|
- Categories are saved in localStorage along with the tasks
|
|
- Keep the existing dark mode design
|
|
|
|
---
|
|
|
|
## What Happens
|
|
|
|
Claude Code reads the existing `index.html`, understands the current structure, and adds the category system without breaking anything that already works.
|
|
|
|
This is the agent loop in action: it does not start from scratch. It reads what exists, plans the changes, and edits precisely.
|
|
|
|
## What to Expect
|
|
|
|
- A category dropdown appears next to the task input
|
|
- Colored filter buttons appear above the task list
|
|
- Each task shows its category color
|
|
- Switching filters instantly shows/hides tasks
|
|
- Old tasks (without categories) still work
|