Skip to content

Plataforma web de diagnósticos y asesoría financiera accesible para personas y empresas. Integración con Gemini AI.

Notifications You must be signed in to change notification settings

Proyecto-Haroldo/Frontend

Repository files navigation

Haroldo Finanzas

¡Bienvenid@! Haroldo Finanazas aplicativo web moderno diseñado para gestionar, analizar y fortalecer la educación financiera de los usuarios mediante herramientas interactivas, reportes inteligentes, seguimiento personalizado, y un microservicio de IA para recomendaciones financieras basadas en Gemini.

Este proyecto surge como una propuesta para el cumplimiento del requisito de Trabajo de Grado 2025-2, bajo la modalidad Producto obtenido en Laboratorio o Semillero de investigación de la Institución Universitaria ITM. En convenio con la Facultad de Ingenierías y la Facultad de Ciencias Económicas y Administrativas, y bajo la asesoría del Semillero de Investigación Data Urban: Innovación y ciencia de datos (LowCode).


¿Por qué?

En un mundo donde las decisiones financieras son esenciales para la estabilidad y el crecimiento personal, contar con una herramienta que permita evaluar conocimientos, recibir retroalimentación inteligente y mejorar hábitos financieros resulta indispensable. Haroldo Finanzas responde a esos retos combinando educación financiera, análisis de datos y automatización con IA.

Objectivo

Desarrollar una plataforma web inteligente de diagnóstico financiero que permita a personas naturales y jurídicas evaluar su situación económica mediante cuestionarios dinámicos y análisis automatizados con inteligencia artificial, generando informes personalizados y recomendaciones prácticas que fortalezcan la toma de decisiones, la planeación financiera y la gestión eficiente de los recursos.

Actores

  • Usuario (Persona Natural o Jurídica): Completa el cuestionario financiero y recibe un diagnóstico. Puede agendar reuniones con asesores y consultar su historial.

  • Asesor Financiero: Valida respuestas, genera diagnósticos y proporciona asesoría personalizada. Agenda reuniones y responde consultas.

  • Administrador: Gestiona usuarios, asesores y accesos. Supervisa la plataforma y mantiene el control sobre la seguridad y el funcionamiento general.

Funcionalidades

Gestión de Usuarios

  • Registro e inicio de sesión para usuarios y asesores.

  • Control de acceso según roles (usuario, asesor, administrador).

Diagnóstico Financiero

  • Formulario de 100 preguntas personalizadas según tipo de usuario.

  • Clasificación con semáforo: Verde (bueno), Amarillo (riesgo), Rojo (grave).

  • Validación de diagnóstico por asesor.

Asesoría Personalizada

  • Programación de reuniones virtuales o presenciales.

  • Chat en tiempo real y opción para que el asesor complete el formulario por el usuario.

Entrega del Diagnóstico

  • Diagnóstico entregado en 1-2 días por correo electrónico o notificación en la plataforma.

Seguimiento y Reportes

  • Almacenamiento de diagnósticos para seguimiento.

  • Reportes de impacto de la asesoría y avances financieros.


Herramientas


Frontend

  • TypeScript

  • React

  • Vite

  • Docker

  • Vercel

  • Axios

  • Librerias React-based

Backend

  • Java

  • Docker

  • Render

  • Swagger

  • PostgeSQL

  • SpringBoot

  • Gemini AI


Trabajo de Grado

social-media-logo social-media-logo social-media-logo social-media-logo social-media-logo social-media-logo social-media-logo social-media-logo


Desarrollo

A continuación se describen los estudiantes involucrados en la investigación, planeación, desarrollo y presentación del proyecto Haroldo Finanzas como opción de Trabajo de Grado 2025-2 en la Institución Universitaria ITM, miembros de los programas TECNOLOGÍA EN DESARROLLO DE SOFTWARE y TECNOLOGÍA EN DESARROLLO DE APLICACIONES PARA DISPOSITIVOS MÓVILES.

Asesores


Recursos

  1. En este link, podrás observar el Gestor de tareas y planeador de Sprints (ROADMAP) para proyecto en Jira:

  2. En este link, prodrás observar el Mockup y Prototipo de nuestro proyecto diseñado en Figma:

  3. En este link, podrás observar nuestro proyecto desplegado en Vercel:

  4. En este link, podrás explorar nuestra organización de GitHub, donde encontrarás los repositorios de desarrollo de nuestro proyecto:

P.S: En caso de que solicites comunicarte con neustor equipo de desarrollo, puedes enviar un correo a [email protected].


Credenciales

Para acceder al panel de administración, usa las siguientes credenciales:

Para acceder al panel de asesor, usa las siguientes credenciales:

