Overview

When building real-time multiplayer web applications, supporting mobile users seamlessly is one of the most critical challenges. For Bilgo, our interactive trivia and competitive learning platform, we recently bridged the gap between our native Android app and our React + TypeScript web client.

While the Android version is currently in the Google Play review pipeline, we rolled out a standalone, signed APK distribution channel coupled with full cross-platform synchronization.

Here is a breakdown of the architectural challenges we solved and how we structured the solution.

The Challenge: Divergent Schemas Across Platforms

During the early stages of development, the Android client and the web frontend stored gameplay progress slightly differently in Cloud Firestore:

Web Client: Stored achievements as key-value maps (achievements: { [id]: { unlocked: boolean, progress: number } }).

Android Client: Persisted achievements as an array of unique identifier strings (unlockedAchievements:…