FitTrac is an interactive and comprehensive web application with the users’ goals in mind. No matter your fitness level or experience, this application will have utility for anyone ranging from casual gym goers, advanced powerlifters, or even aerobic athletes such as long-distance runners. This application will be designed to help users track their workouts, fitness activities, set fitness goals, and track their progress on visual charts over time. We aim to provide a personalized experience for users to achieve their fitness goals, whether it be shedding some pounds, getting swole, or improving their aerobic endurance.
FitTrac is a dynamic web application designed to help users monitor and manage their fitness journeys. With a user-friendly interface, FitTrac offers several functionalities through its multiple views, each tailored to different aspects of workout tracking and progress visualization.
-
Login Page: Users are greeted by a login page upon launching the application. This initial interaction ensures user data privacy and personalization.
-
Dashboard: Once logged in, users are directed to the dashboard. This central hub provides insightful visualizations of the user’s fitness progress:
- Pie Chart: Offers a breakdown of workout types, with interactive hover features that detail more information.
- Bar Graph: Updates in real time to reflect the duration of each workout and the total number of workouts logged, giving users a quick overview of their activity levels.
-
Log a Workout: Users can record new workouts by specifying the date, type of workout, and duration. This feature is designed to be quick and intuitive, encouraging regular use.
-
View Workouts: This view allows users to track the progress toward their fitness goals, with options to review and edit previous entries.
-
Calender: Integrates a visual calendar allowing users to track workout days. It highlights the days of the month on which the user exercised, providing a quick view of consistency and regularity in their fitness regime.
-
About: Provides a detailed guide on how to effectively use the application and maximize its features to benefit the user's fitness journey.
FitTrac/
│
├── index.html # Main entry point, dashboard view
├── login.html # Login page
├── script.js # Core JavaScript logic
├── style.css # Main stylesheet
├── README.md # Project documentation
│
├── css/ # Additional CSS files
│ └── login.css
│
├── js/ # Additional JavaScript files
│ ├── workout.js # Scripts for workout features
│ ├── calendar.js # Calendar functionality for tracking workouts
│ ├── server.js # Server-side logic
│ ├── db.js # Database interactions
│ ├── tracker.js # Tracking user activities and progress
│
└── assets/ # Media files like images and icons
└── images/