Para acceder al panel de cliente, usa las siguientes credenciales:

P.S: Estas credenciales solo deben usarse para motivos de demo/testeo. No utilizar para entornos de producción.


Estructura del Proyecto

├── /public
│   ├── /assets
│   ├── /img
│   └── /svg
├── /src
│   ├── /api
│   │   ├── apiClient.ts
│   │   └── anyApi.ts
│   ├── /core
│   │   └── /models
│   ├── /pages
│   │   ├── /admin
│   │   ├── /adviser
│   │   ├── /auth
│   │   └── /client
│   ├── /shared
│   │   ├── /hooks
│   │   ├── /context
│   │   ├── /types
│   │   └── /ui
│   │       ├── /components
│   │       ├── /layout
│   │       ├── /validator
│   │       └── /template
│   ├── /core
│   │   ├── /dto
│   │   └── /models
│   ├── /features/any
│   │   ├── /types
│   │   ├── /hooks
│   │   ├── /components
│   │   └── anySlice.ts
│   ├── /lib
│   │   ├── /utils
│   │   └── store.ts
│   ├── App.tsx
│   ├── AppContent.tsx
│   ├── index.css
│   ├── main.tsx
│   └── vite-env.d.ts
├── .env*
├── .gitignore
├── .dockerignore
├── package.json
├── Dockerfile
├── README.md
└── ...

Installation

  1. Clona los repositorios:
# Frontend
git clone https://github.com/Proyecto-Haroldo/Frontend

# Backend
git clone https://github.com/Proyecto-Haroldo/Backend

# IA Microservice
git clone https://github.com/Proyecto-Haroldo/IA-Microservice 
  1. Usa el docker-compose en la carpeta del backend (/Backend):
services:
  backend:
    build: .
    container_name: backend-haroldo
    ports:
      - "8080:8080"
    environment:
      SPRING_DATASOURCE_URL: jdbc:postgresql://aws-0-us-east-2.pooler.supabase.com:6543/postgres?preferQueryMode=simple
      SPRING_DATASOURCE_USERNAME: postgres.umtlidnqgmsutxwmljyx
      SPRING_DATASOURCE_PASSWORD: uXrnxCb6DRWJCV9n
      MICROSERVICE_IA_URL: http://microservicio-ia:8081/ia/recomendacion
    depends_on:
      - microservicio-ia
    networks:
      - haroldo-network
    dns:
      - 8.8.8.8
      - 8.8.4.4

  microservicio-ia:
    build: ../IA-Microservice
    container_name: microservicio-ia-haroldo
    ports:
      - "8081:8081"
    environment:
      GEMINI_API_KEY: YOUR_API_KEY
    networks:
      - haroldo-network

  frontend:
    build: ../Frontend
    container_name: frontend-haroldo
    ports:
      - "5173:5173"
    depends_on:
      - backend
    networks:
      - haroldo-network

networks:
  haroldo-network:
    driver: bridge
  1. Corre el contenedor de Docker del proyecto desde la terminal de comandos:
# Both Backend and Frontend for production (Next with `npm run start`)
docker compose up --build

# Backend for production and Frontend for dev (Next with hot reload `npm run dev`)
docker compose run --service-ports Frontend npm run dev
  1. Ahora, debido al .gitignore, al clonar el respositorio de frontend no tendras el archivo con las variables de entorno de este proyecto. Para solucionar esto, crea un archivo de nombre .env en la raíz del directorio del proyecto (/Frontend):
# File name
.env

P.S: Utilizar como base el archvio .env.example.

  1. Luego, escribe el valor de la variable de entorno como exactamente como se muestra a continuación:
NEXT_PUBLIC_GITHUB_API_URL=https://backend-oaij.onrender.com/api
  1. Finalmente, abre http://localhost:5173 en tu navegador y disfruta de nuestro proyecto.

P.S: El backend lo encontrarás en http://localhost:8080/swagger-ui/index.html y el microservicio de IA en http://localhost:8081.


Integración con Token

Para más información sobre nuestra integración de frontend y backend, utilizando tokens y el microservicio de IA, puedes observar nuestro archivo README de nombre README_TOKEN_INTEGRATION.md, el cual encontrarás en la raíz del directorio de nuestro repositorio de Frontend.



Te agradecemos por visitar nuestro amado proyecto.
Saludos del Equipo Haroldo Finanzas.



Haroldo-Finanzas

2025 Haroldo Finanzas. Institución Universitaria ITM
© Todos los derechos reservados.

About

Plataforma web de diagnósticos y asesoría financiera accesible para personas y empresas. Integración con Gemini AI.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Contributors 5

Languages