FabFitFun
Reusable page modules in React and TypeScript.
- React
- TypeScript
- Next.js
- Headless CMS
- Storybook
- Testing Library
Overview
FabFitFun builds its marketing and sign-up pages from configurable modules. From late 2025 into 2026 I built and extended those modules in React and TypeScript, as a Senior Software Developer at The Beyond Group.
What I built
- Plan and tier selectors with clickable cards and configurable options.
- A restyled quiz flow with intro, question, and contact steps, a progress indicator, and an offer banner.
- Hero, how-it-works, and sticky offer modules, restyled for seasonal promotions.
- Reusable banner and logo marquee components with editor-friendly settings.
- Unit tests and Storybook stories for each component.
Technical challenges
Content that marketers control
Each module can be configured by non-developers, so the settings had to be flexible without letting an editor break the layout.
Changing live content safely
When a field changed format, I made sure existing content kept rendering while new content used the new format.
Accessible selection controls
Tier and plan cards behave like a radio group, so they have proper labels and keyboard support, checked with automated tests.