Capítulo 16 - Diagramas C4 - Sistema Bancario BP

Contexto del Sistema Bancario BP

flowchart TD
    %% === TÍTULO PRINCIPAL ===
    Title[🏦 Sistema Bancario BP

Diagrama de Contexto - Arquitectura del Sistema]

    %% === USUARIOS DEL SISTEMA ===
    subgraph Users[👥 Usuarios del Sistema]
        direction LR
        U1[👤
Cliente Bancario
Realiza operaciones bancarias
vía web o app móvil]
        U2[👨‍💼
Empleado del Banco
Gestiona cuentas y aprueba
transacciones]
        U3[👨‍💻
Administrador
Gestiona y monitorea
la plataforma]
    end

    %% === SISTEMA PRINCIPAL ===
    BP[🏦
Sistema Bancario BP
Plataforma bancaria digital completa
Gestión de cuentas, transferencias, pagos
y consultas en tiempo real]

    %% === SISTEMAS EXTERNOS ORGANIZADOS ===
    subgraph ExternalSystems[🔗 Sistemas Externos]
        direction TB
        
        subgraph Comms[📧 Comunicaciones]
            E1[📧
Servicio de Email]
            E2[📱
Proveedor SMS]
            E3[🔔
Firebase FCM]
        end

        subgraph Payments[💳 Pagos e Identidad]
            E4[💸
Red ACH]
            E5[💳
Gateway de Pagos]
            E6[🆔
Proveedor Identidad]
        end

        subgraph Infra[🛠️ Infraestructura]
            E7[☁️
Almacenamiento Cloud]
            E8[📊
Monitoreo]
        end
    end

    %% === CONEXIONES CON ETIQUETAS ===
    U1 -->|Realiza operaciones bancarias
Web & App Móvil
HTTPS/WSS| BP
    U2 -->|Gestiona operaciones
Aprueba transacciones
HTTPS| BP
    U3 -->|Administra y monitorea
el sistema
HTTPS/SSH| BP

    BP -->|Envía notificaciones
por correo
SMTP/API REST| E1
    BP -->|Envía mensajes SMS
y códigos OTP
API REST| E2
    BP -->|Envía notificaciones
push móviles
FCM API| E3
    BP -->|Procesa transferencias
interbancarias
ISO 8583/SWIFT| E4
    BP -->|Procesa pagos
con tarjeta
API REST/Webhooks| E5
    BP -->|Verifica identidad
de usuarios - KYC
API REST| E6
    BP -->|Almacena documentos
y backups
S3 API| E7
    BP -->|Envía métricas
y logs
Prometheus/Loki| E8

    %% === ESTILOS CON COLORES PASTEL ===
    classDef title fill:#FCE4EC,stroke:#C2185B,stroke-width:2px,rx:15,ry:15
    classDef users fill:#E8F5E9,stroke:#4CAF50,stroke-width:2px,rx:12,ry:12
    classDef mainSystem fill:#E3F2FD,stroke:#1976D2,stroke-width:2px,rx:12,ry:12
    classDef external fill:#FFF3E0,stroke:#FF9800,stroke-width:2px,rx:10,ry:10
    classDef comms fill:#F3E5F5,stroke:#9C27B0,stroke-width:1px,rx:8,ry:8
    classDef payments fill:#E0F2F1,stroke:#00897B,stroke-width:1px,rx:8,ry:8
    classDef infra fill:#FFEBEE,stroke:#D32F2F,stroke-width:1px,rx:8,ry:8
    classDef userItem fill:#FFFFFF,stroke:#4CAF50,stroke-width:1px,rx:8,ry:8
    classDef externalItem fill:#FFFFFF,stroke:#666666,stroke-width:1px,rx:6,ry:6

    %% APLICAR ESTILOS ===
    class Title title
    class Users users
    class BP mainSystem
    class ExternalSystems external
    class Comms comms
    class Payments payments
    class Infra infra
    class U1,U2,U3 userItem
    class E1,E2,E3,E4,E5,E6,E7,E8 externalItem

    %% ESTILOS DE LÍNEAS ===
    linkStyle 0,1,2 stroke:#4CAF50,stroke-width:2px
    linkStyle 3,4,5 stroke:#9C27B0,stroke-width:1.5px
    linkStyle 6,7,8 stroke:#00897B,stroke-width:1.5px
    linkStyle 9,10 stroke:#D32F2F,stroke-width:1.5px

