Inspiration
The goal was to build a tool that allows users to calculate their BMI easily and provides them with information about their BMI status based on standard categories. I Create This Project on MLH Daily Challenges.
What it does
The BMI Calculator app allows users to input their weight (in kilograms) and height (in centimeters). Upon clicking the "Calculate BMI" button, the app calculates the user's BMI and displays the result. Additionally, it provides the corresponding BMI status, indicating whether the user is underweight, within a normal weight range, overweight, or obese.
How we built it
We built this app using React, a popular JavaScript library for building user interfaces. The app is structured as a single-page application (SPA) using functional components and React hooks. We utilized state management to handle user input and dynamically update the BMI result and status. The app's design and layout were created using CSS to make it visually appealing and user-friendly.
Challenges we ran into
During the development process, we encountered a few challenges. Calculating the BMI required converting the user's height from centimeters to meters and performing the mathematical calculation accurately. Additionally, determining the appropriate color for each BMI status and dynamically applying it to the displayed text was a bit tricky. However, with careful debugging and problem-solving, we were able to overcome these challenges.
What we learned
Through this project, we gained valuable experience in building React applications, working with state management, and handling user input. We also improved our CSS skills in designing responsive and visually appealing user interfaces. Additionally, we learned more about BMI calculations and how to interpret the results based on standard BMI categories.
What's next for Basic React APP
In the future, we plan to enhance the app's functionality by adding support for multiple unit systems for weight and height, allowing users to choose between kilograms/meters and pounds/inches. We also intend to implement a feature that allows users to save and track their BMI results over time, providing a more comprehensive health monitoring tool.
Log in or sign up for Devpost to join the conversation.