← Volver a los casos
SaaS multi-tenant · Web · Frontend

Plataforma de gestión de riesgos y cumplimiento normativo

Una sola herramienta para que empresas de distintos rubros demuestren que cumplen normativas de privacidad y seguridad de la información.

Período
2024–2025
Equipo
4 a 6 devs
Mi rol
Frontend developer
Foco
100% frontend

Proyectos bajo acuerdo de confidencialidad. Los nombres de clientes, el código y las capturas no se muestran; los títulos son descriptivos.

Contexto

Plataforma web SaaS multi-tenant para gestionar el cumplimiento normativo: inventario de activos y actividades, análisis de riesgos, planes de tratamiento, controles de seguridad, gestión documental e informes.

La usan equipos de compliance, responsables de seguridad y consultores de organizaciones de distintos sectores. Trabajé en la SPA de administración.

Problema

Centralizar todo lo que una empresa necesita para demostrar que cumple normativas de privacidad y seguridad (estilo RGPD o estándares de seguridad de la información): qué activos y datos tiene, qué riesgos existen sobre ellos, qué medidas aplica y cómo evolucionan.

En la interfaz, el reto era presentar con claridad grandes volúmenes de datos relacionados entre sí: activos, riesgos y controles.

Qué hice

  • Dashboard con gráficos interactivos que llevan a las pantallas de detalle ya filtradas.
  • Grafo interactivo de dependencias entre activos y diagrama de Gantt para los planes de acción.
  • Exportación de informes de riesgos y tratamientos, con selección del tipo de informe.
  • Mapeo de equivalencias de controles entre distintos marcos normativos.
  • Validaciones de fechas y estados en el seguimiento de objetivos y acciones.
  • Paginación y filtros en listados y modales, y unificación visual de componentes (refactor de UX/UI).

Desafíos resueltos

  • Corregí un listener que provocaba llamadas infinitas a la API al crear entidades.
  • Arreglé la visualización de evaluaciones de impacto, que mezclaba activos agrupados y no agrupados.

Arquitectura

SPA en Angular organizada en módulos por funcionalidad, con una capa core (servicios, interceptores, guards) y componentes compartidos, que consume una API REST.

Stack

Frontend
  • Angular
  • TypeScript
  • RxJS
  • Angular Material
  • ApexCharts
  • Cytoscape
  • ngx-translate
  • SweetAlert2
  • ngx-toastr
Herramientas
  • Git
  • Docker
  • ESLint
  • Prettier

Resultado

Sigue en producción y las empresas cliente la usan como software interno.

Aprendizajes

Angular, RxJS y asincronía; trabajar sobre un código grande y con años de historia; visualización de datos con gráficos, grafos y diagramas de Gantt.