An isometric city builder in React — finished, playable, and small on purpose

Not every entry in this archive is a research push or a client delivery. Some are just a good weekend problem, finished properly — this is one of those, kept on the record because it's real, complete, and playable.

What it was

A browser-based isometric city-builder game: place buildings, manage a small economy, and watch five resource systems — money, population, happiness, power, and water — respond to each other in real time, in the classic SimCity-adjacent mould.

What we built

✅Shipped & measured

A complete, working game in React 18 and TypeScript, built with Vite and state-managed with Zustand. Building placement drives an isometric grid; each placement updates the five resource systems, which in turn affect each other (power shortages dent happiness, population growth strains water, and so on) — a small but genuinely interacting simulation loop, not a static scoreboard.

The real test wasn't the game design, it was the plumbing: could React — a framework built primarily for forms, dashboards, and content-driven UI — hold up under a real-time, frequently-updating game loop without turning into a performance mess?

What we learned — including the honest negative(s)

It held up well, and the specific finding worth recording is about the state layer, not the rendering: Zustand was a strong fit for state that changes fast and often. Its minimal-boilerplate, subscription-based model avoided the re-render overhead that a heavier state library (or naive prop-drilling) would have introduced under a real-time simulation loop.

The honest edge is scope, plainly stated: this is a toy and a learning project, not a commercial game. There's no content pipeline, no balancing pass beyond "it feels fun to play," and no attempt to stress-test the isometric renderer or the resource simulation beyond a single pleasant build. It was never meant to compete with a real city-builder — it was meant to answer one narrow architectural question, and it did.

Where it went / status

Finished, working, and archived as-is — no further iteration planned. Its value sits next to the more ambitious, unfinished entries elsewhere in the record: proof that a small, honestly-scoped project, taken to completion, is its own kind of result, not a lesser one.