Testing the Functioning of Backend

Step 7: In order to check whether the API calls to various endpoints are working or not, Postman or Insomnia can be used for the testing.

In the following image, we can see that a create request has been successfully sent to Postman, as the status code indicates “200 OK” and the create document is printed in the console.

Output of the User Created in MongoDB

Notice how the password is hashed. Also, the meal created in the above Postman example has been injected into the meals array of this particular user. We were able to achieve this by providing the ObjectId of the author.

Step 8: Create react application in your project folder using the following command and navigate to the folder.

npx create-react-app client
cd client

Step 9: Install additional packages

npm install axios react-router-dom @fortawesome/free-solid-svg-icons @fortawesome/react-fontawesome

Frontend Dependencies:

"dependencies": {
    "@fortawesome/free-solid-svg-icons": "^6.5.1",
    "@fortawesome/react-fontawesome": "^0.2.0",
    "@testing-library/jest-dom": "^5.17.0",
    "@testing-library/react": "^13.4.0",
    "@testing-library/user-event": "^13.5.0",
    "axios": "^1.6.7",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "react-router-dom": "^6.22.1",
    "react-scripts": "5.0.1",
    "web-vitals": "^2.1.4"
}

With a busy schedule, it is very important to prioritize our health and fitness. In this article, a walkthrough to creating a Workout Planner using MERN (Mongodb, Express, ReactJS, NodeJS) stack is explained. How to create own customized APIs using Mongoose for performing CRUD (Create, Read, Update and Delete) operations has been proposed along with an explanation of installation and setting up of the project.

Output Preview: Let us have a look at how the final output will loo like.