Skip to content

Latest commit

 

History

History
41 lines (26 loc) · 2.67 KB

README.md

File metadata and controls

41 lines (26 loc) · 2.67 KB
Raw

Administrador de Presupuesto 💰

Una herramienta interactiva desarrollada en JavaScript puro para gestionar tus gastos y controlar tu presupuesto de manera efectiva. Inspirado en el curso de JavaScript del profesor Juan Pablo De la Torre Valdez.

Características Principales

  • Añadir Gastos: Permite añadir gastos y ver el monto restante del presupuesto.
  • Eliminar Gastos: Posibilidad de eliminar gastos específicos del listado.
  • Cálculo del Presupuesto Restante: Actualización automática del presupuesto restante al añadir o eliminar gastos.
  • Alertas Dinámicas: Mensajes de alerta para informar sobre la adición de gastos, errores en la entrada de datos y agotamiento del presupuesto.
  • Cambio de Colores: Indicadores visuales que cambian de color según el estado del presupuesto (suficiente, advertencia, crítico).

Tecnologías Utilizadas

  • JavaScript: Desarrollo de toda la lógica del proyecto para manejar el presupuesto y los gastos.
  • HTML y CSS: Proporcionados por el curso del profesor Juan Pablo De la Torre Valdez, con algunos ajustes menores para adaptarse a la lógica de JavaScript.
  • Manipulación del DOM: Uso de JavaScript para actualizar dinámicamente el DOM con la información de los gastos y el presupuesto restante.
  • Clases en JavaScript: Uso de clases para organizar el código, incluyendo clases para manejar el presupuesto y la interfaz de usuario.

Lecciones Aprendidas

  • Manipulación del DOM: Aprendí a seleccionar y modificar elementos del DOM, crear elementos dinámicamente y actualizar la interfaz de usuario en respuesta a las interacciones del usuario.
  • Uso de Clases en JavaScript: Implementé clases para estructurar mi código de manera más organizada y mantener la lógica del negocio (manejo del presupuesto) separada de la lógica de la interfaz de usuario.
  • Gestión de Eventos: Manejo de eventos del DOM para responder a las acciones del usuario, como la adición y eliminación de gastos.
  • Validación de Entradas: Implementé validaciones para asegurar que los datos ingresados por el usuario sean correctos y significativos.
  • Manejo de Estado: Aprendí a mantener y actualizar el estado de la aplicación (presupuesto y gastos) y reflejar estos cambios en la interfaz de usuario.

Instrucciones de Despliegue

  1. Clona este repositorio: git clone [email protected]:Kuro-98/administrador-de-presupuesto.git
  2. Abre el archivo index.html en tu navegador favorito.
  3. Introduce tu presupuesto inicial y comienza a gestionar tus gastos.

Créditos

Este proyecto fue desarrollado basado en los conocimientos adquiridos del curso de JavaScript del profesor Juan Pablo De la Torre Valdez.