GymHub: members, schedules, and payments in one dashboard

Gym owners juggle member records in one tool, class schedules in another, and payments in a third. GymHub is a SaaS platform that unifies all three into a single dashboard, with role-based access so owners, trainers, and front-desk staff each see exactly what their job needs.

Type
SaaS · B2B dashboard
Stack
Next.js · TypeScript · Tailwind CSS · ShadcnUI
Access model
Role-based (owner / staff)
Status
Live at gym-hub-tan.vercel.app
GymHub — SaaS dashboard for gym management built with Next.js and TypeScript by Ali Jawwad

The problem

Independent gyms rarely have an ops team. The owner is the ops team — tracking memberships and renewals, filling class slots, chasing payments. Spreading that across disconnected tools means double entry, missed renewals, and no single view of how the business is doing.

The product

GymHub puts member management, real-time class scheduling, and integrated payment processing behind one login. Role-based access control separates what an owner can do (plans, pricing, reports) from what staff can do (check-ins, bookings), and scheduling updates appear in real time so the front desk and the trainers are always looking at the same calendar.

Build notes

Built with Next.js and TypeScript, styled with Tailwind CSS and ShadcnUI components re-themed for the product rather than left at library defaults. The dashboard patterns here — typed data layer, role-gated routes, optimistic UI on scheduling actions — are the same ones I bring to any SaaS build.

Stack

  • Next.js
  • TypeScript
  • Tailwind CSS
  • ShadcnUI
  • SaaS