🔑 Leyenda del Diagrama de Contexto

Person (Azul): Usuarios humanos del sistema
System (Azul oscuro): El sistema que estamos documentando
System_Ext (Gris): Sistemas externos fuera de nuestro control
Rel (Flechas): Relaciones/interacciones entre elementos

📦 Diagrama 2: Contenedores del Sistema (C4 Level 2)

Arquitectura de Contenedores - Sistema Bancario BP

flowchart TD
    %% === TÍTULO PRINCIPAL ===
    Title[🏦 Sistema Bancario BP - Arquitectura de Contenedores]

    %% === USUARIOS ===
    subgraph Users[👥 Usuarios]
        direction LR
        U1[👤
Cliente Bancario
Accede desde web o móvil]
        U2[👨‍💼
Empleado Banco
Gestiona operaciones]
    end

    %% === APLICACIONES CLIENTE ===
    subgraph ClientApps[📱 Aplicaciones Cliente]
        direction LR
        A1[📱
App Móvil
React Native
iOS/Android]
        A2[🌐
App Web
React.js + Vite
SPA]
    end

    %% === API GATEWAY ===
    GW[🔌
API Gateway
Kong/NGINX + Node.js
OAuth 2.0, Rate Limiting]

    %% === MICROSERVICIOS ACTUALIZADOS ===
    subgraph Microservices[⚙️ Microservicios]
        direction TB
        
        subgraph CoreBanking[💼 Servicios Bancarios Core]
            M1[🔐
MS-Autenticación
Node.js + Passport.js
:3005 REST]
            M2[👤
MS-Datos-Cliente
Node.js + GraphQL
:3004 GraphQL]
            M3[💸
MS-Pagos-Internos
Node.js + GraphQL
:3002 GraphQL]
            M4[🌐
MS-Pagos-Interbancarios
Node.js + GraphQL
:3003 GraphQL + SAGA]
        end

        subgraph DataServices[📊 Servicios de Datos]
            M5[📈
MS-Históricos
Node.js + GraphQL
:3001 GraphQL CQRS]
            M6[📝
MS-Auditoría
Node.js + GraphQL
:3006 GraphQL + Worker Pool]
            M7[📢
MS-Notificaciones
Node.js + Bull Queue
:3007 GraphQL + Workers]
            M8[📁
MS-Archivos
Node.js + Multer
:3008 REST]
        end
    end

    %% === BASE DE DATOS ===
    subgraph Databases[🗄️ Bases de Datos]
        direction LR
        DB1[🐘
PostgreSQL
Primary
Cuentas, Transacciones]
        DB2[🐘
PostgreSQL
Replicas
Lecturas, Consultas]
        DB3[🍃
MongoDB
Documentos, Históricos, Logs]
        DB4[🔴
Redis Cluster
Sesiones, Cache, Temporal]
        DB5[☁️
Cloud Storage
Archivos, Documentos]
    end

    %% === INFRAESTRUCTURA ===
    subgraph Infrastructure[🔄 Infraestructura]
        direction LR
        I1[📬
Apache Kafka
Event Streaming, CQRS]
        I2[🔑
HashiCorp Vault
Secrets, API Keys]
        I3[⚡
Bull Queue
Jobs, Workers]
    end

    %% === SISTEMAS EXTERNOS ===
    subgraph External[🌍 Sistemas Externos]
        direction LR
        E1[💳
Red ACH
Transferencias Interbancarias]
        E2[🔔
Firebase
Push Notifications]
        E3[📧
Email/SMS
SendGrid, Twilio]
    end

    %% === CONEXIONES PRINCIPALES ===
    Users --> ClientApps
    ClientApps -->|HTTPS/REST/GraphQL| GW
    GW -->|GraphQL Federation| Microservices

    %% === CONEXIONES API GATEWAY A MICROSERVICIOS ===
    GW -->|Autentica
