Hands-on Lab 2 · ~50 min

Write agents.md, then build in YOLO mode

Step up from a browser toy to a real local build. You’ll author your own agents.md, drive Cursor through plan → build → test, and refine a working drag-and-drop Kanban app with targeted feedback.

🎯 Outcome: a running Kanban app you steered⏱ ~50 min🧰 Cursor + Node v22+

Prerequisites

Cursor installed, signed in, and Node v22+ available (node --version). If you haven’t set these up, walk through 4.1 Tools & setup first.

01Make a project & write agents.md · 12 min

Create a new folder (e.g. kanban), open it in Cursor, and add a file called agents.md in the root. Write your own — start from this and change anything you like:

agents.md

# Kanban project

## Business requirements
- An MVP of a Kanban-style project-management web app.
- One board. Five fixed columns that can be renamed.
- Each card has a title and details only.
- Drag-and-drop to move cards between columns.
- Add a card; delete a card. No archive, no search.
- Priority: a slick, professional UI. Open with dummy data.

## Technical details
- A Next.js app in a subdirectory called `frontend`.
- No persistence. No user login. Simple, popular libraries.

## Strategy
- Write a phased plan with success criteria to check off.
- Scaffold, unit-test, execute, then integration-test with Playwright.
- Only complete when the MVP runs and is tested.

## Coding standards
- Latest, idiomatic library versions. Keep it simple; never over-engineer.
- Be concise. Short README. IMPORTANT: no emojis, ever.

Writing tips (from Class 3)

Be precise and low-ambiguity. Favour positives over “don’t” lists. Put IMPORTANT in caps for the rules you care about most. A little repetition on key points is fine — this file is precious context, so make every word count.

02Set your risk level · 3 min

Open settings (⌘/Ctrl ⇧ J) → Agents → Auto-run. For this low-risk project, YOLO (run everything, unsandboxed) is fine and lets you walk away. Not sure? Start on ask every time or sandboxed and approve steps as you watch.

03Plan, then build · 20 min

Plan mode

Set the agent dropdown to Plan, leave the model on auto, and type go ahead and plan. It loads your agents.md automatically and writes a phased implementation plan. Skim it (or trust it).

Build

Press Build. Watch files appear and the context meter climb. You’ll see the agent loop in action — writing, running tests, seeing failures, fixing them.

Run it

It may launch the app itself. If not, run it: cd frontend then npm run dev, and open localhost:3000.

Cursor terminal

$ cd frontend
$ npm run dev
  ▲ Next.js — ready on http://localhost:3000

04Test & give feedback · 12 min

Put the app through its paces, then hand the agent specific feedback in one message:

Drag a card between columns.
Add a card; delete a card.
Rename a column.
Try reordering cards within a column.

agent · feedback

It’s mostly working, but:
• There’s a Next.js error indicator at the bottom of the screen.
• Drag-and-drop is janky, and I can’t reorder within a column —
  please make it slicker.
• Add more visual polish (a bit more color and spacing).

It won’t be perfect — that’s the point

The agent may fix most things and miss one. Keep iterating with specific messages, or if it’s badly stuck: delete everything, tighten your agents.md to cover what went wrong, and run again. Simplify, then build back up.

05Reflect & stretch

✓ You practised the full IDE rhythm

Authoring a tight agents.md that steers the whole build.
Planning first, then building in YOLO mode.
Reading the agent loop and the context meter as it works.
Refining with targeted feedback instead of touching code.

Stretch goals (optional)

Ask for a card-count badge per column · add a colored label/tag to cards · a “clear board” button with confirmation · try the same agents.md in a different tool (Copilot, Codex) and compare. Notice how much your agents.md — not the tool — shapes the result.