Connecting a Frontend Prototype to a Production Multiplayer Platform

The Problem

The original Angular application was built as a frontend-first experience with gameplay logic running entirely in the browser.

As backend services matured, the challenge became integrating persistence, authentication, multiplayer state synchronization, and administrative capabilities without breaking existing gameplay functionality.

Replacing everything at once would have introduced significant risk. The frontend and backend needed to evolve together through a staged integration strategy.

The project required migrating from local state management toward API-driven state management while preserving user experience and maintaining confidence in gameplay correctness.

Technical Leadership

• Defined an incremental integration strategy that minimized risk while connecting frontend and backend systems.
• Identified opportunities to replace local functionality one API at a time rather than attempting a large-scale rewrite.
• Designed API contracts that mirrored existing frontend game actions to simplify migration.
• Introduced authenticated API workflows using Firebase Authentication.
• Expanded the platform beyond gameplay by introducing administration capabilities for managing users and games.
• Coordinated the evolution of frontend, backend, database, and authentication systems into a unified architecture.

What I Did

The integration strategy focused on replacing local functionality incrementally rather than rebuilding the application.

As backend APIs became available, individual frontend responsibilities were migrated one feature at a time. Existing gameplay functionality remained operational throughout the transition, reducing risk and enabling continuous testing.

The Angular application gradually shifted from managing game state entirely in the browser to consuming authenticated APIs responsible for persistence, validation, and multiplayer synchronization.

• Introduced Firebase Authentication and connected frontend user identity to backend authorization.
• Replaced local game creation logic with API-driven game creation workflows.
• Integrated game state retrieval APIs to support persistent multiplayer sessions.
• Connected gameplay actions to backend validation and transaction-safe processing.
• Added APIs for discard pile state, player tableau state, player hands, and overall game synchronization.
• Introduced administration APIs for managing active games and user accounts.
• Migrated persistence from Firestore to PostgreSQL while maintaining frontend compatibility.
• Implemented health checks and API validation endpoints to support deployment and monitoring.
• Refined frontend services to centralize API communication and reduce coupling between components.

Testing and Validation

Validation occurred throughout the migration process by continuously verifying that frontend behavior remained consistent while backend responsibilities expanded.

Because APIs were integrated incrementally, each migration step could be tested independently before proceeding to the next phase.

• Verified authentication workflows across frontend and backend systems.
• Validated API-driven game creation and player joining.
• Confirmed state synchronization between Angular and PostgreSQL-backed game sessions.
• Tested multiplayer gameplay through authenticated API requests.
• Verified administration functionality for users and active games.
• Validated persistence across application restarts and player reconnects.
• Ensured frontend gameplay remained functional throughout each migration phase.

Outcome

• Successfully transformed a frontend prototype into a full-stack production platform.
• Enabled authenticated multiplayer gameplay with persistent state.
• Introduced administration tooling for managing games and users.
• Reduced migration risk through incremental API adoption.
• Established a scalable architecture capable of supporting future features and gameplay variants.
• Created a production-ready foundation connecting Angular, Fastify, Prisma, PostgreSQL, and Firebase Authentication.