REST/gRPC| M1
    GW -->|Consulta datos
GraphQL| M2
    GW -->|Transferencias internas
GraphQL| M3
    GW -->|Transferencias externas
GraphQL| M4
    GW -->|Consulta históricos
GraphQL| M5
    GW -->|Registro auditoría
GraphQL| M6
    GW -->|Envía notificaciones
GraphQL| M7
    GW -->|Gestiona archivos
REST| M8

    %% === CONEXIONES MICROSERVICIOS A DATOS ===
    M1 -->|Usuarios/Sesiones
SQL/TLS| DB1
    M1 -->|Cache sesiones
Redis Protocol| DB4
    M1 -->|Secrets
HTTPS/API| I2
    
    M2 -->|Datos cliente
SQL/TLS| DB1
    M2 -->|Cache consultas
Redis Protocol| DB4
    
    M3 -->|Transacciones
SQL/TLS| DB1
    M3 -->|Eventos pagos
Kafka Protocol| I1
    
    M4 -->|Transacciones
SQL/TLS| DB1
    M4 -->|SAGA Orchestration
Kafka Protocol| I1
    M4 -->|Transferencias ACH
ISO 8583| E1
    
    M5 -->|Datos lectura
SQL/TLS| DB2
    M5 -->|Históricos
MongoDB Protocol| DB3
    
    M6 -->|Consume eventos
Kafka Protocol| I1
    M6 -->|Logs auditoría
MongoDB Protocol| DB3
    
    M7 -->|Jobs notificaciones
Bull Queue| I3
    M7 -->|Push notifications
FCM API| E2
    M7 -->|Email/SMS
HTTPS/API| E3
    
    M8 -->|Metadatos
MongoDB Protocol| DB3
    M8 -->|Archivos
Cloud Storage API| DB5
    M8 -->|Cache archivos
Redis Protocol| DB4

    %% === ESTILOS CON COLORES PASTEL ===
    classDef title fill:#FCE4EC,stroke:#C2185B,stroke-width:2px,rx:15,ry:15
    classDef users fill:#E8F5E9,stroke:#4CAF50,stroke-width:2px,rx:12,ry:12
    classDef clientApps fill:#E3F2FD,stroke:#1976D2,stroke-width:2px,rx:12,ry:12
    classDef gateway fill:#FFF3E0,stroke:#FF9800,stroke-width:2px,rx:12,ry:12
    classDef microservices fill:#F3E5F5,stroke:#9C27B0,stroke-width:2px,rx:12,ry:12
    classDef coreBanking fill:#E0F2F1,stroke:#00897B,stroke-width:1px,rx:10,ry:10
    classDef dataServices fill:#FFEBEE,stroke:#D32F2F,stroke-width:1px,rx:10,ry:10
    classDef databases fill:#FFF9C4,stroke:#FBC02D,stroke-width:2px,rx:12,ry:12
    classDef infrastructure fill:#E8EAF6,stroke:#3F51B5,stroke-width:2px,rx:12,ry:12
    classDef external fill:#F3E5F5,stroke:#7B1FA2,stroke-width:2px,rx:12,ry:12
    classDef item fill:#FFFFFF,stroke:#666666,stroke-width:1px,rx:8,ry:8

    %% APLICAR ESTILOS ===
    class Title title
    class Users users
    class ClientApps clientApps
    class GW gateway
    class Microservices microservices
    class CoreBanking coreBanking
    class DataServices dataServices
    class Databases databases
    class Infrastructure infrastructure
    class External external
    class U1,U2,A1,A2,M1,M2,M3,M4,M5,M6,M7,M8,DB1,DB2,DB3,DB4,DB5,I1,I2,I3,E1,E2,E3 item

🔑 Leyenda del Diagrama de Contenedores

