https://github.com/nanthakumar-m/bmi_converter-react
A fast and simple BMI calculator built with React and Vite. It takes weight and height as user input and instantly displays BMI value along with health status.
https://github.com/nanthakumar-m/bmi_converter-react
bmi-calculator jsx react react-components usestate-hook
Last synced: 7 months ago
JSON representation
A fast and simple BMI calculator built with React and Vite. It takes weight and height as user input and instantly displays BMI value along with health status.
- Host: GitHub
- URL: https://github.com/nanthakumar-m/bmi_converter-react
- Owner: nanthakumar-m
- Created: 2025-06-23T13:18:42.000Z (7 months ago)
- Default Branch: main
- Last Pushed: 2025-06-23T14:29:34.000Z (7 months ago)
- Last Synced: 2025-06-23T15:32:09.890Z (7 months ago)
- Topics: bmi-calculator, jsx, react, react-components, usestate-hook
- Language: JavaScript
- Homepage: https://nanthakumar-m.github.io/bmi_converter-react/
- Size: 468 KB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# ⚖️ BMI Converter – React
This BMI Converter is a React application built using Vite. It allows users to input their weight (in kg) and height (in cm), and instantly calculates their Body Mass Index (BMI). Based on the BMI result, it classifies the user's health status (e.g., Underweight, Normal, Overweight, Obese).
The aim of this project was to practice React fundamentals, including component structure, state management, and event handling. Additionally, it helped in understanding how to manage user input and apply basic formulas for dynamic result rendering in a clean and intuitive UI.
🔗👉 click here to see the live demo--> https://nanthakumar-m.github.io/bmi_converter-react/
🚫 Note: This website is not responsive and is best viewed on desktop screens.
## ⚙️ Technologies Used
- HTML5
- CSS3
- React
- Vite (Build tool)
## 💡Core Features
✅ Accepts weight and height inputs from users
✅ Calculates and displays BMI instantly
✅ Shows corresponding BMI category (Underweight, Normal, etc.)
✅ Uses conditional rendering to display results
✅ Clean and simple UI for better user experience
## 🎯 What I Gained / Concepts Practiced
✅ Strengthened my understanding of **React components and JSX**
✅ Learned how to manage user input with state **(useState)**
✅ Practiced applying conditional logic for real-time output
✅ Learned how to configure GitHub Pages deployment for Vite apps
## 📸 Screenshots
