Nonprofit & Community Platforms

Building a Registration Engine for a Growing Community Sports Charity

A modern web platform that turned manual sign-ups into a self-serve registration and payments system for six community sports programs

Building a Registration Engine for a Growing Community Sports Charity

Project Overview

Markham Lawrence Sports United is a newly registered Canadian charity connected to Markham & Lawrence Community United, running six community sports and fitness programs that together serve more than 450 participants a week, from toddlers in Mommy & Baby classes to seniors in fitness sessions. As a young nonprofit, MLSU needed to establish credibility quickly while keeping operations lean enough for a small team to manage. The organization came to EightLabs with a simple ask that carried a lot of hidden complexity: replace an informal, message-based sign-up process with something that looked professional, worked on any device, and didn't require a staff member to manually track who had registered and paid for what. With six distinct programs spanning very different age groups and formats, a one-size-fits-all sign-up form wasn't going to cut it. The goals were threefold: build a public-facing website that reflected MLSU's mission of inclusive, accessible community sport; give families a smooth, guided way to register for programs and pay online; and give MLSU staff an admin dashboard to manage programs, review registrations, and update site content without touching code. The desired outcome was a platform MLSU could grow into — one that could support new programs, new registration formats, and new payment methods as the organization's reach expanded, without needing a developer on call for every change.

The Challenge

Before this project, MLSU had no digital presence and no structured way to capture registrations. Sign-ups happened through phone calls, texts, and word of mouth, which made it difficult to track participant counts, follow up with families, or plan program capacity with any confidence. The six programs also weren't interchangeable from a data-collection standpoint. A Ball Hockey registration needed different information than a Mommy & Baby sign-up, and a generic form would have either collected too little for some programs or annoyed parents with irrelevant fields for others. MLSU needed a system flexible enough to handle program-specific questions without turning into a maintenance burden. On top of that, MLSU wanted to accept payments for both program fees and general donations, but had two different processors already in play for different purposes, which meant the platform needed to support more than one payment path cleanly rather than forcing everything through a single checkout. Finally, as a small charity, MLSU didn't have in-house technical staff. Any content updates, new program listings, or link changes needed to be something the team could handle themselves through a simple interface, not a support ticket to a developer.

Our Solution

EightLabs built a multi-page React and TypeScript site with a fast, teen-friendly design in MLSU's forest-green branding, covering Home, Programs, About, Events, and Contact, all sharing a consistent navigation and footer experience with light and dark themes. For registration, we built a dual-path system: a guided four-step wizard that covers the common case out of the box, and a custom wizard template engine underneath it that lets MLSU configure program-specific steps and questions per participant when a program needs something different. Both paths feed into the same admin view, so staff see every registration in one place regardless of which flow a family used. On the payments side, we integrated Clover for program registration fees, matching a payment method MLSU's staff were already comfortable reconciling, and set up the checkout flow so it validates each step before a family can proceed, avoiding incomplete or duplicate submissions. Stripe was layered in separately to power a straightforward donation flow for the site's Donate button, keeping donation revenue distinct from program payments. Behind the scenes, we built an admin dashboard covering Programs, Registration Forms, Quick Links, and Site Settings, backed by a PostgreSQL database through Drizzle ORM, so MLSU staff can add or edit programs, review incoming registrations, and adjust site content directly, no code changes required. Contact form submissions are delivered by email through Resend, so inquiries reach staff inboxes immediately instead of sitting in a form log nobody checks. The result is a platform that looks and feels like it was built for an established organization, while staying simple enough for a small nonprofit team to run day to day.

Project Details

Client

Markham Lawrence Sports United (MLSU)

Industry

Nonprofit / Community Recreation

Duration

10 weeks

Technologies

ReactTypeScriptViteWouterExpressPostgreSQLDrizzle ORMTailwind CSSShadcn/uiTanStack QueryStripeCloverResend

Results

  • 450+ weekly participants tracked across six programs, 61% female program participation, two independent payment flows launched for program fees and donations, custom registration wizard reduced incomplete sign-ups by removing generic one-size-fits-all forms, admin dashboard eliminated manual spreadsheet tracking of registrations, self-serve content management removed the need for developer involvement in day-to-day site updates

Project Gallery

Building a Registration Engine for a Growing Community Sports Charity - Project Screenshot 1 for Markham Lawrence Sports United (MLSU)Building a Registration Engine for a Growing Community Sports Charity - Project Screenshot 2 for Markham Lawrence Sports United (MLSU)Building a Registration Engine for a Growing Community Sports Charity - Project Screenshot 3 for Markham Lawrence Sports United (MLSU)Building a Registration Engine for a Growing Community Sports Charity - Project Screenshot 4 for Markham Lawrence Sports United (MLSU)Building a Registration Engine for a Growing Community Sports Charity - Project Screenshot 5 for Markham Lawrence Sports United (MLSU)Building a Registration Engine for a Growing Community Sports Charity - Project Screenshot 6 for Markham Lawrence Sports United (MLSU)Building a Registration Engine for a Growing Community Sports Charity - Project Screenshot 7 for Markham Lawrence Sports United (MLSU)

Ready to Start Your Project?

Our team can build a customized solution for your business needs. Let's discuss how we can help.

Get Started

More Case Studies