Days 4-5: Zero to Live in 48 Hours

In 48 hours, Golf Solitaire went from a card engine to a fully playable, polished, deployed game with its own domain. And the first time I played it, my reaction was: “Holy cow this game is fun!!”

Day 4: Making It Real

The engine was done. The renderer could draw cards. But it wasn’t a game yet. Day 4 was about crossing that line.

The sub-agents crushed through the remaining cards:

Input handling — click detection on the canvas, card selection, stock pile draws
UI controls & overlays — new game button, score display, win/lose screens
Game lifecycle — wiring engine + renderer + input into a playable loop

That last one — the integration card — is where it became real. I hit “New Game,” cards cascaded onto the table, and I could actually play. Click a card, it moves to the foundation. Draw from stock. Try to clear the tableau.

The first version looked rough. Green background, basic card faces, no animations. But it worked.

”Holy Cow This Game Is Fun!!”

That was my actual reaction after playing a few rounds. The game loop is addictive — you’re always one card away from a streak, always hoping the next stock card opens up a run. The simplicity is the genius. No complex rules to remember. Just… play.

I sent Sully my feedback: “Look needs to be sharpened up” and “Make colors colorblind friendly.” Within hours, we had:

Table gradient background (dark green felt look)
Card gradients with subtle depth
Gold borders on face cards
A 4-color suit system for colorblind accessibility (black/green/red/blue)
Underline disambiguation on 6 of 9 suited cards

Day 5: Polish and Ship

Day 5 was all about going from “it works” to “it’s ready.”

Accessibility & Mobile (PR #17):

Full keyboard navigation (arrow keys, Enter, Escape)
Screen reader announcements
Responsive canvas sizing
Favicon

Hints Toggle (PR #18):

A lightbulb button that highlights playable cards
State persisted in localStorage

Animations & UX (PR #19):

Card slide animations with ease-out cubic
Deal cascade (cards fly in one by one)
Confetti explosion on win
Undo button (single-level)
Cursor changes on hover

Google Analytics (PR #20):

Custom game events (game_start, card_move, game_win, game_lose)
Production-only (no tracking on localhost)

SEO (PR #21):

Sitemap, robots.txt, JSON-LD structured data
Optimized meta tags and Open Graph

Going Live

I bought the domain golfsolitaire.free on Namecheap. DNS pointed to Vercel. SSL auto-provisioned. Domain verified via the Vercel API.

The deploy was anticlimactic — in the best way. Push to main, Vercel builds, site is live. No server to manage, no Docker containers, no Kubernetes (ironic for a DevOps guy). Just static files served from the edge.

golfsolitaire.free was live. A real game, on a real domain, playable by anyone in the world.

The Mobile Problem

Then I played it on my iPhone. And the cards were tiny. Huge empty space below the tableau, and 10 card-widths crammed into a 375px screen.

This kicked off a multi-attempt mobile optimization saga:

Attempt 1: Stacked piles above the tableau. Still too small — 7 columns across a phone screen.
Attempt 2: Two-row tableau — 4 columns on top, 3 columns plus piles on bottom. ~70% bigger cards. Better.

I deployed it and went to bed. Mobile card games live and die on mobile layout. This was going to need more iteration.

The Numbers

By end of Day 5:

21 PRs merged
157 tests passing
~22KB JS bundle gzipped
10+ Trello cards shipped
1 live domain
1 fully playable game

All in 48 hours. With one person and an AI assistant.

Takeaway: The gap between “working” and “shipped” is bigger than most people think. Input handling, accessibility, animations, SEO, analytics, mobile layout, deployment — that’s all work that doesn’t show up in a demo but makes the difference between a toy and a product. AI handles the volume; you handle the judgment calls on what “good enough” means.