Alphabet Runner screenshot

Alphabet Runner

A dynamic web-based word-building game with real-time multiplayer scoring and interactive card-based gameplay.

View Project

Tech Stack

Frontend

React 16.8Gatsby 2.3SCSS/SassBootstrap 4.3

Backend

Firebase Realtime DatabaseFirebase App

Key Libraries

React BootstrapFontAwesomeReact ConfettiReact Timer HookDay.js

Build Tools

Gatsby plugins (Sharp, PostCSS, React Helmet)Node.js

Key Features

  • Interactive Card Gameplay: 14 alphabet cards with color-coded letters for strategic word building

  • Real-time Leaderboard: Firebase-powered score tracking with live updates and player rankings

  • Progressive Difficulty: Multiple game levels with varying word length requirements (3-4 letters)

  • Responsive Design: Mobile-optimized interface with adaptive layouts and touch controls

  • Game State Management: Comprehensive state handling for cards, scoring, timers, and player progression

Notable Challenge

Implemented complex card distribution logic ensuring unique card selection across hand, play area, and nominated cards while maintaining game balance. Solved through iterative card validation and collection management to prevent duplicate cards from appearing in multiple game zones simultaneously.

Result / Status

Successfully deployed interactive word game with real-time multiplayer functionality, featuring a complete game loop with scoring, timer integration, and responsive design optimized for both desktop and mobile play.