Skip to content

Latest commit

 

History

History
198 lines (142 loc) · 6.28 KB

README.md

File metadata and controls

198 lines (142 loc) · 6.28 KB

FitFlow.ai Group 1707485533

Made with React Vite TailwindCSS TensorFlow.js MediaPipe Node.js MongoDB License

Smart AI-powered fitness companion with real‑time pose detection, gamified progress, personalized plans, and a community leaderboard. Built for speed, accessibility, and fun. ✨

Group 1707485530 (1)

🧭 Table of Contents


🌟 Highlights

  • 💡 Personalized Workouts: Tailored exercise routines and desk‑friendly movements
  • 🎥 Real‑time Pose Coaching: MediaPipe + TensorFlow.js guidance via your webcam
  • 🧠 AI Insights: Hydration nudges, habit tracking, and daily goals
  • 🧑‍🤝‍🧑 Community & Leaderboard: Stay motivated with friendly competition
  • 🗂️ Kanban Productivity: Plan health tasks with a drag‑and‑drop board
  • 🔐 Auth & Profiles: JWT auth, user profiles, achievements and badges

Judges: jump to "Getting Started" to run the project quickly.


🏗️ Architecture

Screenshot 2025-09-07 162708 shapes at 25-05-02 08 43 22

🧰 Tech Stack

  • ⚛️ React 18, React Router
  • ⚡ Vite, ESLint, Tailwind CSS
  • 🧠 TensorFlow.js, MediaPipe Pose
  • 🔥 Firebase (client SDK)
  • 🟩 Node.js, Express
  • 🍃 MongoDB, Mongoose

✅ Features

  • 👤 Sign up, sign in, and profiles
  • 🏋️ Exercise flows: pushup, pullup, lunges, squats, shoulder press, bicep curls, front raises, high knees, morning routine
  • 💻 Desk exercises: hand, curls, knee raises
  • 🧃 Hydration break alerts
  • 🗺️ Personalized plan suggestions
  • 🧱 Kanban task board (drag‑and‑drop)
  • 🏆 Leaderboard and badges
  • 🎪 Events and community space

🚀 Getting Started

Prerequisites

  • Node.js 18+ and npm
  • MongoDB Atlas (or local MongoDB)
  • A modern browser with webcam access (for pose features)

Environment Variables

Create server/.env with:

MONGO_URI=mongodb+srv://<username>:<password>@<cluster>/<db>?retryWrites=true&w=majority
PORT=8080
JWT_SECRET=change_this_secret

Firebase config for the client is read from client/src/components/firebaseConfig.jsx. Ensure your keys are set there if required.

Install & Run

Open two terminals or use a multiplexer. Commands are Windows‑friendly.

  1. Backend (Express + MongoDB)
cd server
npm install
npm start
# Server listens on http://localhost:8080 by default
  1. Frontend (Vite + React)
cd client
npm install
npm run dev
# App runs on http://localhost:5173 by default

🗺️ Available Pages

  • / Landing page
  • /login, /signup Auth
  • /dashboard Overview widgets + quick links
  • /exercise Exercise hub
  • /exercise/pushup (and similar for others)
  • /personalized PersonalizedExercise
  • /kanban KanbanFlow
  • /leaderboard Leaderboard
  • /community Community
  • /diet DietPlan
  • /event Event
  • /profile Profile

🔌 API Overview

Base URL: http://localhost:8080/api

  • POST /auth Authentication routes (login/register)
  • GET/POST/PUT/DELETE /tasks Task CRUD for the Kanban board
  • GET /users/:id User profile and stats

See server/routes/ and server/controllers/ for details.


🗂️ Folder Structure

FitFlow.ai-master/
├─ client/
│  ├─ public/                # Static assets (gifs, images)
│  ├─ src/
│  │  ├─ components/         # UI and auth components
│  │  ├─ pages/               # Feature pages (Exercise, Kanban, etc.)
│  │  ├─ lp/                  # Landing page sub-app
│  │  └─ data/                # Data helpers
│  └─ package.json
└─ server/
   ├─ config/db.js           # Mongo connection (uses MONGO_URI)
   ├─ controllers/           # Route handlers
   ├─ models/                # Mongoose schemas
   ├─ routes/                # Express routers
   ├─ server.js              # App entrypoint
   └─ package.json

🛠️ Troubleshooting

  • 🧩 Pose not detected: ensure camera permission is granted and page is served over http://localhost.
  • 🔑 Auth errors: verify Firebase config and server JWT_SECRET.
  • 🌿 DB not connecting: double‑check MONGO_URI and network IP allowlist on MongoDB Atlas.
  • 🧵 CORS issues: server enables CORS; ensure frontend uses the correct base URL.

🤝 Contributing

Contributions are welcome! Feel free to open issues or PRs. Please keep code readable and consistent, and add clear descriptions to changes.


Built with ❤️, caffeine ☕, and lots of reps 🏋️ by the PixelForce team.