Skip to content

Bewdiful/MERN-Stack-app

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

84 Commits
 
 
 
 
 
 
 
 

Repository files navigation

Workout Partner

App for our graduation Final Project

By: Ruslan & Benny

Final project presentation video: https://www.youtube.com/watch?v=ZkIkzOGMfUU

WorkoutPartner.-.Web.app.Final.project.presentation.mp4

MERN-app [MongoDB, Express, React, Node]

Steps : We will provide info about what we did in each step of development .

step 1 : initial Express app to power the backend api .

      we will use Postman.
                what is Postman?
                Postman is an API platform for developers to design, build, test and iterate their APIs.

step 2 : Express Router & API Routes

       creating all of the workout routes we need for the api and test them out using POSTMAN.
                     API Endpoints
       GET    /workouts --> Gets all the workouts documents
       POST   /workouts --> Creates a new workout document 
       GET    /workouts/:id --> Gets a single workout document
       DELETE /workouts/:id --> Deletes a single workout document
       PATCH  /workouts/:id --> Updates a single workout document

step 3 : MongoDB Atlas & Mongoose

      set up a database using MongoDB Atlas, and then connect to it from our application using a package called Mongoose.

step 4 : Models & Schemas

      create a new model & schema for the dtabase collection we'll be using (workouts)

commit 5 : Controllers

      make some controller functions for the workout routes.

step 6 : Controllers

      finish off the controller functions that we started in the last commit(6)

step 7 : Making a React App

      start our React application and set up a homepage route.

step 8 : Fetching Data

      we'll make a request to the backend api to fetch workouts data and output it in the React template.

step 9 : New Workout Form

      we'll make a form to add new workouts.

step 10 : Adding React Context

       we'll create a React Context to provide some global workouts state to the entire React application.

step 11 : Deleting Data

      Deleting Data.

step 12: Handling Error Responses

      Handling Error Responses.

step 13: Finishing Touches

     Finishing Touches (npm install date-fns).


              #############Authentication#############

step 14 & Authentication step 1:

     implement authentication (using JSON web tokens), within the MERN stack.

step 15 & Authentication step 2:

     make a user controller & model, and set up some routes for authentication.

step 16 & Authentication step 3:

     Signing Up & Hashing Passwords

step 17 & Authentication step 4:

     Email & Password Validation

step 18 & Authentication step 6:

     Signing Tokens

step 19 & Authentication step 7:

     Logging Users In

step 20 & Authentication step 8:

     React Auth Context

step 21 & Authentication step 9:

     Login & Signup Forms

step 22 & Authentication step 10:

     Making a useSignup Hook

step 23 & Authentication step 11:

     Making a useLogout Hook

step 24 & Authentication step 12:

     Making a useLogin Hook
     make a custom useLogin hook to log users in to the application.

step 25 & Authentication step 13:

     Setting the Initial Auth Status

step 26 & Authentication step 14:

     Protecting API Routes

step 27 & Authentication step 15:

     Making Authorized Requests

step 28 & Authentication step 16:

      Protecting React Routes

step 29 & Authentication step 17:

      Assigning Workouts to Users

step 30:

     Adding Features
              Chat/Forum Feature
              Total Workout Stopwatch Feature
              Rest Countdown Feature
              Water Page Feature
              Exercises Page Feature
              Music Page Feature
              BMI Page Feature

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors