Empower Your Fitness Journey: Plan, Track, and Achieve Your Workouts with Personalized Exercise Schedules!
Embark on a transformative fitness journey with this web app. Precision-engineered for user-friendly workout management, it boasts a sleek design and robust features, making fitness a delightful and efficient experience.
This project features a workout management dashboard that is presented in a split view manner where the workouts are on the left side and the exercises for that specific workout are on the right side. The user can make a new workout with just a click. The user also has the ability to change the name of the workout. The right side is presented in flex view that displays all the exercises for that workout. There is a dropdown menu that let’s user choose which day’s workout they want to view. The user can add, edit, or delete any exercise in real time. The user can also share their workout with another user by clicking on the share icon which appears when a user hovers over a workout. A popup asking for a username will appear. Once shared, the workout will appear in the Shared Workouts section of the user that received the workout. The user also stays logged in unless the cache for the website is cleared.
The register page features a great password setup functionality which requires the user to choose a password that is at least 8 characters long, contains a special character, and contains a number. This was done using Regex in javascript. Each edit, delete, or add is a post request to the backend sever that establishes a connection with the database and performs the operation. If the operation was successful, then it returns the new updated field as a json object which is fed into the react body and then displayed beautifully. If there is an error, then it returns an error which is caught in the react body so that the user does not lose connection to the website and the webiste does not crash.
Tech Stack: React.js, Express.js, Node.js, MongoDB, CSS