This is a solution to the Body Mass Index Calculator challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.
This web application allows you to calculate and evaluate your body mass index, including information and tips for your result
Users should be able to:
- Select whether they want to use metric or imperial units
- Enter their height and weight
- See their BMI result, with their weight classification and healthy weight range
- View the optimal layout for the interface depending on their device's screen size
- See hover and focus states for all interactive elements on the page
- Solution URL: Github respository
- Live Site URL: Deployed at vercel
- Semantic HTML5 markup
- CSS custom properties
- Flexbox
- CSS Grid
- Mobile-first workflow
- React - JS library
- Next.js - React framework
- Tailwind css - For styles
I really enjoyed working on this project, the layout is really challenging, was a nice practice for grid layout. Also was my first time working with tailwind, is a perfect tool for front-end develops. The Javascript coding also was interesting, i added some kind of validation to the input form values that didn´t be asigned on the original challenge.