button.button, a.button.button--primary { background-color: #F5F527; color: #0D0D00; }

Recommended Tech Stack

Frontend

- Next.js for a fast, responsive interface

- Tailwind CSS for styling

Backend

- Supabase (recommended) or Firebase for real-time updates, authentication, file storage, and serverless functions

Hosting

- Vercel for the web app and Supabase.com for the database. Vercel | Supabase

Integration

- Shopify for e-commerce

- Custom API endpoints for event registration and purchases

Architecture Considerations

Unified vs Separate Domains

- Unified: everything merged into one platform

- Separate (recommended): a dedicated scoring domain for the app and a main domain for the website and e-commerce. This keeps the custom logic isolated, improves performance, and allows easy content updates through a CMS without touching any code.

 

Real-Time Leaderboard

- Supabase real-time listeners or Firebase listeners for instant updates