MnR Hackathon

What was built.
The problem.
Monkey & River and Momentum needed a purpose-built platform to run their annual hackathon — a large-scale event managing roughly 700 student candidates across multiple structured stages. Off-the-shelf tools couldn't accommodate the complexity: dynamic stage configuration, multi-role access control, a live judging and scoring system, and a participant-facing portal that adapted in real time to whatever the admin team configured. Three separate applications were needed, all connecting to a Go/Gin backend API backed by PostgreSQL — and a sole frontend developer was needed to build all of them from scratch.
How it was solved.
Using Lovable — a React, TypeScript, Tailwind, and ShadCN stack — I designed and built all three frontend applications as the sole frontend developer on the project, coming in with no prior Lovable experience and limited Git and Docker knowledge. Admin Portal — the operational nerve centre of the platform, built across eight full phases. Authentication with role-based access (Super Admin vs Scoped Admin) controls what each administrator can see and do. Participant management supports list, search, filter, approve, reject, waitlist, CSV import/export, and manual CRUD operations. A dynamic stage builder allows the MnR team to configure stages, set deadlines, lock and unlock progression, and advance participants through the pipeline. Team management covers creation, editing, approval, flagging, member management, and cross-team movement. A judge management module handles CRUD and activation. The scoring dashboard features configurable criteria, per-team scores, a live leaderboard, and a three-state scoreboard toggle. A communications module supports email templates, bulk sending, and send history. An audit log provides filterable, paginated activity history across the entire platform. Additional features include dark mode, notification flows, password management, and scroll restoration. Participant Portal — the student-facing application, built mobile-first and designed to adapt dynamically to whatever the admin team configures. Authentication includes forgot and reset password flows. A dashboard surfaces a live stage progress tracker. The dynamic stage system renders form fields on the fly based on admin configuration — no hardcoded forms. Team formation allows students to browse teams, send and manage join requests, and handle team lead responsibilities. The scoreboard mirrors the admin's three-state toggle — hidden, judging in progress, or results revealed — in real time. Bulk Email Tool — a standalone internal application for sending branded bulk emails to applicants. Built with full Supabase authentication, a block-based email composer (header, text, image, button, divider, spacer, and footer blocks), CSV recipient management via PapaParse, SendGrid integration via Supabase Edge Function, and full send history tracking. API integration was handled using Claude Code — configuring Docker Desktop to run the backend locally, setting up Bruno for API testing, and working through authentication, CORS, pepper mismatches, port conflicts, and environment variables to connect the real Go/Gin API. The integration addressed a two-step login and workspace selection flow, response envelope unwrapping, URL prefix configuration, and field name mapping between frontend camelCase and backend snake_case. All changes were pushed to GitHub and coordinated directly with the backend team.
What it achieved.
The MnR Hackathon Platform represents a significant body of production-quality frontend work delivered by a single developer using AI-assisted tooling. Three fully functional applications — each with authentication, role management, dynamic data handling, and a polished responsive UI — were designed, built, and integrated against a real backend API. Hundreds of product decisions were made across UX, edge case handling, and frontend-backend coordination, with the platform architected to manage 700+ candidates through every stage of the hackathon lifecycle. With the remaining backend endpoints under active development, the platform is on track to go live for the next annual event — giving Monkey & River and Momentum a purpose-built system that no off-the-shelf tool could have matched.






Built by
Matthew Proudfoot
WordPress Developer and Conductor at Monkey & River, based in Cape Town, South Africa. He builds websites, and leads development teams.

