Ping Pong Scoreboard Tournament score calculator built with AI
Overview
A full tournament manager in the browser
A dark-mode web application for managing ping pong tournaments with scoring, standings, and tiebreaker logic. It runs entirely in the browser as a single-page app with persistent local storage — no backend required.
I built it with Lovable using AI-driven iteration: React and TypeScript for a type-safe UI, Tailwind CSS and shadcn/ui for a consistent dark theme, and utility-first logic for brackets and rankings. It supports 1v1 and 2v2 play, Round Robin and Single Elimination formats, and configurable best-of set counts.
Try the scoreboard
Create a tournament, add players, and track scores — everything runs in your browser.
Features
What it does
Support for 1v1 (individual) and 2v2 (team) formats. Two bracket types: Round Robin (everyone plays everyone) and Single Elimination (knockout). Configurable match formats from best of 1 through best of 7 sets, with dynamic player and team entry and validation.
Set-by-set score entry following official table tennis rules (play to 11, win by 2, deuce handling). Real-time validation blocks invalid scores. Winners are detected automatically from sets won. Match cards show completed and pending status.
Live standings with wins, losses, sets won and lost, and points for and against. Multi-criteria sorting for fair rankings. When a tournament finishes, the winner page includes a small celebration (confetti) to mark the result.
When regular matches are done, ties are detected automatically. You can resolve them with one of three methods: a single decisive head-to-head match, a mini round-robin among tied players, or a mini elimination bracket. Each option includes short explanations. If a tiebreaker round ties again, the flow repeats. Tiebreaker matches are highlighted so they read differently from regular play.
Auto-generated bracket with seeding, byes when the count is not a power of two, and automatic advancement. The bracket view shows rounds, connections, and labels so you can follow the knockout path at a glance.
Tech
How it's built
React 18 with TypeScript, Vite 5, Tailwind CSS v3, and shadcn/ui (Radix UI primitives) for accessible components. React Router for navigation; tournament state persists in localStorage. Core tournament logic lives in pure utility functions — match generation, standings, and tiebreaker detection — kept separate from the UI. The layout adapts between desktop and smaller screens so you can run a tournament on a phone or a large monitor.
