Files
2026-03-12 15:17:52 +07:00

2.2 KiB

C4 Architecture Document - Level 2: Container Diagram (Landing Page)

Describes the deployable components of the Landing Page system.

1. Container List

1.1. Sales Landing App (Frontend)

  • Technology: React, Vite, TailwindCSS.
  • Role: Provides the interactive interface (Responsive).
  • Features: Data input forms, Camera capture (for OCR), PDF Viewer, product navigation.

1.2. Backend For Frontend (BFF)

  • Technology: Node.js / Express (or Serverless Functions).
  • Role: Secures intermediary and API coordinator.
  • Features:
    • Hides Tokens/Secrets when making calls to the OCR and PDF APIs.
    • Manages user sessions.
    • Sanitizes and normalizes data before dispatching.

1.3. Local Storage / Caching DB

  • Technology: PostgreSQL (or Redis/LocalStorage depending on long-term storage needs). Based on the requirement to save customer data for future visits, PostgreSQL will be used.
  • Role: Stores draft customer information and temporary illustration history.

2. Container Diagram

C4Container
    title Container Diagram - Landing Page Sales Party

    Person(sales_agent, "Sales Agent", "Using personal device.")

    System_Boundary(landing_zone, "Landing Page System") {
        Container(web_app, "Sales Landing App", "React/Vite", "Mobile-first user interface.")
        Container(bff_api, "BFF Service", "Node.js", "Intermediary logic and security handler.")
        ContainerDb(local_db, "Client Cache DB", "PostgreSQL", "Stores draft customer information.")
    }

    System_Ext(auth_api, "Auth API", "Authentication")
    System_Ext(ocr_service, "OCR Service", "Image processing")
    System_Ext(pdf_engine, "PDF Engine", "PDF Generation")
    System_Ext(core_system, "Core System", "Stores contracts")

    Rel(sales_agent, web_app, "Interacts", "HTTPS")
    Rel(web_app, bff_api, "API Call", "JSON/HTTPS")
    
    Rel(bff_api, local_db, "Read/Write Customer Data", "SQL")
    Rel(bff_api, auth_api, "Auth Proxy", "REST")
    Rel(bff_api, ocr_service, "Calls OCR", "REST")
    Rel(bff_api, pdf_engine, "Calls PDF Gen", "REST")
    Rel(bff_api, core_system, "Submits application", "REST")

Authored by: Agent mbl-landing-page-architecture