The RCL Portal

The RCL Portal is a comprehensive tournament engine designed to manage the end-to-end operations of the Rotaract Champions League. It serves three distinct user groups-the general public, club representatives, and tournament administrators-through a single Next.js application that handles everything from initial registration and financial tracking to live bracket progression and QR-based check-ins.

I architected the system with deep route-level isolation to ensure a clear separation between the public e-sports arena, the secure club portal, and the high-privilege admin dashboard. A primary engineering challenge was the authentication model; rather than forcing hundreds of users onto a new system, I federated the portal’s auth to the pre-existing District 3220 DBMID API. This allowed club officers to use their canonical credentials while the local Supabase schema layered specific tournament roles and permissions on top.

• Engineered a self-referential bracket system using a recursive PostgreSQL structure that maps parent match IDs to automate tournament progression from group stages through to the finals.

• Implemented a custom client-side caching layer using Jotai and localStorage persistence with category-specific TTLs, reducing database overhead while ensuring near-instant page transitions for administrators.

• Developed a camera-based QR check-in system for on-site player verification, linking generated player lanyards to real-time attendance tracking within the admin dashboard.

• Built a real-time portal control system using Supabase Postgres change subscriptions, allowing admins to toggle registration windows across all active sessions instantly without page refreshes.

• Maintained 100% system uptime while rolling out live feature updates and bug fixes during the event itself, managing high concurrency and 2,300+ registrations without a single data bottleneck.

• Additionally the portal included a Live leaderboard, scoring functionality, event scheduling, finance handling, penalty point appliance (automated), advanced stats.

The UI/UX for every surface was designed by me from the ground up. I created distinct visual identities for each portal: a high-energy, dark-themed interface for the public E-Arena and a data-dense, utility-first layout for the admin dashboard to facilitate rapid scoring and player management.

This project was developed using agentic AI workflows under my structured technical direction and oversight. The platform successfully powered the live event, managing 1,300+ players and providing a zero-manual data handling solution for the tournament’s operations.