Sporty Hangover — Training Platform for Runners

The challenge

Sporty Hangover, a running community with over 12K followers, needed a digital platform that would allow them to offer personalized training plans to runners of all levels. The challenge: create a web experience that reflected the community’s energy and philosophy, with real progress tracking tools.

The Sporty Hangover team had been generating content and plans in PDFs and spreadsheets. Demand had grown to the point where they needed a structured system that could scale without multiplying manual work for each new user.

Our solution

We developed a complete web platform in React with a Node.js backend that allows users to access personalized training plans, track their progress, and connect with the Sporty Hangover community.

Architecture and technical decisions

The platform was designed as an SPA (Single Page Application) with React on the frontend and a REST API in Node.js, prioritizing the fluid user experience that an active community demands:

1. React SPA — Instant transitions between sections (dashboard, plans, profile) without page reloads. Runners check their plans frequently and perceived speed is critical.
2. Node.js + Express API — High performance in I/O operations (reading plans, updating metrics) with a single language across the entire stack.
3. MongoDB — Flexible data model for training plans that vary greatly in structure (intervals, tempos, long runs, series). A rigid SQL schema would have complicated evolution.

Personalized plan engine

• Assignment algorithm that adapts the plan based on level (beginner, intermediate, advanced), goal (5K, 10K, half marathon, marathon) and weekly availability
• Automatic progression — the system adjusts volume and intensity week by week based on user response
• Session variety — easy runs, intervals, fartlek, tempo runs, hills, and active recovery, distributed in a balanced way
• Flexibility — users can mark unavailable days and the plan reorganizes without losing coherence

Progress tracking

• Personal dashboard with key metrics: weekly km, average pace, training consistency
• Evolution charts showing progression over weeks and months
• Session logging where runners mark each workout as completed, partial, or skipped
• Feedback loop — tracking data feeds adjustments to the next plan

Editorial content

• Integrated blog with articles on nutrition, recovery, equipment, and runner mindset
• Tips section linked to the user’s active plan (e.g., “Recovery week: why it matters”)
• Exclusive content for registered users vs. public content for acquisition

Profile and community

• User profile with training history, streaks, and unlocked achievements
• Achievement system that gamifies consistency: “7 consecutive days”, “100km monthly”, “First half marathon”
• Integration with the existing community on social media

Technical challenges solved

• Dashboard performance — Pre-calculation of aggregated metrics so the dashboard loads instantly, without recalculating on each visit
• Dynamic plans — Rule engine that generates coherent plans without manual intervention, respecting sports periodization principles
• Offline-first for sessions — Workouts can be logged without connectivity and sync automatically when network is recovered

Key technical decisions

Results

The platform digitizes Sporty Hangover’s value proposition, enabling their community of 12K+ followers to access personalized training plans:

• 12K+ follower community activated with proprietary digital tools
• 100% personalized plans automatically generated based on runner profile
• Progress tracking with visual metrics that motivate consistency
• Manual work reduction — from managing plans individually in spreadsheets to an automated system
• Integrated editorial content that retains users beyond the training plan
• Technical foundation ready to evolve toward a native mobile app

Tech stack

• React (Frontend SPA)
• Node.js + Express (REST API)
• MongoDB (Database)
• JWT (Authentication)
• Chart.js (Progress visualization)
• Cloud hosting with CDN