Build a habit tracker
One tap a day, a year heatmap, and no midnight bug.
The tracker you'll keep using is one HTML file with localStorage. It loads instantly, works offline and needs one tap.
The trap is dates. Agents reach for UTC, so depending on where you live your streak dies at 5 p.m. or survives until 8 a.m. Prompt 2 makes the agent prove it got this right.
The spec and the cuts
- One HTML file, localStorage only. Your data stays on your machine. Export is a JSON download.
- One habit by default. Trackers die of ambition. The toggle below adds more if you want them.
- One tap for today. A big "done today" button is the whole interface. The heatmap is the reward.
- Cut: accounts, sync, chart libraries, confetti and notifications (a permission prompt gets apps uninstalled).
The prompts
Tick what you want and the prompts change to match. Paste them into your agent one at a time, in order. Don't skip prompt 2: it checks the date math and fixes what it finds.
The copy buttons grab the current version.
1 · Build it
2 · Prove the dates are right
3 · Put it where you'll open it
4 · Get human eyes on it
Where agents go wrong
- The midnight bug.
new Date().toISOString()is UTC, so streaks built on it break at your timezone's offset. Use local date strings. It's the bug I see most in vibecoded trackers. - Clever state. You need a flat map of
date → done. Streaks are computed and never stored. - Trusting localStorage. It can be cleared or corrupted. A
try/catchand a versioned key (habits-v1) turn a crash into "weird, it reset". - Heatmap off-by-ones. Week alignment, leap days and month labels usually drift a cell. Prompt 2 checks the corners.
- Gamification creep. Badges and streak-freeze tokens slow the page down. The product is the unbroken row of green.
Why prompt 4 is in the plan
A friend can tell you in thirty seconds whether today's state is obvious and the button sits under your thumb. That decides whether you still use it in week two. Prompt 4 connects your agent to my MCP server, which shares the live page. Someone pins notes on it, and your agent applies the ones you approve.