DEV Community

Nando Rama
Nando Rama

Posted on

Building “Squares” with ChatGPT: From Prompts to a Commercial-Ready App (Days 4–5)

About this journey

I’m a former embedded coder who left Lockheed in the mid-1990s and haven’t seriously coded since. Beyond reading about today’s platforms, I came into this project knowing nothing about React, Next.js, Firebase, Vercel, or modern web app infrastructure. My goal is to have ChatGPT handle 99% of the coding while I guide the design, test the app, and provide feedback. What you’re reading is a day-by-day journal of building “Squares” — a commercial-ready sports squares app — with AI as my development partner.


Days 4–5: Debugging, Refactoring, and Preparing for Deployment

After the whirlwind of Days 1–3 where we got a local prototype running in under 72 hours, the next phase (Days 4–5) was less about flashy new features and more about hardening the codebase, fixing TypeScript/ESLint issues, and preparing for a production-grade deployment on Vercel.

Key Focus Areas

  • Linting and TypeScript strictness: We encountered dozens of any type warnings and unused imports across files like firebase.ts, auth/page.tsx, crypto.ts, and graphics components like FlyingBall.tsx and SquaresGridDemo.tsx. Rather than ignoring these errors, we systematically replaced them with explicit, strongly typed definitions.
  • Crypto utilities: Refactored lib/crypto.ts to properly track salts using WeakMap instead of mutating CryptoKey objects with any. This eliminated no-explicit-any warnings and ensured cleaner key handling.
  • Error boundaries: Updated error.tsx and global-error.tsx to use properly typed props (Error & { digest?: string }) instead of any.
  • Firestore timestamps: Standardized on serverTimestamp() for createdAt, updatedAt, and joinedAt fields in pools.ts, subscriptions.ts, and other data files. This improves consistency and avoids mixing client and server clocks.
  • Stripe setup: Fixed missing dependency issues (Module not found: Can't resolve 'stripe') by installing Stripe properly and ensuring it was listed in package.json.
  • Firebase Admin: We reclassified firebase-admin as a devDependency where appropriate to resolve build issues but also ensured runtime dependencies are in the right place for Vercel.
  • Pre-commit hooks: Cleaned up Husky’s pre-commit script to run linting without blocking commits (warnings don’t prevent progress, but errors are still flagged).

Workflow Refinement

We also refined how ChatGPT provides code changes. Instead of sending full rewritten files (hard to track) or plain prose (easy to miss changes), we settled on diff-style updates with + and - prefixes. This way, I can copy changes directly into Atom, delete the + symbols, and apply them efficiently. It feels like pair programming with a very fast, meticulous partner.

Reflections from Days 4–5

This stretch wasn’t about rapid new features — it was about quality and confidence. Every any eliminated, every unused import cleaned, and every build warning squashed made the app feel more production-ready. It was also when I really saw the rhythm of this collaboration take shape: I provide direction and context, ChatGPT does 99% of the coding, and we iterate until things are stable.

It’s a different kind of software engineering — more like orchestrating and testing than sitting down and grinding through syntax. And frankly, it feels like the future.


✅ Next steps: With linting and type safety under control, the focus shifts to deploying on Vercel with staging Firebase projects and tackling subscription/payment flows end-to-end.

Top comments (0)