148 lines
3.5 KiB
Markdown
148 lines
3.5 KiB
Markdown
# Exercise 02: Control the Loop
|
|
|
|
**Concept:** The Agent Loop (CC-001)
|
|
**Level:** Intermediate
|
|
**Time:** ~15 minutes
|
|
|
|
---
|
|
|
|
## Objective
|
|
|
|
Learn to steer the agent loop instead of just watching it. You will
|
|
use Plan Mode to preview what Claude intends to do before it acts,
|
|
and use /rewind to undo a wrong turn.
|
|
|
|
Exercise 01 showed the loop running freely. This exercise shows you
|
|
the controls.
|
|
|
|
---
|
|
|
|
## Before You Start
|
|
|
|
Confirm you have:
|
|
|
|
- [ ] Completed Exercise 01 (or understand the basic loop concept)
|
|
- [ ] Claude Code open in this directory
|
|
|
|
---
|
|
|
|
## Part A: Plan Mode
|
|
|
|
**Step 1:** Press `Shift+Tab` until the mode indicator shows **plan**.
|
|
|
|
You should see the permission mode change in the bottom bar. In Plan
|
|
Mode, Claude will describe what it plans to do instead of doing it.
|
|
|
|
**Step 2:** Paste this prompt:
|
|
|
|
```
|
|
Create a project structure for a simple blog:
|
|
- A folder called blog/ with index.html, style.css, and posts/
|
|
- An about.html page
|
|
- A README.md explaining the structure
|
|
```
|
|
|
|
**Step 3:** Read Claude's plan.
|
|
|
|
Claude will describe the files it would create, the structure, and
|
|
the content. It will NOT create anything yet. This is the plan.
|
|
|
|
**Step 4:** If the plan looks good, type:
|
|
|
|
```
|
|
Go ahead, execute this plan.
|
|
```
|
|
|
|
Or press `Shift+Tab` back to a normal mode and re-send the prompt.
|
|
|
|
Claude now executes, creating the actual files.
|
|
|
|
**Why this matters:** For complex tasks where a wrong start wastes
|
|
time, Plan Mode lets you course-correct before any files are written.
|
|
|
|
---
|
|
|
|
## Part B: Using /rewind
|
|
|
|
**Step 1:** Give Claude an intentionally vague prompt:
|
|
|
|
```
|
|
Improve the blog project.
|
|
```
|
|
|
|
Claude will likely make some changes you did not expect or want.
|
|
That is the point of this exercise.
|
|
|
|
**Step 2:** After Claude finishes, review what it changed. If the
|
|
changes are not what you wanted, type:
|
|
|
|
```
|
|
/rewind
|
|
```
|
|
|
|
This restores your context to the state before Claude's last action.
|
|
The files are unchanged (Claude did write them), but the conversation
|
|
context is rewound so you can try a different approach.
|
|
|
|
**Step 3:** Now give a more specific prompt:
|
|
|
|
```
|
|
Add a navigation bar to index.html that links to about.html.
|
|
Do not change anything else.
|
|
```
|
|
|
|
Notice how specificity gives the loop better direction.
|
|
|
|
---
|
|
|
|
## Part C: Stopping a Runaway Loop
|
|
|
|
**Step 1:** Give Claude a deliberately open-ended task:
|
|
|
|
```
|
|
Make this blog production-ready.
|
|
```
|
|
|
|
**Step 2:** As Claude starts working (adding frameworks, build tools,
|
|
etc.), press `Escape` to interrupt.
|
|
|
|
Claude stops mid-execution. You can then redirect:
|
|
|
|
```
|
|
Stop. I just want the HTML and CSS to be clean and valid.
|
|
No frameworks, no build tools.
|
|
```
|
|
|
|
---
|
|
|
|
## Expected Output
|
|
|
|
After completing all three parts:
|
|
|
|
- A `blog/` directory with `index.html`, `style.css`, `posts/`, `about.html`, `README.md`
|
|
- You experienced Plan Mode (preview before execution)
|
|
- You used /rewind to undo a vague prompt
|
|
- You interrupted a runaway loop with Escape
|
|
|
|
---
|
|
|
|
## What You Learned
|
|
|
|
- **Plan Mode previews:** Shift+Tab toggles Plan Mode, where Claude describes its plan before acting
|
|
- **/rewind undoes context:** It rolls back the conversation so you can try a different approach
|
|
- **Escape interrupts:** Press Escape to stop Claude mid-loop when it is going in the wrong direction
|
|
- **Specificity guides the loop:** Vague prompts produce unpredictable results. Specific prompts keep the loop on track.
|
|
|
|
---
|
|
|
|
## Clean Up
|
|
|
|
```bash
|
|
rm -rf blog/ about.html
|
|
```
|
|
|
|
---
|
|
|
|
## Next
|
|
|
|
Ready to design prompts that work with the loop? Move to [Exercise 03: Design for the Loop](./03-design-for-the-loop.md).
|