Fitbit Personal Dashboard

A read-only personal Fitbit dashboard with data visualization and pattern analysis. Uses the Fitbit Web API with OAuth 2.0 (PKCE), local JSON file caching, and Recharts for time-series and day-of-week views.

Features

• OAuth 2.0 (PKCE) with Fitbit; tokens stored and refreshed server-side
• Caching: Data stored as local JSON files under data/; only missing date ranges are fetched from Fitbit
• Metrics: Steps, calories, active minutes, sleep stages, HRV, weight, exercise sessions
• Time ranges: 7, 30, or 90 days with optional weekly aggregation for 90d
• Charts: Line charts per metric, sleep stages overlay, day-of-week bar chart
• Insights: Day-of-week patterns (best/worst day), sleep vs activity

Setup

1. Register a Fitbit app

   • Go to dev.fitbit.com/apps and create a Personal application.
   • Set Redirect URI to: http://localhost:3001/api/auth/callback
   • Copy the Client ID.

2. Configure environment

   cp .env.local.example .env.local

   Edit .env.local and set:

   FITBIT_CLIENT_ID=your_client_id_here
   

   Optional: FITBIT_REDIRECT_URI and NEXT_PUBLIC_APP_URL if you use a different origin (default is http://localhost:3001).

3. Install and run

   npm install
   npm run dev

   The app runs at http://localhost:3001 (port 3001 to avoid conflict with other apps).

4. Use the app

   • Open http://localhost:3001 and click Sign in with Fitbit.
   • Authorize the requested scopes (activity, heartrate, sleep, weight, profile, settings).
   • On the dashboard, use Refresh from Fitbit to sync the last 30 days (or the selected range). Data is cached under data/ (created automatically on first sync).
   • Switch 7d / 30d / 90d to change the range; 90d uses weekly averages.

Scripts

• npm run dev – Start dev server on port 3001
• npm run build – Production build
• npm run start – Start production server on port 3001
• npm run lint – Run lint

Tech stack

• Next.js 14 (App Router), React 18, TypeScript
• Recharts for line/bar charts
• Local JSON file cache under data/ (no database server required)
• Fitbit Web API with 150 requests/hour/user limit; caching keeps usage low

Data and privacy

• All Fitbit data and OAuth tokens are stored only in local JSON files under data/ (for example auth.json plus metric caches). The data/ directory is created on first sync.
• Tokens stay server-side and are never sent to the browser.
• No data is sent to any server other than Fitbit’s API.
• Do not commit .env.local or data/ — both are gitignored. Use .env.local.example as the template for your own Client ID.

License

MIT