💰 Finanzas - Personal Finance Dashboard

📝 Description / Descripción

English: A modern personal finance management application built with Next.js 14. Track expenses, income, debts, credit cards, and budgets with AI-powered predictions and Telegram notifications.

Español: Una aplicación moderna de gestión de finanzas personales construida con Next.js 14. Rastrea gastos, ingresos, deudas, tarjetas de crédito y presupuestos con predicciones impulsadas por IA y notificaciones de Telegram.

🚀 Features / Características

English:

• Dashboard with financial overview
• Expense and income tracking
• Credit card management with payment alerts
• Debt tracking with payment scheduling
• Budget management with visual progress
• AI-powered spending predictions
• Telegram bot notifications for alerts
• Secure authentication with OTP
• Data synchronization across devices
• Responsive design for mobile and desktop

Español:

• Dashboard con resumen financiero
• Seguimiento de gastos e ingresos
• Gestión de tarjetas de crédito con alertas de pago
• Seguimiento de deudas con programación de pagos
• Gestión de presupuestos con progreso visual
• Predicciones de gastos impulsadas por IA
• Notificaciones de bot de Telegram para alertas
• Autenticación segura con OTP
• Sincronización de datos entre dispositivos
• Diseño responsive para móvil y escritorio

🛠️ Tech Stack / Stack Tecnológico

• Framework: Next.js 14 (App Router)
• Language: TypeScript
• Styling: Tailwind CSS
• UI Components: Custom + shadcn/ui
• State Management: Zustand
• Authentication: JWT + OTP
• AI: OpenAI API for predictions
• Notifications: Telegram Bot API
• Database: JSON-based storage (server-side)
• Build Output: Static export

📊 Dashboard Components

• Summary Cards: Total balance, monthly income/expenses
• Charts: Expense breakdown, spending trends
• Alerts: Payment due dates, budget warnings
• Quick Actions: Add transactions, view reports

🔧 Setup / Configuración

English:

1. Install dependencies: npm install
2. Set environment variables in .env.local
3. Run development server: npm run dev
4. Build for production: npm run build

Español:

1. Instala dependencias: npm install
2. Configura variables de entorno en .env.local
3. Ejecuta servidor de desarrollo: npm run dev
4. Construye para producción: npm run build

🌐 Environment Variables

OPENAI_API_KEY=your_openai_key
TELEGRAM_BOT_TOKEN=your_telegram_token
JWT_SECRET=your_jwt_secret

👨‍💻 Author / Autor

Renato CBC

• GitHub: renato97

📄 License / Licencia

Private project / Proyecto privado

---

Tags / Etiquetas: nextjs react typescript finance dashboard tailwind ai telegram