Volver a proyectos

SpendControl

Origen

A veces llega el final del mes y el dinero ya no está, pero tampoco es fácil recordar en qué se fue. SpendControl nació para llevar ese control de una forma más directa: definir cuánto tienes disponible, registrar cada gasto y saber cuánto queda.

Estado
Publicado
Stack principal
React · TypeScript · CSS · Vite

Así funciona

Video demostrativo sin audio
Video demostrativo sin audio de SpendControl. Muestra sus principales pantallas e interacciones.

Construcción

Construí SpendControl como una SPA con React y Vite. No requiere una cuenta : el presupuesto y los gastos se guardan directamente en el navegador mediante LocalStorage, por lo que la información se conserva después de recargar la página.

Funcionamiento

La aplicación parte de un presupuesto inicial y actualiza el saldo cada vez que se registra, edita o elimina un gasto. Un indicador circular muestra cuánto se ha utilizado y cuánto queda disponible, sin necesidad de hacer cálculos por separado.

Gestión de gastos

Cada gasto se puede crear, editar, eliminar, categorizar y filtrar por tipo. En dispositivos móviles también incorporé gestos de deslizamiento para editar o eliminar registros directamente desde la lista.

Tecnologías y herramientas

  • React
  • TypeScript
  • CSS
  • Vite