DEV Community

WikiMasters Game Studio
WikiMasters Game Studio

Posted on

Building a Wikipedia Trading Card Game: How We Built WikiMasters on TanStack Start & Cloudflare Edge

#architecture #frontend #gamedev #webdev

Building an engaging web game is a journey of performance, gameplay balance, and real-time multiplayer synchronization. Today, we want to share the design and technical architecture behind WikiMasters (available to play at https://wikimasters.org), a bilingual Wikipedia Trading Card Game (TCG) where encyclopedic history, science, philosophy, and nature are transformed into collectible, strategic game cards.

1. The Vision: Knowledge as a Collectible Card Game

Digital trading card games often suffer from static card pools and repetitive meta cycles. We asked ourselves: What if every historical event, quantum physics theorem, ancient dynasty, and literary masterpiece in human history could be an evolving collectible card?

In WikiMasters:

  • Card Packs & Booster Openings: Players unbox themed boosters ranging from Ancient Roman Dynasties to Quantum Computing & Information Theory.
  • Live Quiz Duels: Battles are fought on contextual card placement and real-time knowledge trivia.
  • Global Card Market: Players trade, auction, and collect foil cards in a player-run economy.
  • Guild Collaborations: Guilds pool knowledge research points to unlock legendary historical archives.

2. High-Performance Serverless Stack

To provide instant load times, zero-latency transitions, and global low-latency multiplayer rooms, we architected the game on an edge-native stack:

  1. Framework: Full-stack React 19 + TanStack Start for server functions and SSR.
  2. Global Edge Execution: Cloudflare Workers serving compute across 300+ edge locations worldwide.
  3. Database & Persistence: Cloudflare D1 (distributed SQLite) for transactions, pack RNG generation, and card inventory.
  4. Asset Distribution: Cloudflare R2 for card art delivery with WebP/AVIF optimizations and edge caching.

3. Try It Out!

The game is open to play with zero installation required:

We would love to hear feedback from fellow developers and game designers on our card-drafting mechanics and edge architecture!

Top comments (0)