Container (Azul): Aplicación o servicio ejecutable
ContainerDb (Azul con cilindro): Base de datos o almacenamiento
System_Boundary (Línea punteada): Límite del sistema
Tecnologías indicadas: Stack tecnológico de cada contenedor

Frontend React Native, React.js, TypeScript, Redux Toolkit

Backend Node.js, Express, GraphQL, REST APIs

Databases PostgreSQL 15, MongoDB 6, Redis 7

Messaging Apache Kafka, Zookeeper

Security OAuth 2.0, JWT, HashiCorp Vault

Gateway Kong Gateway, NGINX, Rate Limiting

🔧 Diagrama 3: Componentes del MS-Pagos (C4 Level 3)

Arquitectura de Componentes - Microservicio de Pagos

flowchart TD
    %% === TÍTULO PRINCIPAL ===
    Title[🔧 MS-Pagos - Diagrama de Componentes

Microservicio de Procesamiento de Pagos con Event Sourcing]

    %% === API GATEWAY ===
    GW[🌐
API Gateway
Apollo Gateway
GraphQL Federation :8080]

    %% === MICROSERVICIO PRINCIPAL - ARRIBA ===
    subgraph MSPagos[💸 MS-Pagos - Microservicio de Pagos]
        direction TB
        
        subgraph EntryLayer[🔐 Capa de Entrada & Seguridad]
            C1[🛡️
Payment API Controller
Express.js REST
Valida JWT, Rate Limiting]
            C2[🔑
Auth Middleware
JWT Validator
Verifica OAuth 2.0, Claims]
            C12[🔒
Encryption Service
AES-256-GCM
Cifrado datos sensibles]
        end

        subgraph BusinessLayer[💼 Lógica de Negocio Core]
            C3[⚙️
Transfer Service
Business Logic
Orquesta proceso transferencia]
            C4[✅
Validation Component
Joi/Zod Schemas
Valida montos, límites diarios]
            C5[🕵️
Fraud Detection
ML Model + Rules Engine
Scoring riesgo, bloqueo automático]
            C6[🔄
Saga Orchestrator
Saga Pattern
Coordina transacciones distribuidas]
        end

        subgraph DataLayer[💾 Capa de Datos & Eventos]
            C9[💾
Transaction Repository
TypeORM/Sequelize
Acceso datos transaccionales]
            C13[📨
Event Box
Outbox Pattern
Garantiza entrega eventos atómica]
            C14[🔄
CQRS Projector
Projection Handler
Sincroniza datos lectura]
            C10[📢
Event Publisher
Kafka Producer
Publica eventos de dominio]
            C11[📝
Audit Logger
Winston/Pino
Registro compliance, auditoría]
        end

        subgraph InfrastructureLayer[🛠️ Infraestructura & Comunicación]
            C7[⚡
Circuit Breaker
Opossum/Hystrix
Fail-fast, fallback logic]
            C8[🌐
ACH Network Client
ISO 8583 Protocol
Cliente red interbancaria]
        end
    end

    %% === SISTEMAS EXTERNOS - HORIZONTALMENTE POR DEBAJO ===
    E2[🐘
PostgreSQL
PostgreSQL 15
Base transaccional ACID]
    E6[🍃
MongoDB
MongoDB 6
Consultas optimizadas]
    E3[🔴
Redis
Redis 7 Cluster
Cache, locks distribuidos]
    E4[📬
Kafka
Kafka 3.x + Zookeeper
Event streaming, mensajería]
    E1[💳
Red ACH
Sistema interbancario
Transferencias externas]
    E5[🔑
Vault
HashiCorp Vault
Gestión secrets, certificados]

    %% === CONEXIONES PRINCIPALES ===
    GW -->|Envía requests
HTTPS/REST/GraphQL| C1

    %% === CONEXIONES CAPA DE ENTRADA ===
    C1 -->|Valida autenticación
In-Memory| C2
    C1 -->|Procesa transferencia
Function Call| C3

    %% === CONEXIONES LÓGICA DE NEGOCIO ===
    C3 -->|Valida datos entrada
Function Call| C4
    C3 -->|Verifica patrones fraude
