01 What students build
A complete product shipped through prompts: six pipeline columns (Wishlist, Applied, Follow-up, Interview, Offer, Rejected), a slide-over modal for job details, real-time search, dark mode, and JSON export/import for backups. The exercise doubles as a testing lab: every feature the agent generates gets verified by the student.
Kanban Flow
Cards move across six stages with @dnd-kit drag and drop and sortable lists, so the whole pipeline is visible at a glance.
Local-first Storage
Every job record persists to IndexedDB via the idb wrapper. Close the tab, reopen a week later, the board is intact. Nothing is sent anywhere.
Export & Import
One click dumps the full workflow to JSON for backup or moving devices; import restores it, which makes a perfect test target for data integrity checks.
02 Architecture
03 Live demo (simulated with sample data)
This is a UI walkthrough with pre-baked sample data so you can feel the board without installing anything. In the course you run the real Vite dev server on localhost:5174 and every action hits IndexedDB in your own browser.
04 Inputs & outputs
What goes in
- Job details: title, company, URL, salary range, notes, date applied
- Resume version used for each application
- Drag-and-drop stage moves across the six columns
- Search text and an optional imported JSON backup
What comes out
- A persistent Kanban of the entire job hunt, restored on every visit
- Live counts per stage and filtered views by company or title
- JSON export of all tracked jobs for backup or device moves
- A finished app plus a test-ideas list for verifying agent-written code