Acme Platform

flowchart TB
    subgraph clients["CLIENTS"]
        direction LR
        WEB["🌐 Web App<br>React SPA"]
        MOB["📱 Mobile App<br>React Native"]
        CLI["💻 CLI<br>Developer tool"]
    end

    subgraph gateway["GATEWAY"]
        direction LR
        GW["🔒 API Gateway<br>Auth, rate-limit, routing"]
        LB["⚡ Load Balancer<br>L7, health checks"]
    end

    subgraph services["CORE SERVICES"]
        direction LR
        AUTH["👥 Auth Service<br>OAuth2, sessions"]
        ORDER["📦 Order Service<br>Cart, checkout"]
        SEARCH["🔍 Search Service<br>Full-text, filters"]
        NOTIFY["💬 Notification<br>Email, push, SMS"]
    end

    subgraph data["DATA STORES"]
        direction LR
        PG["🗃 PostgreSQL<br>Primary store"]
        REDIS["⚡ Redis<br>Cache, sessions"]
        ES["🔎 Elasticsearch<br>Search index"]
    end

    subgraph external["EXTERNAL"]
        direction LR
        STRIPE["💳 Stripe<br>Payments"]
        SG["📧 SendGrid<br>Email delivery"]
        SENTRY["🌎 Sentry<br>Error tracking"]
    end

    clients --> gateway
    gateway --> services
    AUTH --> PG
    AUTH --> REDIS
    ORDER --> PG
    ORDER --> REDIS
    SEARCH --> ES
    NOTIFY --> REDIS
    ORDER -.->|REST/TLS| STRIPE
    NOTIFY -.->|REST/TLS| SG
    services -.->|metrics| SENTRY
      

sequenceDiagram
    participant C as Client
    participant GW as API Gateway
    participant SVC as Service Layer
    participant DB as Data Store
    participant EXT as External API

    C->>GW: HTTPS request
    GW->>GW: Auth + rate-limit
    GW->>SVC: gRPC call
    SVC->>DB: Read/Write
    DB-->>SVC: Result
    SVC-->>GW: gRPC response
    GW-->>C: JSON response

    Note over SVC,EXT: Async side-effects
    SVC-->>EXT: Webhook / notification
    SVC-->>DB: Update cache