Volleyball Assist
A full-stack tournament management platform for volleyball tournaments, featuring real-time score tracking, intelligent scheduling, and multi-device synchronization.
A full-stack tournament management platform for volleyball tournaments, featuring real-time score tracking, intelligent scheduling, and multi-device synchronization.
Volleyball Assist is a web-based application that streamlines the organization and management of volleyball tournaments. Tournament organizers can create events supporting multiple formats (Round Robin, Pool Play, Single & Double Elimination), while scorekeepers track live scores from any device. The platform handles the complexity of scheduling across multiple courts and time constraints, allowing organizers to focus on running their events.
Live Application: Built as a production-ready SaaS with Stripe payment integration for tournament creation.
| Challenge | Solution |
|---|---|
| Manual Scheduling Complexity | Intelligent scheduling algorithm that automatically assigns matches to courts and time slots while respecting daily time windows, match durations, and team constraints |
| Multi-Format Tournament Support | Unified platform supporting Round Robin, Pool Play, Single Elimination, and Double Elimination formats with bracket advancement logic |
| Real-Time Score Distribution | Firestore real-time listeners synchronize scores instantly across all connected devices—organizers, scorekeepers, and spectators see updates simultaneously |
| Distributed Scorekeeping | Role-based permission system allows multiple scorekeepers to update scores from courtside on any device |
| Tournament Discovery | Algolia-powered search enables participants to find public tournaments; shareable 8-character tournament codes for private events |
| UI Responsiveness During Heavy Computation | Web Workers handle tournament scheduling and preview generation off the main thread, keeping the interface responsive |
┌─────────────────────────────────────────────────────────────────┐
│ Frontend (SvelteKit) │
│ ┌──────────────┐ ┌──────────────┐ ┌────────────────────────┐ │
│ │ Tournament │ │ Real-Time │ │ Web Workers │ │
│ │ Builder │ │ Score UI │ │ (Scheduling Engine) │ │
│ └──────────────┘ └──────────────┘ └────────────────────────┘ │
└─────────────────────────────────────────────────────────────────┘
│
▼
┌─────────────────────────────────────────────────────────────────┐
│ Firebase Platform │
│ ┌──────────────┐ ┌──────────────┐ ┌────────────────────────┐ │
│ │ Cloud │ │ Firestore │ │ Firebase │ │
│ │ Functions │ │ (Real-Time) │ │ Authentication │ │
│ └──────────────┘ └──────────────┘ └────────────────────────┘ │
└─────────────────────────────────────────────────────────────────┘
│
┌──────────────────┼──────────────────┐
▼ ▼ ▼
┌────────────┐ ┌────────────┐ ┌────────────┐
│ Stripe │ │ Algolia │ │ Firebase │
│ Payments │ │ Search │ │ Hosting │
└────────────┘ └────────────┘ └────────────┘
Monorepo Structure:
/web — SvelteKit frontend application/functions — Firebase Cloud Functions (backend API)/common — Shared TypeScript interfaces, models, and scheduling algorithmsThe tournament scheduling engine uses generator functions for memory-efficient processing of large tournaments. It handles complex constraints including:
// Simplified scheduling flow
function* scheduleMatches(matches: Match[], constraints: Constraints) {
for (const match of matches) {
const slot = findAvailableSlot(match, constraints);
if (!slot) throw new SchedulingError('No available slots');
yield { match, slot };
}
}
Firestore listeners provide instant updates across all connected clients. Custom Svelte stores wrap Firestore subscriptions for reactive UI updates:
// Tournament data flows reactively through the component tree
const tournament = createFirestoreStore<Tournament>(`tournaments/${id}`);
// Components automatically re-render on remote changes
CPU-intensive scheduling operations run in dedicated Web Workers to maintain UI responsiveness:
tournament.worker.ts — Full tournament generationtournament-preview.worker.ts — Live preview during configurationShared TypeScript interfaces ensure consistency between frontend and backend:
Security rules enforce:
Built with SvelteKit, Firebase, Stripe, and Algolia