Skip to content
All Projects
Full-Stack Platform

FitSocial

FitSocial is a comprehensive social fitness platform I built from the ground up. The challenge was combining the depth of a fitness tracking app with the engagement of a social network — workout logging, nutrition tracking, accountability partners, achievements, messaging, and a real-time activity feed, all in one cohesive experience. I designed a custom component system with dark/light theming, built custom SVG chart components from scratch (no charting library), and implemented optimistic UI updates throughout for a snappy, native-app feel. The result is a feature-rich platform with 130+ tests and production-grade architecture.

Category

Full-Stack Platform

Timeline
January 2020 April 2026
Reading Time
2 min read
Tech Stack
React 18FirebaseMaterial UIStyled ComponentsFormikReact Router v6

Overview

FitSocial is a social media platform purpose-built for fitness enthusiasts — combining workout tracking, nutrition logging, and social networking into a single, cohesive experience.

Problem

Fitness apps force users to choose: either a solid tracking tool with no community, or a social platform with surface-level fitness features. There was no single platform where users could log workouts, track nutrition, find accountability partners, and share their progress with a like-minded community — all without switching between apps.

Approach

I architected and built a full-stack application with a service-layer abstraction over Firebase and a custom design token system:

  • Multi-Type Post System supporting text, workout, meal, progress photo, and before/after comparison posts with full CRUD
  • Real-Time Social Features — follow/unfollow, likes with optimistic updates, threaded comments, and infinite-scroll activity feeds
  • Workout Tracker with an exercise database, calendar-view history, and reusable workout templates
  • Nutrition Dashboard with macro tracking, meal logging, and calorie/macro calculations
  • Accountability Partners — partner matching, daily check-ins with mood tracking, goal creation, and streak tracking
  • Achievement System with unlock logic, badge grid, and confetti animations
  • Messaging with conversations, emoji reactions, message forwarding, and context menus
  • Notification System with 9+ notification types, grouped time sections, and swipe-to-dismiss
  • Custom SVG Charts (DonutChart, LineChart, ProgressRing) — zero charting library dependency
  • Dark/Light Theme with a custom design token system and persistence
  • 130+ Tests with React Testing Library for unit and component coverage

Result

Delivered a production-grade social fitness platform with a clean architecture — service layer abstracting all Firebase calls, React Context for state management, and custom hooks for shared logic. The app features code splitting, lazy loading, skeleton loading states, error boundaries, and mobile-first responsive design with WCAG 2.1 AA accessibility.