---

🎯 The Problem We Solved

❌  Before FitTrack Pro          ✅  With FitTrack Pro
─────────────────────────        ──────────────────────────────
App 1 → Workout tracking         ✔  Workouts + Exercises + Mood
App 2 → Calorie / Nutrition      ✔  Meals + Macros + Food Search
App 3 → Water intake             ✔  Quick-add + Progress Ring
App 4 → Sleep tracker            ✔  Sleep Quality + REM Tracking
App 5 → Body measurements        ✔  Progress Photos + Charts
App 6 → Goals                    ✔  Goals + Milestones + Reminders
─────────────────────────        ──────────────────────────────
6 separate apps                  1 unified platform, 3 panels

---

🏗️ Architecture — 3 Role-Based Panels

┌──────────────────────────────────────────────────────────────────────┐
│                        🏋️  FitTrack Pro                              │
├───────────────────┬──────────────────────┬───────────────────────────┤
│   👤  USER PANEL  │  🏅  TRAINER PANEL   │    🛡️  ADMIN PANEL        │
│   ─────────────── │  ──────────────────  │  ─────────────────────    │
│   18 pages        │  5 pages             │  8 pages                  │
│   Own data only   │  Clients + own data  │  Full system access       │
│                   │                      │                           │
│   • Dashboard     │  • Dashboard         │  • Dashboard              │
│   • Workouts      │  • My Clients        │  • User Management        │
│   • Nutrition     │  • Client Details    │  • Trainer Management     │
│   • Water Log     │  • Workout Templates │  • Trainer Requests       │
│   • Sleep Log     │  • Profile/Settings  │  • Assigned Trainers      │
│   • Progress      │                      │  • Feedbacks              │
│   • Goals         │                      │  • Create Trainer         │
│   • Achievements  │                      │  • Profile/Settings       │
│   • Browse Trainers│                     │                           │
│   • Profile       │                      │                           │
└───────────────────┴──────────────────────┴───────────────────────────┘

---

⚡ Tech Stack

Layer	Technology	Purpose
🎨 UI Framework	React 19 + Vite 6	Component-based frontend
🎭 Styling	Tailwind CSS v4 + Inter font	Utility-first with custom design tokens
✨ Animations	Framer Motion + react-transition-group	Page transitions & micro-animations
📊 Charts	Chart.js v4 + react-chartjs-2	Line, Bar, Doughnut, Radar charts
📝 Forms	React Hook Form + Yup	Validation + form state management
🔗 Routing	React Router v7	Client-side navigation
📡 HTTP	Axios + interceptors	API requests + token refresh
🖥️ Backend	Node.js + Express.js	REST API server
🍃 Database	MongoDB Atlas + Mongoose	Cloud NoSQL database
🔐 Auth	JWT + bcryptjs	Tokens in cookies + password hashing
☁️ Images	Cloudinary + Multer	Cloud image storage
🛡️ Security	Helmet + Rate Limit + HPP + Mongo Sanitize	API hardening
📋 Logging	Morgan	HTTP request logging

---

📁 Project Structure

FitTrackPro/
│
├── 📁 client/                        ← React + Vite Frontend
│   └── src/
│       ├── 📁 components/common/     ← Button, Card, Modal, Input, StatCard, Spinner...
│       ├── 📁 contexts/              ← AuthContext (global auth state)
│       ├── 📁 hooks/                 ← useAsync, useDebounce
│       ├── 📁 layouts/               ← PublicLayout, DashboardLayout, AdminLayout, TrainerLayout
│       ├── 📁 pages/
│       │   ├── 📁 public/            ← Home, About, Contact, Login, Register, ForgotPassword
│       │   ├── 📁 user/              ← Dashboard, Workouts, Nutrition, Water, Sleep, Progress...
│       │   ├── 📁 trainer/           ← Dashboard, MyClients, ClientDetails, Templates
│       │   └── 📁 admin/             ← Dashboard, UserMgmt, TrainerMgmt, Requests, Feedbacks
│       ├── 📁 partials/              ← Sidebar, AdminSidebar, TrainerSidebar, Header
│       ├── 📁 services/              ← 13 API service modules
│       └── 📁 utils/                 ← ThemeContext, Transition
│
├── 📁 server/                        ← Node.js + Express Backend
│   ├── 📁 Controllers/               ← 13 business logic controllers
│   ├── 📁 Models/                    ← 11 Mongoose schemas
│   ├── 📁 Routes/                    ← 13 Express route files
│   ├── 📁 Middleware/                ← Auth, ErrorHandler, Multer, Validator
│   ├── 📁 Database/                  ← db.js (Atlas), seedAdmin.js
│   ├── 📁 Utils/                     ← Cloudinary config, JWT helper
│   └── 📄 server.js                  ← App entry point
│
└── 📁 docs/                          ← PRD, SRD, TRD, Design System

---

📋 Features — Page by Page

👤 User Panel — 18 Pages  

