How to Build Fitness tracking with V0

1// Paste this prompt into V0's AI chat:
2// Build a fitness tracking app. Create a Supabase schema with:
3// 1. exercises: id (uuid PK), name (text), muscle_group (text), type (text check in 'strength','cardio','flexibility'), is_custom (boolean default false), created_by (uuid FK to auth.users nullable)
4// 2. workouts: id (uuid PK), user_id (uuid FK to auth.users), name (text), date (date), duration_minutes (int), notes (text), created_at (timestamptz)
5// 3. workout_exercises: id (uuid PK), workout_id (uuid FK to workouts), exercise_id (uuid FK to exercises), position (int)
6// 4. sets: id (uuid PK), workout_exercise_id (uuid FK to workout_exercises), set_number (int), reps (int), weight_kg (decimal), duration_seconds (int), completed (boolean default true)
7// Create a database view personal_records: SELECT DISTINCT ON (exercise_id, user_id) exercise_id, user_id, weight_kg, reps, sets.created_at FROM sets JOIN workout_exercises ... ORDER BY exercise_id, weight_kg DESC
8// Seed the exercises table with 50 common exercises (bench press, squat, deadlift, etc.)
9// Add RLS: users see their own workouts, exercises are readable by all.

1// Paste this prompt into V0's AI chat:
2// Build a fitness tracker homepage at app/page.tsx.
3// Requirements:
4// - Today's date prominently displayed
5// - "Start Workout" Button linking to /workouts/new
6// - If a workout exists for today, show it as a Card with: workout name, duration, exercise count
7// - Weekly overview: 7-day row showing which days had workouts (filled circles) and which didn't (empty circles)
8// - Streak counter Card: current consecutive days with workouts, with a fire emoji
9// - Recent workouts list (last 5) as Card components with: date, workout name, exercise count, total volume (weight x reps)
10// - Quick stats Cards: total workouts this month, total volume this week, most trained muscle group
11// - "View Progress" Button linking to /progress
12// - Use Badge for muscle group tags and Card for all stat containers

1// Paste this prompt into V0's AI chat:
2// Build a workout logging page at app/workouts/new/page.tsx as a 'use client' component.
3// Requirements:
4// - Input for workout name (default: "Workout" + date)
5// - Exercise search: Input with Command/Popover that searches the exercises table by name
6// - Filter exercises by muscle_group using Select (Chest, Back, Legs, Shoulders, Arms, Core, Cardio)
7// - Selected exercises appear as Accordion items, each containing:
8//   - Exercise name and muscle_group Badge
9//   - Set rows: set number, Input for weight (kg), Input for reps, Checkbox for completed
10//   - "+ Add Set" Button below the last set
11//   - Remove exercise Button (trash icon)
12// - "+ Add Exercise" Button at the bottom to search and add more exercises
13// - Timer display showing workout duration since page opened
14// - "Finish Workout" Button that calls a Server Action to insert:
15//   - workout row, workout_exercises rows, and sets rows in a single Supabase RPC transaction
16// - After saving, redirect to /workouts/[id] showing the completed workout summary
17// - Use Card to wrap each exercise section

1// Paste this prompt into V0's AI chat:
2// Build a progress page at app/progress/page.tsx.
3// Requirements:
4// - Select dropdown to choose an exercise from the user's history
5// - Recharts LineChart showing weight_kg over time for the selected exercise (each data point = heaviest set per workout)
6// - Personal Records section: Card for each exercise showing the heaviest weight ever lifted with date and reps, using the personal_records database view
7// - PR Badge indicator on exercises where the latest workout matches the PR
8// - Workout frequency heatmap: a 365-day grid (like GitHub contribution graph) where each cell is colored by workout count for that day
9// - Use green shades: lightest for 1 workout, darkest for 3+ workouts
10// - Stats Cards: total workouts, total volume (kg x reps), average workout duration, most improved exercise
11// - Tabs to switch between Strength Progress, Cardio Progress, and Records views
12// - Wrap charts in 'use client' components, keep page as Server Component
13// - Use Card for each section and Badge for PR indicators

1// Paste this prompt into V0's AI chat:
2// Build two pages:
3// 1. app/workouts/page.tsx — workout history:
4//    - Server Component fetching all user's workouts ordered by date DESC
5//    - Each workout as a Card with: date, name, duration, exercise names as Badge list, total volume
6//    - Click to view full workout detail at /workouts/[id]
7//    - Filter by month using Select
8// 2. app/exercises/page.tsx — exercise library:
9//    - Server Component showing all exercises in a searchable grid
10//    - Filter by muscle_group using Tabs (All, Chest, Back, Legs, etc.)
11//    - Search Input for exercise name
12//    - Card for each exercise with name, muscle_group Badge, type Badge
13//    - "Add Custom Exercise" Button opening Dialog with name Input, muscle_group Select, type Select
14//    - Custom exercises marked with "Custom" Badge
15//    - Server Action for creating custom exercises with Zod validation