Day 9 — Pairing With an AI (Without Losing the Plot)
Today wasn’t about a giant feature drop—it was about how a human–AI pair worked together to ship the right things and get un-stuck fast.
The jam session, not the checklist
Instead of obsessing over a bullet list of UI widgets, the pair treated the work like a jam:
- The human set the product intent (“Invites should feel native, not tacked on.”).
- The AI sketched options and trade-offs (what to gate, what to defer).
- The conversation stayed anchored to the user flow, not code golf.
That rhythm turned a rough “Create Square” form into a coherent flow with invites and helpful copy—without spiraling into yak-shaving.
React errors & the “don’t hallucinate” rule
Opaque React errors (those minified numbers) are where an AI can drift—proposing plausible but irrelevant fixes. The human pulled the AI back to the actual render path and insisted on proof.
Shared debugging playbook:
- Reproduce on the real route that breaks.
- Binary-search the UI: swap custom parts with native tags to isolate the culprit.
- Stub first, re-introduce slowly.
- Use console breadcrumbs, not vibes.
- Touch only files on the execution path.
That discipline turned “mystery #130” into a straightforward fix; the build went green the moment a misplaced file was moved.
Keep the chat history
A surprise hero was the saved chat. Earlier sessions had removed 'use client'
in specific places—on purpose. Having the receipts stopped regression and prevented undoing good changes.
Mini-practice: keep a tiny changelog inside the chat—what changed, why, and whether it’s final or experimental.
Vibe-coding is a partnership
“Vibe-coding” works when the human leads with product intuition and reality checks, and the AI proposes concrete options:
- The human set guardrails (“don’t chase files we didn’t touch”).
- The human kept the flow honest (“Manager → Create → Form”).
- The human made the calls on UX semantics (invites can be staged but only send after the square exists).
The AI moved fast, but the human decided what mattered. That’s how a tight loop ships useful code instead of clever detours.
Patterns to keep
- Gate actions on existence. No sending invites until a square exists. Predictable and safe.
- Inform, don’t block. Grey “already invited” contacts but keep them selectable for re-send.
- Inline education. Tiny “i” helpers and context-aware copy beat long docs.
- Neutral language. Tools support fundraisers or margin—UI doesn’t moralize.
- One path at a time. If a file wasn’t changed, don’t debug it today.
Why today worked
- A shared mental model of the flow.
- Ruthless focus when errors popped up.
- Chat as living documentation.
- Quick product decisions (what to gate, grey, or default).
Tomorrow’s polish will layer on (max squares per player, post-create sending, small UX flourishes), but the real win today was the process: ship with intent, debug with evidence, and keep the loop tight between human and AI.
Top comments (0)