💪 BMI Calculator

Una calculadora de Índice de Masa Corporal construida con React y Vite, basada en un reto de Frontend Mentor. El proyecto implementa el diseño profesional provisto por la plataforma, traduciéndolo a código pixel-perfect y responsive.

🌐 Demo en vivo: bmi-calculator-one-mocha.vercel.app
🎨 Reto original: Body Mass Index Calculator — Frontend Mentor

---

✨ Características

• 📏 Cálculo del IMC a partir de peso y altura
• 🏷️ Clasificación automática del resultado (bajo peso, saludable, sobrepeso, obesidad)
• 📱 Diseño totalmente responsive (mobile, tablet, desktop)
• ⚡ Construido con Vite para tiempos de desarrollo rápidos

🖼️ Captura

🛠️ Stack

• React 18 — Biblioteca de UI
• Vite — Build tool y dev server
• CSS3 — Estilos con diseño responsive
• ESLint — Linter para mantener un código consistente

🚀 Instalación local

1. Clona el repositorio:

   git clone https://github.com/JuanaGonzalez21/BodyMass.github.io.git
   cd BodyMass.github.io

2. Instala las dependencias:

   npm install

3. Arranca el servidor de desarrollo:

   npm run dev

4. Abre http://localhost:5173 en tu navegador.

📚 Lo que aprendí

Algunas cosas que reforcé construyendo este proyecto:

• Manejo de estado en React con useState para los inputs y el resultado del cálculo
• Validación de inputs numéricos y manejo de casos borde (campos vacíos, valores no numéricos, división por cero)
• CSS responsive trabajando con un diseño que tiene breakpoints definidos
• Implementación pixel-perfect a partir de un diseño profesional, traduciendo medidas, colores y tipografías exactas
• Despliegue continuo con Vercel, integrado con GitHub

🗺️ Mejoras futuras

• Agregar tests con Vitest y React Testing Library
• Soporte para guardar el historial de cálculos en localStorage
• Modo oscuro
• Animaciones suaves al cambiar el resultado

🙏 Agradecimientos

Diseño original del reto: Frontend Mentor — plataforma con retos de implementación basados en diseños profesionales reales.

👩‍💻 Autora

Juana Valentina González Ardila
Desarrolladora Web · Ingeniera de Sistemas

• 💼 LinkedIn: @juanagonzalezardila
• 🐙 GitHub: @JuanaGonzalez21