Back to Projects
Mobile Development

Fitness Tracker PWA .

React IndexedDB Chart.js
Fitness Tracker PWA

Overview

A Progressive Web App for fitness enthusiasts to log workouts, track progress, and visualize trends over time. Works offline and can be installed on any device.

Dashboard

Features

Offline-First Architecture

  • Service Worker caches app shell and assets
  • IndexedDB stores workout data locally
  • Background sync uploads data when online

Data Visualization

  • Interactive charts showing progress over time
  • Personal records tracking
  • Volume load calculations
// Service Worker registration
if ('serviceWorker' in navigator) {
    navigator.serviceWorker.register('/sw.js').then(reg => {
        console.log('SW registered', reg);
    });
}

// IndexedDB wrapper
const db = await openDB('fitness-tracker', 1, {
    upgrade(db) {
        db.createObjectStore('workouts', { keyPath: 'id', autoIncrement: true });
    }
});

Technical Highlights

  • Installable: Add to home screen on iOS and Android
  • Responsive: Optimized layouts for mobile, tablet, desktop
  • Fast: App shell loads in < 1 second
  • Reliable: Works fully offline after first load

User Engagement

  • Average session duration: 8 minutes
  • 70% of users install to home screen
  • Daily active usage increased 3x after PWA launch