#	Page	Key Features	API
1	Splash Screen	Animated brand intro, auto-redirect	—
2	Home	Hero, features, testimonials, CTA	—
3	About	Mission, team info	—
4	Contact	Feedback form with background video	POST /api/feedbacks/submit
5	Register	Signup + profile picture → Cloudinary	POST /api/auth/register
6	Login	JWT auth, token in cookie	POST /api/auth/login
7	Forgot Password	Email → reset link via notification	POST /api/auth/forgot-password
8	Reset Password	Token-based password update	PUT /api/auth/reset-password/:token
9	Dashboard	Stats cards + weekly charts (workouts, calories, streak, water, sleep)	Multiple GETs
10	Workout List	Filter, paginate, favorite, clone, delete	GET /api/workouts
11	Log Workout	Create with exercises (sets/reps/weight/duration)	POST /api/workouts
12	Workout Details	View/edit, mark exercises complete, mood tracking	GET PUT /api/workouts/:id
13	Nutrition Log	Meals + macro charts + food search + weekly trends	Full CRUD
14	Water Log	Quick-add (250ml/500ml/1L) + progress ring + streak	Full CRUD
15	Progress Tracking	Body measurements + photos (Cloudinary) + BMI + radar chart	Full CRUD
16	Sleep Log	Sleep/wake times, quality, REM, recommendations	Full CRUD
17	Browse Trainers	View trainers + specializations + send request	POST /api/trainer-requests
18	Profile + Settings	Edit profile, change password, theme & notification prefs	PUT /api/auth/update-profile

🏅 Trainer Panel — 5 Pages  

#	Page	Key Features
1	Dashboard	Client activity stats, workout completion rates
2	My Clients	List + search + remove assigned clients
3	Client Details	Full profile view, assign workouts/goals, add notes, message client
4	Workout Templates	Create reusable templates, mark public, assign to clients
5	Profile + Settings	Edit profile, update specialization

🛡️ Admin Panel — 8 Pages  

#	Page	Key Features
1	Dashboard	System-wide stats — users, trainers, workouts, growth rate
2	User Management	Full CRUD + bulk actions + toggle active/inactive + assign trainer
3	Trainer Management	View trainers, client counts, promote/demote roles
4	Create Trainer	Register new trainer with specialization fields
5	Trainer Requests	Approve / reject user-submitted requests with notes
6	Assigned Trainers	View all trainer-client assignments platform-wide
7	Feedbacks	View all feedback submissions, mark as read
8	Profile + Settings	Edit admin profile and preferences

---

🔗 API Reference

Module	Endpoint	Methods
🔐 Auth	/api/auth	POST, PUT
🏋️ Workouts	/api/workouts	Full CRUD
🥗 Nutrition	/api/nutrition	Full CRUD
💧 Water	/api/water	Full CRUD
😴 Sleep	/api/sleep	Full CRUD
📈 Progress	/api/progress	Full CRUD
🎯 Goals	/api/goals	Full CRUD
🏆 Achievements	/api/achievements	GET
🔔 Notifications	/api/notifications	GET, PUT, DELETE
🏅 Trainers	/api/trainers	GET, PUT
📨 Trainer Requests	/api/trainer-requests	GET, POST, PUT
🛡️ Admin	/api/admin	Full CRUD + Bulk
💬 Feedback	/api/feedback	GET, POST, PUT

---

🗄️ Data Models

User ──────────────────────────────────────────────────────────────────
 │
 ├── 🏋️  Workout → Exercise[] (embedded: sets, reps, weight, duration)
 ├── 🥗  Nutrition → FoodItem[] (embedded: macros, calories)
 ├── 📈  Progress → BodyMeasurements + PerformanceMetrics + Photos[]
 ├── 🎯  Goal → Milestones[] + Reminders[] (embedded)
 ├── 💧  Water (daily intake entries)
 ├── 😴  Sleep (bedtime, wake, quality, REM/deep/light)
 ├── 🏆  Achievement (points, badges, rank)
 ├── 🔔  Notification (TTL 30 days auto-expire)
 ├── 💬  Feedback
 └── 📨  TrainerRequest ←──→ Trainer (User self-ref)

🍎  Food → standalone searchable food database

---

🚀 Getting Started

Prerequisites

• Node.js v18+
• MongoDB Atlas account
• Cloudinary account

Installation

# Clone the repo
git clone https://github.com/Konete326/FitTrackPro.git
cd FitTrackPro

# ── Backend ──────────────────────────────────
cd server
npm install
npm run dev
# → Running on http://localhost:5000

# ── Frontend (new terminal) ──────────────────
cd client
npm install
npm run dev
# → Running on http://localhost:5173

Environment Variables

server/.env

PORT              = 5000
MONGO_URI         = mongodb+srv://<user>:<pass>@cluster.mongodb.net/fittrackpro
JWT_SECRET        = your_super_secret_key
JWT_EXPIRES_IN    = 7d
CLOUDINARY_CLOUD_NAME = your_cloud_name
CLOUDINARY_API_KEY    = your_api_key
CLOUDINARY_API_SECRET = your_api_secret
NODE_ENV          = development

client/.env

VITE_API_URL = http://localhost:5000/api

---

🌐 Shared Systems

System	Description
🔔 Notifications	Badge counter · Read/Unread toggle · 30-day TTL auto-expiry · 8 types (workout reminders, streak, trainer messages, password reset...)
🏆 Achievements	Points-based gamification · 7 categories · Auto-triggered by milestones · Rank calculation
🌙 Dark / Light Mode	Persisted in localStorage · Smooth toggle · Frosted glass header · All components responsive
💬 Feedback Loop	User submits → Admin reviews → Marks read → User notified

---

👨‍💻 Team

	Student ID	Name	Contact
🧑‍💻	Student1550980	Muhammad Sameer	sameerdevexpert@gmail.com · 0321-3265524
🧑‍💻	Student1552027	Muhammad Sheryar	—
🧑‍💻	Student1436664	Maaz Bin Asad	—
🧑‍💻	Student1566221	Muhammad Basiq	—
🧑‍💻	Student1501325	Abdul Hadi	—

---