Function Call| C5
    C3 -->|Inicia orquestación saga
Function Call| C6
    C3 -->|Registra operación auditoría
Function Call| C11

    %% === CONEXIONES SAGA ORCHESTRATOR ===
    C6 -->|Persiste transacción
SQL| C9
    C6 -->|Llama servicio externo
Function Call| C7
    C6 -->|Publica eventos negocio
Function Call| C10
    C6 -->|Cifra datos sensibles
Function Call| C12

    %% === PATRÓN CQRS - FLUJO ESCRITURA ===
    C9 -->|Evento outbox transaccional
SQL Transaction| C13

    %% === CONEXIONES INFRAESTRUCTURA ===
    C7 -->|Ejecuta transferencia protegida
Function Call| C8

    %% === CONEXIONES A SISTEMAS EXTERNOS ===
    C2 -->|Obtiene public keys
HTTPS/TLS 1.3| E5
    C9 -->|Guarda transacción
SQL/TLS 1.3| E2
    C9 -->|Usa locks distribuidos
Redis Protocol| E3
    C13 -->|Publica evento consistente
Kafka Protocol/SASL| E4
    E4 -->|Consume eventos
Kafka Consumer| C14
    C14 -->|Sincroniza datos lectura
Bulk Operations| E6
    C14 -->|Actualiza cache consultas
Redis Protocol| E3
    C8 -->|Envía transacción segura
ISO 8583/TLS| E1
    C10 -->|Publica mensaje eventos
Kafka Protocol/SASL| E4
    C11 -->|Envía log auditoría
Kafka Protocol| E4
    C12 -->|Obtiene keys cifrado
HTTPS/TLS 1.3| E5
    C5 -->|Lee scoring cache
Redis Protocol| E3

    %% === ESTILOS CON COLORES PASTEL ===
    classDef title fill:#FCE4EC,stroke:#C2185B,stroke-width:2px,rx:15,ry:15
    classDef gateway fill:#E3F2FD,stroke:#1976D2,stroke-width:2px,rx:12,ry:12
    classDef msPagos fill:#F3E5F5,stroke:#9C27B0,stroke-width:2px,rx:12,ry:12
    classDef entryLayer fill:#E8F5E9,stroke:#4CAF50,stroke-width:1px,rx:10,ry:10
    classDef businessLayer fill:#FFF3E0,stroke:#FF9800,stroke-width:1px,rx:10,ry:10
    classDef dataLayer fill:#E0F2F1,stroke:#00897B,stroke-width:1px,rx:10,ry:10
    classDef infrastructureLayer fill:#FFEBEE,stroke:#D32F2F,stroke-width:1px,rx:10,ry:10
    classDef externalSystems fill:#FFF9C4,stroke:#FBC02D,stroke-width:2px,rx:8,ry:8
    classDef component fill:#FFFFFF,stroke:#666666,stroke-width:1px,rx:8,ry:8

    %% APLICAR ESTILOS ===
    class Title title
    class GW gateway
    class MSPagos msPagos
    class EntryLayer entryLayer
    class BusinessLayer businessLayer
    class DataLayer dataLayer
    class InfrastructureLayer infrastructureLayer
    class C1,C2,C3,C4,C5,C6,C7,C8,C9,C10,C11,C12,C13,C14 component
    class E1,E2,E3,E4,E5,E6 externalSystems

    %% ESTILOS DE LÍNEAS ===
    linkStyle 0 stroke:#1976D2,stroke-width:2px
    linkStyle 1,2 stroke:#4CAF50,stroke-width:1.5px
    linkStyle 3,4,5,6 stroke:#FF9800,stroke-width:1.5px
    linkStyle 7,8,9,10 stroke:#00897B,stroke-width:1.5px
    linkStyle 11 stroke:#4CAF50,stroke-width:2px
    linkStyle 12 stroke:#D32F2F,stroke-width:1.5px
    %% Conexiones a sistemas externos
    linkStyle 13 stroke:#9C27B0,stroke-width:1.5px
    linkStyle 14 stroke:#0288D1,stroke-width:1.5px
    linkStyle 15 stroke:#FBC02D,stroke-width:1.5px
    linkStyle 16 stroke:#7B1FA2,stroke-width:1.5px
    linkStyle 17,18 stroke:#1976D2,stroke-width:1.5px
    linkStyle 19 stroke:#E64A19,stroke-width:1.5px
    linkStyle 20,21 stroke:#7B1FA2,stroke-width:1.5px
    linkStyle 22 stroke:#9C27B0,stroke-width:1.5px
    linkStyle 23 stroke:#FBC02D,stroke-width:1.5px

