This application is to help track our gym sessions which includes details such as dates, description, and user. The user will create a user and can log their gym sessions.
This would be for anyone who wants to track their gym record.
This project is of interest to me because my friends and I have recently been gyming regularly. I want to create an app that will allow me and my friends to track our gym progress and record.
From creating this project, I will learn the MERN (MongoDB, Express, React, Node) tech stack:
- I will be hosting our database in the cloud using MongoDB Atlas
- Create a backend Node.js / Express server, attach the cors and express.json middleware (since we will be sending and receiving json), and connect the database
- Create database schemas: User and Gym Sessions
- Add API endpoint routes to handle incoming HTTP GET or POST requests for users and gym sessions
- Used Insomnia to test the server API
- Utilized React routers to allow change in browser URL, created React components to handle events such as gym log by adding a constructor to initialize the state with an empty gym session array and to bind this to the methods I create, and return HTML
- Installed Axios library to send HTTP requests to the backend allowing to create new users and gym sessions in the database
- As a user, I want to be able to create a user to the database
- As a user, I want to be able to log my gym sessions
- As a user, I want to be able to display my logged gym sessions
- As a user, I want to be able to edit my logged gym sessions
- As a user, I want to be able to see logged gym sessions from other users
npm i
First you need a .env file with your own MongoDB database in the server directory. In your .env file it should look like this:
ATLAS_URI= mongodb+srv://database:@usercluster.xiiyv.mongodb.net/?retryWrites=true&w=majority
Then run the backend by:
cd server
npm start
Then run the react app: (make sure you are in root directory)
npm start