Back to Projects

Live Casino Platform

Enterprise Live Casino with Real-Time Betting (NDA)

Overview

Enterprise live casino spanning 3 codebases: business logic engine (953 TS files), React 18 client (20+ games), and 505-component design system (379 Storybook stories). Inversify DI at root/session/game levels, MobX + RxJS for reactive real-time state, gRPC-Web streaming for live table updates, and optimistic betting with server reconciliation. Pixi.js and Konva handle graphics-heavy game rendering.

Key Features

  • 3 codebases: 953-file engine library, React 18 client, 505-component design system
  • gRPC-Web streaming with Protocol Buffers for type-safe real-time server communication
  • Inversify DI hierarchy (Root → Session → Game) managing service lifecycle and disposal
  • Optimistic betting: instant balance deduction, server reconciliation, rejection rollback
  • 20+ games: Baccarat, Blackjack, Roulette, Crash, Plinko, Dragon Tiger, and more
  • SWC compiler + code splitting for fast builds and on-demand game loading

Tech Stack

Architecture

Inversify 6gRPC-WebProtocol BuffersWebpack 5SWC

Frontend

React 18TypeScript 5.5MobX 6RxJS 7SCSS Modules

Graphics

Pixi.js 8KonvaFramer MotionGSAP

Design System

Storybook 9505 Components379 StoriesDesign Tokens

Challenges & Solutions

gRPC Streaming Resilience

Problem

Live dealer games require continuous bi-directional gRPC streams — network interruptions would lose game state and disconnect players mid-round.

Solution

RxJS-based auto-reconnect with state preservation: streams automatically re-establish on disconnect, replay missed events, and reconcile with current server state. Error logging to Kibana for monitoring stream health across thousands of concurrent players.

Optimistic Betting with State Consistency

Problem

Server round-trips of 100-500ms would feel sluggish for real-time betting — but optimistic updates create race conditions where responses could reference different game rounds, causing balance inconsistencies.

Solution

Multi-layer bet synchronization with explicit round context in every server response. Balance deducted immediately on bet placement, reconciled on server confirmation, restored on rejection. MobX computed properties automatically derive UI state from the latest consistent snapshot.

Three-Level DI Container Lifecycle

Problem

20+ games share common infrastructure (auth, player, money) but each has unique stores and services — managing instantiation, disposal, and memory cleanup across game switches was complex.

Solution

Inversify DI hierarchy: RootContainer (app-level singletons), SessionContainer (auth/player), GameContainer (per-game stores). IOCModuleDescriptor pattern with autoInstantiate array. Container disposal on game exit prevents memory leaks — each level cleanly unbinds its services.

Key Achievements

3 Codebases
Engine, client, and design system repositories
gRPC-Web
Protocol Buffers streaming with auto-reconnect
Inversify DI
Three-level container hierarchy with disposal
20+ Games
Live dealer and first-person games