← Back to FitQuest

About FitQuest

A gamified sport and diet tracking Progressive Web App built for the Advanced Interactive Utility Website project. Track workouts, log meals, set goals, earn badges, and level up every day.

Features

💪
Workout Tracking
Log any activity — running, lifting, yoga, swimming. Track duration, calories, distance, and heart rate.
🥗
Nutrition Log
Log meals by type (breakfast, lunch, dinner, snacks) with full macro tracking (calories, protein, carbs, fat).
🎯
Goal Setting
Set personalized fitness goals with deadlines and track your progress toward completing them.
Gamification
Earn XP for every action, level up, maintain streaks, and unlock badges — just like Duolingo.
📧
Smart Emails
Automatic progress reports, inactivity alerts, and achievement notifications. Admin can customize all templates.
🔗
Google Health Connect
Connect Google Fit / Health Connect to auto-import workouts via OAuth2 + REST API.
📱
PWA — Install on Any Device
Install on iOS, Android, Windows, or Mac as a native-feeling app with offline support.
🛡️
Admin Panel
Manage users, reset passwords, customize email templates, send broadcasts, and view audit logs.
🔑
REST API
Pull your own data via API key authentication. Access workouts, diet, goals, stats, and badges.

JavaScript Features Used (ITS Exam Objective Mapping)

FeatureWhere UsedExam Objective
let, constThroughout script.js — state, user, token, XP_TABLEVariables & primitive data types
Number, Boolean, String primitivesXP calculations, active flags, email/username stringsPrimitive data types
parseInt(), parseFloat()Parsing form inputs for workouts, diet entries, goalsType conversion
Arithmetic operators (+, -, *, /, %)XP calculations, calorie totals, streak logic, chart %Assignment & arithmetic operators
Math.round(), Math.min(), Math.max(), Math.pow(), Math.floor(), Math.random()XP curve, progress percentages, level-up messagesBuilt-in Math functions
if / else statementsAuth checks, XP bonuses, streak logic, UI stateDecision statements
for loops, forEach, map, filter, reduceXP level table, list rendering, stats aggregationLoops
&&, ||, !Auth guards, null coalescing, form validationLogical operators
Functions with parameters + return valuesapi(), toast(), escHtml(), workoutCard(), levelForXp()Functions, parameters, return values
Local vs global scopeModule pattern, state object, closures in event handlersScope rules
Arrays: push(), length, iterationstate.workouts, pagesVisited, badgeQueue, XP_TABLEArrays
Objectsstate object, user objects, ACTIVITY_ICONS mapObjects
Date objectGreeting logic, chart dates, session timestampsDate object
getElementById(), querySelector()Throughout DOM manipulationDOM manipulation
innerHTML, textContentRendering workout cards, badge lists, statsDOM manipulation
onclick, onchange, DOMContentLoaded, keydownAll form submissions, nav clicks, modal closeEvent handling
try...catch blocksEvery API call, service worker, token validationException handling
console.log()Boot message listing all JS features usedDebugging
Comments & indentationConsistent throughout all filesBest practices

Tech Stack

Project Structure

/project-root
├── index.html       ← SPA entry point
├── about.html      ← This page
├── styles.css      ← All styles (Flexbox, Grid, responsive)
├── script.js       ← All frontend JS
├── sw.js           ← Service Worker (PWA offline)
├── manifest.json   ← PWA manifest (installable)
├── README.md       ← Documentation
└── backend/        ← Node.js API server

Built with HTML, CSS & JavaScript for the Advanced Interactive Utility Website project.

Go to FitQuest →