League Island — Multi-Tenant Tournament Management Platform
Full-stack SaaS for esports and sports leagues: branded host sites, tournament lifecycle (registration, brackets, scheduling, live scores), Riot API integration for League of Legends, pickleball live scorekeeping, Discord automation, broadcast overlays, and Stripe Connect for paid team registration.
- Next.js
- React
- TypeScript
- Tailwind CSS
- Supabase
- PostgreSQL
- NextAuth.js
- Stripe
- Riot Games API
- Discord
- Server-Sent Events
- Recharts
- Jest
- Zod
- Vercel
Overview
League Island is a multi-tenant tournament and league operations platform I built to replace spreadsheets and fragmented tools for organizers, players, and production staff. Each host (league brand) gets a themed public site at /{host-slug} plus a full admin console for running events end to end.
Problem
Tournament organizers juggle registration, rosters, schedules, brackets, match results, Discord comms, and stream overlays—often across docs, bots, and manual updates. Players need one place to register, see schedules, and follow live results.
What I Built
Multi-tenant host sites
- Approval-based host onboarding with custom branding (logo, colors, theme editor)
- Public hubs for tournaments, teams, matches, and players
- Host-scoped routing and role-based access (platform admin, host admin/staff, players)
Tournament operations
- Creation wizard with templates (standard league, single/double elimination, Swiss)
- Stages: round robin, brackets, Swiss; registration settings, team approval workflows
- Match scheduling with conflict detection, schedule optimization, and reminder crons
- Real-time updates via Server-Sent Events (scores, bracket advancement, live badges)
Game-specific depth
- League of Legends: Riot tournament codes, game import, Match-V5 timelines, public analytics charts (Recharts), rank verification
- Pickleball: Live scorekeeping, rally-level persistence, spectator views
Integrations & production
- Discord OAuth, channels, roles, match reminders, and slash commands
- Broadcast overlay control board for stream production
- Bracket and match-result share graphics (server-generated PNG via Next.js OG)
- In-app messaging, notifications, and a help center with 89+ articles
Payments (in progress / partial ship)
- Stripe Connect Express for hosts, Checkout for team registration fees
- Platform fee configuration, webhooks, refunds, and Stripe Tax on checkout
Technical Highlights
- Next.js App Router with TypeScript, API routes, and server components
- Supabase (PostgreSQL) as the system of record with a large migration-driven schema
- NextAuth.js for authentication; host-scoped player identities
- Idempotent Stripe webhooks, fee math in integer cents, and product gates before enabling paid registration
- Derived timeline analytics with caching; SSE with polling fallback for reliability
Outcome
A single platform where organizers can launch a branded league, run registration through finals, and keep players and spectators in sync—without leaving the product for brackets, schedules, or LoL-specific Riot workflows.