workout-planner

Table of Contents

• Summary
• Technologies
  • Backend
  • Frontend
• Demo
• Running your project

Summary

A platform for fitness enthousiasts to keep their workout schedules and meal plans in check. Users log into their accounts and are greeted by all their current and past workout plans (summarized with a title, main objective, and intensity). Once a plan is selected, the user will see a 7-day layout coupled with a meal plan. The webapp makes it easy to browse through previous plans to either revisit, change, or use them as inspiration for a new workout routine.

Technologies

• Vue/Vuex/Vuetify
• NodeJS
• Express
• MongoDB
• Bycrypt
• JWT

Requirments

• NodeJS/npm
• MongoDB
• Vue CLI

Backend

Express

Express is used to manage the API's endpoints.

MongoDB

I used MongoDB in tandem with the mongoose library to send and query data from a database. The database stores user information: authentication information, workout routines, and meal plans.

Frontend

VueJS

VueJS is used to structure the frontend alongside Vuex and Vuetify. The latter two are used for global state management and to provide a smoother user experience respectively. I use vue router to manage different front-end componnents while maintining a single page web application.

Demo

Running the Project

• Run mongod in its own terminal
• Run npm start in the back-end folder
• Run npm run serve in front-end folder
• Navigate to localhost:8080