Skip to content

Latest commit

 

History

History
60 lines (42 loc) · 2.57 KB

README.md

File metadata and controls

60 lines (42 loc) · 2.57 KB

Calorie Tracker

Este es un proyecto web que permite realizar un cálculo de las calorías consumidas y quemadas, según los elementos que se vayan ingresando. El proyecto permite editar, cortar, eliminar datos y todo se almacena en el localStorage. Además, cuenta con un modo oscuro y se adapta a dispositivos móviles.

Funcionalidades

  • Cálculo de Calorías: Permite registrar y calcular calorías consumidas y quemadas.
  • Gestión de Datos: Posibilidad de editar, cortar y eliminar registros de calorías.
  • Almacenamiento Local: Los datos se almacenan en localStorage para persistencia entre sesiones.
  • Modo Oscuro: Incluye un modo oscuro para una mejor visualización en entornos con poca luz.
  • Responsive: La interfaz se adapta a dispositivos móviles para una experiencia de usuario óptima en cualquier dispositivo.

Tecnologías Utilizadas

  • React: Biblioteca de JavaScript para construir interfaces de usuario.
  • Tailwind CSS: Framework de CSS para diseño estilizado y responsivo.
  • TypeScript: Lenguaje de programación que añade tipos estáticos a JavaScript.
  • uuidv4: Biblioteca para generar identificadores únicos universales (UUID).
  • Vite: Herramienta de desarrollo frontend rápida y moderna.
  • useReducer: Hook de React para manejar el estado y la lógica del reducer.
  • react-icons: Biblioteca de iconos para React.

Instalación

Para instalar y ejecutar este proyecto localmente, sigue los siguientes pasos:

Prerrequisitos

Asegúrate de tener instalado Node.js y npm en tu máquina.

Pasos de Instalación

  1. Clonar el repositorio:

    git clone https://github.com/tu-usuario/calorie-tracker.git cd calorie-tracker

  2. Instalar las dependencias:

    npm install

  3. Ejecutar la aplicación:

    npm run dev Esto iniciará el servidor de desarrollo y podrás ver la aplicación en http://localhost:3000.

Uso

  1. Agregar Calorías: Utiliza el formulario para agregar nuevas calorías consumidas o quemadas.
  2. Editar Registros: Haz clic en el botón de editar para modificar un registro existente.
  3. Eliminar Registros: Haz clic en el botón de eliminar para quitar un registro de la lista.
  4. Modo Oscuro: Usa el botón de cambio de tema para alternar entre el modo claro y oscuro.
  5. Persistencia de Datos: Los datos se guardan automáticamente en el localStorage y se cargan al recargar la página.

Contribuir

Las contribuciones son bienvenidas. Si tienes alguna sugerencia o encuentras un error, por favor abre un issue o envía un pull request.