Context
What We Built
- Tournament creation, enrollment, and bracket/session management.
- Keycloak-based authentication and role-aware access control.
- Real-time data synchronization with Supabase for active tournament state.
- Custom backend logic for event-specific workflows and rules.
- Responsive frontend focused on fast interaction during live events.
Architecture and Stack
- Frontend: Next.js with Tailwind CSS for a fast, mobile-friendly interface.
- Data layer: Supabase for realtime updates and persistence.
- Auth: Keycloak to centralize login and role management.
- Backend services: Custom API logic for tournament-specific operations.
Build Process
- Core domain first - model tournament entities and lifecycle before UI polish.
- Authentication integration - enforce role-aware paths early to avoid insecure defaults.
- Realtime behavior - add live updates for the pages where users expect immediate state changes.
- Operational hardening - improve reliability around concurrency and match updates.
Challenges and Learnings
- Realtime updates required careful query and subscription design to prevent noisy UI refreshes.
- Tournament state transitions needed strict backend validation to avoid inconsistent matches.
- Keycloak integration improved security posture and taught us practical role-mapping patterns.