Skip to content
Mermaid templates

C4 — Containers

C4 level-2: containers (apps, services, stores) inside the system.

Template previewMermaid
Rendering…

Make it your own.

flowchart TB
    classDef container fill:#438dd5,color:#fff,stroke:#2563eb;
    classDef db fill:#1f6f43,color:#fff,stroke:#0f5132;
    classDef person fill:#08427b,color:#fff;

    User((Customer)):::person
    SPA[Web SPA<br/>React]:::container
    Mobile[Mobile App<br/>React Native]:::container
    API[API Gateway<br/>Node.js]:::container
    Auth[Auth Service<br/>Go]:::container
    Ledger[Ledger Service<br/>Java]:::container
    DB[(Postgres)]:::db
    Cache[(Redis)]:::db

    User --> SPA
    User --> Mobile
    SPA --> API
    Mobile --> API
    API --> Auth
    API --> Ledger
    Auth --> DB
    Ledger --> DB
    API --> Cache