🔑 Leyenda del Diagrama de Componentes

Component (Verde): Componente interno del contenedor
Relaciones: Indican protocolo y tipo de comunicación
Patrones destacados: Circuit Breaker, Saga, Event Publishing

🏗️ Patrones Arquitectónicos Implementados en MS-Pagos

Circuit Breaker: Protección contra fallos en cascada con llamadas externas (ACH Network)
Saga Pattern: Transacciones distribuidas con compensaciones automáticas
Event Sourcing: Publicación de eventos para auditoría y sincronización
Repository Pattern: Abstracción del acceso a datos
Middleware Pattern: Autenticación y validación como middlewares reutilizables
Retry con Exponential Backoff: En ACH Client para manejar fallos temporales
Encryption at Rest: Datos sensibles cifrados con AES-256-GCM

🔐 Seguridad Implementada

OAuth 2.0 + JWT: Autenticación y autorización en Auth Middleware
TLS 1.3: Todas las comunicaciones cifradas (PostgreSQL, ACH Network, Vault)
SASL: Autenticación en Kafka para event publishing
AES-256-GCM: Cifrado de datos sensibles en reposo
Secret Management: Claves rotadas automáticamente desde Vault
Rate Limiting: En API Controller para prevenir abuse
Input Validation: Schemas estrictos con Joi/Zod
Audit Logging: Registro completo de todas las operaciones para compliance

☁️ Componentes Cloud Utilizados

Kubernetes (k3s/EKS): Orquestación de contenedores con auto-scaling (HPA)
Managed PostgreSQL (RDS/CloudSQL): Alta disponibilidad con réplicas multi-AZ
Managed Redis (ElastiCache): Cluster mode para distributed locks
Managed Kafka (MSK/Confluent): Event streaming con 3+ brokers
AWS S3/Backblaze: Backup de transacciones y logs de auditoría
CloudWatch/Prometheus: Métricas de performance y alertas
AWS Secrets Manager/Vault: Rotación automática de credenciales

Nivel	Diagrama	Audiencia	Enfoque
C4 Level 1	Contexto	Stakeholders, Gerencia	Sistema en su entorno, actores, sistemas externos
C4 Level 2	Contenedores	Arquitectos, Tech Leads	Apps, servicios, bases de datos, tecnologías
C4 Level 3	Componentes	Desarrolladores	Componentes internos, patrones, seguridad

Capítulo 17: Anexo diagramas C4 Models

📐 Diagramas C4 - Sistema Bancario BP

📍 Diagrama 1: Contexto del Sistema (C4 Level 1)

🏦 Sistema Bancario BP

🔑 Leyenda del Diagrama de Contexto

📦 Diagrama 2: Contenedores del Sistema (C4 Level 2)

🏦 Sistema Bancario BP - Arquitectura de Contenedores

🔑 Leyenda del Diagrama de Contenedores

🔧 Diagrama 3: Componentes del MS-Pagos (C4 Level 3)

🔧 MS-Pagos - Diagrama de Componentes

🔑 Leyenda del Diagrama de Componentes

🏗️ Patrones Arquitectónicos Implementados en MS-Pagos

🔐 Seguridad Implementada

☁️ Componentes Cloud Utilizados

✅ Resumen de Diagramas C4

📊 Tres Niveles de Abstracción

🎯 Decisiones Arquitectónicas Clave Visualizadas

📐 Convenciones C4 Seguidas

🔗 Referencias