Un dashboard financiero interactivo construido con React 18, Vite, Tailwind CSS, Zustand, Dexie DB y Chart.js. Gestiona cuentas, transacciones, categorías, presupuestos y metas con persistencia local, visualizaciones avanzadas y un diseño profesional adaptable a cualquier dispositivo.
- 🌞🌚 Modo claro y oscuro — con persistencia usando Zustand y soporte completo de Tailwind.
- � Gestión de cuentas — tarjetas realistas, detalles, CRUD y estadísticas por cuenta.
- 💸 Transacciones avanzadas — historial, filtros, búsqueda, CRUD, análisis y acciones rápidas.
- 📊 Gráficos interactivos — evolución mensual, distribución por categorías, métricas clave y alertas visuales (Chart.js).
- 🏷️ Categorías y presupuestos — análisis de gastos, alertas de presupuesto, colores e iconos personalizados.
- 🎯 Metas financieras — progreso visual, fechas límite, alertas inteligentes y barras animadas.
- 🛡️ Persistencia local — Dexie DB (IndexedDB) para datos offline y generación de datos demo.
- ⚡ Alertas inteligentes — notificaciones de saldo bajo, sobregiro, metas próximas y presupuestos excedidos.
- 🧭 Sidebar y navegación — diseño profesional, animaciones suaves y experiencia UX moderna.
- 📱 Responsive — diseño adaptable a cualquier pantalla, mobile-first.
| Categoría | Tecnología |
|---|---|
| Framework | React 18 |
| Bundler | Vite |
| Estilos | Tailwind CSS |
| Estado global | Zustand |
| Persistencia | Dexie.js (IndexedDB) |
| Visualización datos | Chart.js + react-chartjs-2 |
| Iconos | Lucide React |
- Clona el repositorio:
git clone https://github.com/ArcGabicho/finance-dashboard-v2.git cd finance-dashboard-v2 - Instala las dependencias:
npm install
- Inicia el entorno de desarrollo:
npm run dev
- Abre http://localhost:5173 en tu navegador.
Creado con 💙 por ArcGabicho
Este proyecto está bajo licencia MIT. Puedes usarlo y modificarlo libremente dando el crédito correspondiente.