- 4 minutes to read

L2 Container Diagram Example

The L2 Container diagram zooms into a single system and reveals its internal applications, services, databases, and message buses — including the technology choices and communication protocols.

See Example C4 Diagrams for an overview of all diagram types and when to use each.

To use this example in Nodinite, copy the Mermaid markup below and follow the Creating Your First C4 Diagram import walkthrough to create a Diagram Set, import the markup, and bind nodes to your Repository. Container nodes can bind to either Services or Systems — use the import wizard to choose the correct entity type for each node.

When to Use

  • Planning or reviewing a system's internal architecture
  • Communicating technology choices to technical teams
  • Identifying integration points and data flows between containers
  • Does not show code-level detail — that belongs in L3

Example: Order Management System Internal Structure

Preview Mermaid Code
C4Container title Order Management System - L2 Container Diagram Person(customer, "Customer", "Places orders via web or mobile") Boundary(order_system, "Order Management System") { Container(web_app, "Web Application", "React.js", "Displays orders and order history. Allows customers to place and track orders.") Container(mobile_app, "Mobile App", "React Native", "Allows customers to place orders on their phone") Container(admin_portal, "Admin Portal", "ASP.NET Core", "Internal tool for support agents to manage orders and refunds") Container(order_api, "Order API", "ASP.NET Core REST", "Provides order management capabilities to web, mobile, and admin applications") Container(fulfillment_svc, "Fulfillment Service", "Node.js", "Coordinates order fulfillment with warehouse ERP") ContainerDb(order_db, "Order Database", "SQL Server", "Stores customers, orders, and line items") ContainerDb(inventory_cache, "Inventory Cache", "Redis", "Caches current inventory levels") ContainerQueue(message_bus, "Message Bus", "Azure Service Bus", "Asynchronous event processing for order fulfillment") } System_Ext(payment_gateway, "Payment Gateway", "Processes payments") System_Ext(email_service, "Email Service", "Sends notifications") System_Ext(warehouse_erp, "Warehouse ERP", "Manages physical inventory") Rel(customer, web_app, "Uses", "HTTPS") Rel(customer, mobile_app, "Uses", "HTTPS") Rel(web_app, order_api, "Calls", "REST/JSON") Rel(mobile_app, order_api, "Calls", "REST/JSON") Rel(admin_portal, order_api, "Calls", "REST/JSON") Rel(order_api, order_db, "Reads/Writes", "SQL") Rel(order_api, inventory_cache, "Reads", "Redis Protocol") Rel(order_api, message_bus, "Publishes Order Placed event", "AMQP") Rel(fulfillment_svc, message_bus, "Subscribes to events", "AMQP") Rel(fulfillment_svc, warehouse_erp, "Sends fulfillment requests", "REST/JSON") Rel(order_api, payment_gateway, "Processes payment", "REST/JSON") Rel(order_api, email_service, "Sends notifications", "SMTP") 
C4Container
    title Order Management System - L2 Container Diagram

    Person(customer, "Customer", "Places orders via web or mobile")

    Boundary(order_system, "Order Management System") {
        Container(web_app, "Web Application", "React.js", "Displays orders and order history. Allows customers to place and track orders.")
        Container(mobile_app, "Mobile App", "React Native", "Allows customers to place orders on their phone")
        Container(admin_portal, "Admin Portal", "ASP.NET Core", "Internal tool for support agents to manage orders and refunds")

        Container(order_api, "Order API", "ASP.NET Core REST", "Provides order management capabilities to web, mobile, and admin applications")
        Container(fulfillment_svc, "Fulfillment Service", "Node.js", "Coordinates order fulfillment with warehouse ERP")

        ContainerDb(order_db, "Order Database", "SQL Server", "Stores customers, orders, and line items")
        ContainerDb(inventory_cache, "Inventory Cache", "Redis", "Caches current inventory levels")

        ContainerQueue(message_bus, "Message Bus", "Azure Service Bus", "Asynchronous event processing for order fulfillment")
    }

    System_Ext(payment_gateway, "Payment Gateway", "Processes payments")
    System_Ext(email_service, "Email Service", "Sends notifications")
    System_Ext(warehouse_erp, "Warehouse ERP", "Manages physical inventory")

    Rel(customer, web_app, "Uses", "HTTPS")
    Rel(customer, mobile_app, "Uses", "HTTPS")

    Rel(web_app, order_api, "Calls", "REST/JSON")
    Rel(mobile_app, order_api, "Calls", "REST/JSON")
    Rel(admin_portal, order_api, "Calls", "REST/JSON")

    Rel(order_api, order_db, "Reads/Writes", "SQL")
    Rel(order_api, inventory_cache, "Reads", "Redis Protocol")
    Rel(order_api, message_bus, "Publishes Order Placed event", "AMQP")

    Rel(fulfillment_svc, message_bus, "Subscribes to events", "AMQP")
    Rel(fulfillment_svc, warehouse_erp, "Sends fulfillment requests", "REST/JSON")

    Rel(order_api, payment_gateway, "Processes payment", "REST/JSON")
    Rel(order_api, email_service, "Sends notifications", "SMTP")

Test Data Setup

To recreate this diagram in Nodinite, create the following entities.

Domains (swimlanes):

  • Experience APIs
  • Process APIs
  • System APIs

Services in Experience APIs:

  • Web Application (C4ContainerType: WebApp, C4Technology: React.js)
  • Mobile App (C4ContainerType: MobileApp, C4Technology: React Native)
  • Admin Portal (C4ContainerType: WebApp, C4Technology: ASP.NET Core)

Services in Process APIs:

  • Order API (C4ContainerType: RestApi, C4Technology: ASP.NET Core REST)
  • Fulfillment Service (C4ContainerType: Service, C4Technology: Node.js)

Services in System APIs:

  • Order Database (C4ContainerType: Database, C4Technology: SQL Server)
  • Inventory Cache (C4ContainerType: Cache, C4Technology: Redis)
  • Message Bus (C4ContainerType: MessageBus, C4Technology: Azure Service Bus)

Next Step

Zoom further into the Order API with the L3: Component Diagram Example to see its internal modules.