{"id":8101,"date":"2026-08-21T05:29:28","date_gmt":"2026-08-21T05:29:28","guid":{"rendered":"https:\/\/www.learn-vp.com\/fr\/gallery\/mastering-system-architecture-a-step-by-step-guide-to-c4-deployment-diagrams\/"},"modified":"2026-10-09T04:21:52","modified_gmt":"2026-10-09T04:21:52","slug":"mastering-system-architecture-a-step-by-step-guide-to-c4-deployment-diagrams","status":"publish","type":"gallery","link":"https:\/\/www.learn-vp.com\/fr\/gallery\/mastering-system-architecture-a-step-by-step-guide-to-c4-deployment-diagrams\/","title":{"rendered":"Mastering System Architecture: A Step-by-Step Guide to C4 Deployment Diagrams"},"content":{"rendered":"

\"C4<\/p>\n

When designing complex software systems like an Internet Banking platform, visualizing how different parts of the system interact and where they physically reside is crucial. This is where the C4 Model<\/strong> shines. Specifically, the Deployment Diagram<\/strong> provides a high-level view of the runtime environment, showing the software components and the hardware they run on.<\/p>\n

In this tutorial, we will dissect a real-world example: an Internet Banking System C4 Deployment Diagram. We will walk through the architecture layer by layer, explaining the technical relationships, the technology stack involved, and the architectural patterns at play.<\/p>\n

1. What is a C4 Deployment Diagram?<\/h2>\n

The C4 model is a hierarchical approach to software architecture documentation, consisting of four levels: Context, Container, Component, and Code. The diagram we are analyzing is a Deployment Diagram<\/strong>. Unlike a static context diagram, this view zooms in to show:<\/p>\n

    \n
  • Software Components:<\/strong> The actual applications running (e.g., Mobile App, API).<\/li>\n
  • Deployment Nodes:<\/strong> The physical or virtual hardware (e.g., Customer’s Device, Ubuntu Server).<\/li>\n
  • Relationships:<\/strong> How data flows between these nodes (e.g., API calls, Database connections).<\/li>\n<\/ul>\n
    \n \"Infographic
    The four architectural layers of the C4 model, moving from high-level system context down to granular code implementation details.<\/figcaption><\/figure>\n

    2. Deconstructing the Internet Banking Architecture<\/h2>\n

    Looking at the diagram, we can divide the system into three distinct logical zones: the Customer Side (Client), the Server Side (Application Layer), and the Data Layer.<\/p>\n

    2.1 The Client Layer: Customer Access Points<\/h3>\n

    The diagram illustrates two primary ways a customer interacts with the bank. This demonstrates a Multi-Channel Strategy<\/strong>.<\/p>\n

      \n
    • Mobile App (Top Left):<\/strong>\n
        \n
      • Technology:<\/strong> Built using Xamarin<\/em>, a cross-platform framework.<\/li>\n
      • Function:<\/strong> It provides a “limited subset” of functionality, likely focusing on quick checks, transfers, or alerts rather than full account management.<\/li>\n
      • Deployment Node:<\/strong> Runs on the customer’s physical device (Apple iOS or Android).<\/li>\n
      • Connection:<\/strong> It communicates via API calls (JSON\/HTTPS)<\/strong> to the backend server.<\/li>\n<\/ul>\n<\/li>\n
      • Web Browser (Bottom Left):<\/strong>\n
          \n
        • Technology:<\/strong> A Single-Page Application (SPA)<\/em> built with JavaScript and Angular<\/em>.<\/li>\n
        • Function:<\/strong> Provides the full suite of internet banking functionality.<\/li>\n
        • Deployment Node:<\/strong> Runs on the customer’s computer (Windows or macOS) via browsers like Chrome or Firefox.<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n

          2.2 The Server Layer: The Application Backend<\/h3>\n

          The central part of the diagram represents the “Big Bank plc” data center. Here, we see a separation of concerns between handling API traffic and serving web content.<\/p>\n

            \n
          • API Application (Top Center):<\/strong>\n
              \n
            • Role:<\/strong> This is the backend engine for the Mobile App. It handles the logic for transactions and data retrieval.<\/li>\n
            • Technology:<\/strong> Built with Java and Spring MVC<\/em>.<\/li>\n
            • Runtime:<\/strong> Deployed on Apache Tomcat 8.x<\/em>, a standard Java servlet container.<\/li>\n
            • Communication:<\/strong> It reads from and writes to the primary database using JDBC<\/strong> (Java Database Connectivity).<\/li>\n<\/ul>\n<\/li>\n
            • Web Application (Bottom Center):<\/strong>\n
                \n
              • Role:<\/strong> This server acts as a web server. It serves the static content (HTML\/CSS) and delivers the JavaScript bundle for the Single-Page Application (Angular) to the browser.<\/li>\n
              • Technology:<\/strong> Also built with Java and Spring MVC<\/em>.<\/li>\n
              • Runtime:<\/strong> Deployed on Apache Tomcat 8.x<\/em>.<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n

                2.3 The Data Layer: Persistence and Reliability<\/h3>\n

                On the far right, we see the database infrastructure. This highlights a critical requirement for banking systems: High Availability<\/strong> and Disaster Recovery<\/strong>.<\/p>\n

                  \n
                • Oracle – Primary (top right):<\/strong>\n
                    \n
                  • Role:<\/strong> The active database holding the “source of truth.” It stores user registration, hashed credentials, and access logs.<\/li>\n
                  • Deployment:<\/strong> Running on Oracle 12c<\/em> on an Ubuntu 16.04 LTS<\/em> server.<\/li>\n<\/ul>\n<\/li>\n
                  • Oracle – Secondary (bottom right):<\/strong>\n
                      \n
                    • Role:<\/strong> This is a replica of the primary database.<\/li>\n
                    • Replication:<\/strong> The diagram shows a dashed line indicating data is “Replicated to” this secondary node. If the primary server fails, the system can failover to this secondary database to ensure the bank remains online.<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n
                      \n \"Flowchart
                      Primary-secondary database replication workflow ensuring zero data loss and seamless failover for enterprise banking systems.<\/figcaption><\/figure>\n

                      3. Key Architectural Patterns Identified<\/h2>\n

                      By analyzing the connections and components, we can identify several standard architectural patterns used in modern enterprise software:<\/p>\n

                      3.1 Separation of Concerns (Microservices-lite)<\/h3>\n

                      The diagram shows two distinct application servers: one dedicated to the API (backend logic) and one dedicated to the Web Application (frontend serving). This separation allows the API to scale independently of the web interface.<\/p>\n

                      3.2 Database Replication<\/h3>\n

                      The existence of a Primary and Secondary Oracle database connected by a replication link is a classic pattern for ensuring data integrity and uptime. This is non-negotiable for financial institutions.<\/p>\n

                      3.3 RESTful API Design<\/h3>\n

                      The connections labeled “Makes API calls to [JSON \/ HTTPS]” indicate a RESTful architecture. The mobile app and the web app communicate with the backend over standard web protocols, making the system platform-agnostic.<\/p>\n

                      4. The Technology Stack Revealed<\/h2>\n

                      For developers and architects, this diagram is a treasure trove of information regarding the specific technologies chosen for this project. The stack includes:<\/p>\n

                        \n
                      • Mobile:<\/strong> Xamarin (C# based, likely).<\/li>\n
                      • Web Frontend:<\/strong> Angular (JavaScript\/TypeScript).<\/li>\n
                      • Backend Framework:<\/strong> Spring MVC (Java).<\/li>\n
                      • Application Server:<\/strong> Apache Tomcat 8.x.<\/li>\n
                      • Database:<\/strong> Oracle Database 12c.<\/li>\n
                      • OS:<\/strong> Ubuntu 16.04 LTS (Server side), iOS\/Android\/Windows (Client side).<\/li>\n<\/ul>\n
                        \n \"Comprehensive
                        End-to-end technology stack integration map highlighting cross-platform frontends, Java backend services, and robust data persistence layers.<\/figcaption><\/figure>\n

                        Conclusion<\/h2>\n

                        This C4 Deployment Diagram effectively communicates the complexity of the Internet Banking System without getting bogged down in code-level details. It clearly maps out the journey of a user request\u2014from the Mobile App on an iOS device, through the API Application on a Linux server, and finally into the Oracle Database. For anyone learning system architecture, this diagram serves as a perfect example of how to model hardware, software, and their interactions.<\/p>\n","protected":false},"excerpt":{"rendered":"

                        Master C4 Deployment Diagrams to visualize runtime environments, hardware, and software components in complex systems like Internet Banking platforms.<\/p>\n","protected":false},"author":1,"featured_media":8102,"template":"","meta":{"_yoast_wpseo_title":"Mastering System Architecture: A Step-by-Step Guide to C4 Deployment Diagrams","_yoast_wpseo_metadesc":"Master C4 Deployment Diagrams to visualize runtime environments, hardware, and software components in complex systems like Internet Banking platforms.","inline_featured_image":false,"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"source_url":"https:\/\/online.visual-paradigm.com\/diagrams\/templates\/c4-model\/","source_h1_title":"C4 Model Templates","fifu_image_url":"","fifu_image_alt":"","_fifu_image_alt":"","fifu_alt":"","_fifu_alt":"","fifu_image_title":"","_fifu_image_title":"","fifu_input_alt":"","vp_image_hash":"c6e583c448fe8684eb54b9f734dedae9850c40da2e04c65277606a71b7837795"},"asset-category":[17],"class_list":["post-8101","gallery","type-gallery","status-publish","has-post-thumbnail","hentry","asset-category-c4"],"source_url":"https:\/\/online.visual-paradigm.com\/diagrams\/templates\/c4-model\/","source_h1_title":"C4 Model Templates","fifu_image_url":"","fifu_image_alt":"","vp_image_hash":"c6e583c448fe8684eb54b9f734dedae9850c40da2e04c65277606a71b7837795","yoast_head":"\nMastering System Architecture: A Step-by-Step Guide to C4 Deployment Diagrams<\/title>\n<meta name=\"description\" content=\"Master C4 Deployment Diagrams to visualize runtime environments, hardware, and software components in complex systems like Internet Banking platforms.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.learn-vp.com\/fr\/gallery\/mastering-system-architecture-a-step-by-step-guide-to-c4-deployment-diagrams\/\" \/>\n<meta property=\"og:locale\" content=\"fr_FR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Mastering System Architecture: A Step-by-Step Guide to C4 Deployment Diagrams\" \/>\n<meta property=\"og:description\" content=\"Master C4 Deployment Diagrams to visualize runtime environments, hardware, and software components in complex systems like Internet Banking platforms.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.learn-vp.com\/fr\/gallery\/mastering-system-architecture-a-step-by-step-guide-to-c4-deployment-diagrams\/\" \/>\n<meta property=\"og:site_name\" content=\"Learn VP\" \/>\n<meta property=\"article:modified_time\" content=\"2026-10-09T04:21:52+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/online.visual-paradigm.com\/repository\/images\/d05814ec-ea32-4f01-a160-b07805252807\/c4-model-design\/c4-model-deployment-diagram-for-internet-banking-system.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1024\" \/>\n\t<meta property=\"og:image:height\" content=\"1024\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Dur\u00e9e de lecture estim\u00e9e\" \/>\n\t<meta name=\"twitter:data1\" content=\"4 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.learn-vp.com\\\/fr\\\/gallery\\\/mastering-system-architecture-a-step-by-step-guide-to-c4-deployment-diagrams\\\/\",\"url\":\"https:\\\/\\\/www.learn-vp.com\\\/fr\\\/gallery\\\/mastering-system-architecture-a-step-by-step-guide-to-c4-deployment-diagrams\\\/\",\"name\":\"Mastering System Architecture: A Step-by-Step Guide to C4 Deployment Diagrams\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.learn-vp.com\\\/fr\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.learn-vp.com\\\/fr\\\/gallery\\\/mastering-system-architecture-a-step-by-step-guide-to-c4-deployment-diagrams\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.learn-vp.com\\\/fr\\\/gallery\\\/mastering-system-architecture-a-step-by-step-guide-to-c4-deployment-diagrams\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/online.visual-paradigm.com\\\/repository\\\/images\\\/d05814ec-ea32-4f01-a160-b07805252807\\\/c4-model-design\\\/c4-model-deployment-diagram-for-internet-banking-system.png\",\"datePublished\":\"2026-08-21T05:29:28+00:00\",\"dateModified\":\"2026-10-09T04:21:52+00:00\",\"description\":\"Master C4 Deployment Diagrams to visualize runtime environments, hardware, and software components in complex systems like Internet Banking platforms.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.learn-vp.com\\\/fr\\\/gallery\\\/mastering-system-architecture-a-step-by-step-guide-to-c4-deployment-diagrams\\\/#breadcrumb\"},\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.learn-vp.com\\\/fr\\\/gallery\\\/mastering-system-architecture-a-step-by-step-guide-to-c4-deployment-diagrams\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\\\/\\\/www.learn-vp.com\\\/fr\\\/gallery\\\/mastering-system-architecture-a-step-by-step-guide-to-c4-deployment-diagrams\\\/#primaryimage\",\"url\":\"https:\\\/\\\/online.visual-paradigm.com\\\/repository\\\/images\\\/d05814ec-ea32-4f01-a160-b07805252807\\\/c4-model-design\\\/c4-model-deployment-diagram-for-internet-banking-system.png\",\"contentUrl\":\"https:\\\/\\\/online.visual-paradigm.com\\\/repository\\\/images\\\/d05814ec-ea32-4f01-a160-b07805252807\\\/c4-model-design\\\/c4-model-deployment-diagram-for-internet-banking-system.png\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.learn-vp.com\\\/fr\\\/gallery\\\/mastering-system-architecture-a-step-by-step-guide-to-c4-deployment-diagrams\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.learn-vp.com\\\/fr\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Mastering System Architecture: A Step-by-Step Guide to C4 Deployment Diagrams\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.learn-vp.com\\\/fr\\\/#website\",\"url\":\"https:\\\/\\\/www.learn-vp.com\\\/fr\\\/\",\"name\":\"Learn VP\",\"description\":\"Learn VP\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.learn-vp.com\\\/fr\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.learn-vp.com\\\/fr\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"fr-FR\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.learn-vp.com\\\/fr\\\/#organization\",\"name\":\"Learn VP\",\"url\":\"https:\\\/\\\/www.learn-vp.com\\\/fr\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\\\/\\\/www.learn-vp.com\\\/fr\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/www.learn-vp.com\\\/fr\\\/wp-content\\\/uploads\\\/sites\\\/6\\\/2026\\\/08\\\/cropped-Gemini_Generated_Image_n6bgztn6bgztn6bg-clean-e1787131920742.png\",\"contentUrl\":\"https:\\\/\\\/www.learn-vp.com\\\/fr\\\/wp-content\\\/uploads\\\/sites\\\/6\\\/2026\\\/08\\\/cropped-Gemini_Generated_Image_n6bgztn6bgztn6bg-clean-e1787131920742.png\",\"width\":463,\"height\":404,\"caption\":\"Learn VP\"},\"image\":{\"@id\":\"https:\\\/\\\/www.learn-vp.com\\\/fr\\\/#\\\/schema\\\/logo\\\/image\\\/\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Mastering System Architecture: A Step-by-Step Guide to C4 Deployment Diagrams","description":"Master C4 Deployment Diagrams to visualize runtime environments, hardware, and software components in complex systems like Internet Banking platforms.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.learn-vp.com\/fr\/gallery\/mastering-system-architecture-a-step-by-step-guide-to-c4-deployment-diagrams\/","og_locale":"fr_FR","og_type":"article","og_title":"Mastering System Architecture: A Step-by-Step Guide to C4 Deployment Diagrams","og_description":"Master C4 Deployment Diagrams to visualize runtime environments, hardware, and software components in complex systems like Internet Banking platforms.","og_url":"https:\/\/www.learn-vp.com\/fr\/gallery\/mastering-system-architecture-a-step-by-step-guide-to-c4-deployment-diagrams\/","og_site_name":"Learn VP","article_modified_time":"2026-10-09T04:21:52+00:00","og_image":[{"url":"https:\/\/online.visual-paradigm.com\/repository\/images\/d05814ec-ea32-4f01-a160-b07805252807\/c4-model-design\/c4-model-deployment-diagram-for-internet-banking-system.png","width":1024,"height":1024,"type":"image\/jpeg"}],"twitter_card":"summary_large_image","twitter_misc":{"Dur\u00e9e de lecture estim\u00e9e":"4 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.learn-vp.com\/fr\/gallery\/mastering-system-architecture-a-step-by-step-guide-to-c4-deployment-diagrams\/","url":"https:\/\/www.learn-vp.com\/fr\/gallery\/mastering-system-architecture-a-step-by-step-guide-to-c4-deployment-diagrams\/","name":"Mastering System Architecture: A Step-by-Step Guide to C4 Deployment Diagrams","isPartOf":{"@id":"https:\/\/www.learn-vp.com\/fr\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.learn-vp.com\/fr\/gallery\/mastering-system-architecture-a-step-by-step-guide-to-c4-deployment-diagrams\/#primaryimage"},"image":{"@id":"https:\/\/www.learn-vp.com\/fr\/gallery\/mastering-system-architecture-a-step-by-step-guide-to-c4-deployment-diagrams\/#primaryimage"},"thumbnailUrl":"https:\/\/online.visual-paradigm.com\/repository\/images\/d05814ec-ea32-4f01-a160-b07805252807\/c4-model-design\/c4-model-deployment-diagram-for-internet-banking-system.png","datePublished":"2026-08-21T05:29:28+00:00","dateModified":"2026-10-09T04:21:52+00:00","description":"Master C4 Deployment Diagrams to visualize runtime environments, hardware, and software components in complex systems like Internet Banking platforms.","breadcrumb":{"@id":"https:\/\/www.learn-vp.com\/fr\/gallery\/mastering-system-architecture-a-step-by-step-guide-to-c4-deployment-diagrams\/#breadcrumb"},"inLanguage":"fr-FR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.learn-vp.com\/fr\/gallery\/mastering-system-architecture-a-step-by-step-guide-to-c4-deployment-diagrams\/"]}]},{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/www.learn-vp.com\/fr\/gallery\/mastering-system-architecture-a-step-by-step-guide-to-c4-deployment-diagrams\/#primaryimage","url":"https:\/\/online.visual-paradigm.com\/repository\/images\/d05814ec-ea32-4f01-a160-b07805252807\/c4-model-design\/c4-model-deployment-diagram-for-internet-banking-system.png","contentUrl":"https:\/\/online.visual-paradigm.com\/repository\/images\/d05814ec-ea32-4f01-a160-b07805252807\/c4-model-design\/c4-model-deployment-diagram-for-internet-banking-system.png"},{"@type":"BreadcrumbList","@id":"https:\/\/www.learn-vp.com\/fr\/gallery\/mastering-system-architecture-a-step-by-step-guide-to-c4-deployment-diagrams\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.learn-vp.com\/fr\/"},{"@type":"ListItem","position":2,"name":"Mastering System Architecture: A Step-by-Step Guide to C4 Deployment Diagrams"}]},{"@type":"WebSite","@id":"https:\/\/www.learn-vp.com\/fr\/#website","url":"https:\/\/www.learn-vp.com\/fr\/","name":"Learn VP","description":"Learn VP","publisher":{"@id":"https:\/\/www.learn-vp.com\/fr\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.learn-vp.com\/fr\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"fr-FR"},{"@type":"Organization","@id":"https:\/\/www.learn-vp.com\/fr\/#organization","name":"Learn VP","url":"https:\/\/www.learn-vp.com\/fr\/","logo":{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/www.learn-vp.com\/fr\/#\/schema\/logo\/image\/","url":"https:\/\/www.learn-vp.com\/fr\/wp-content\/uploads\/sites\/6\/2026\/08\/cropped-Gemini_Generated_Image_n6bgztn6bgztn6bg-clean-e1787131920742.png","contentUrl":"https:\/\/www.learn-vp.com\/fr\/wp-content\/uploads\/sites\/6\/2026\/08\/cropped-Gemini_Generated_Image_n6bgztn6bgztn6bg-clean-e1787131920742.png","width":463,"height":404,"caption":"Learn VP"},"image":{"@id":"https:\/\/www.learn-vp.com\/fr\/#\/schema\/logo\/image\/"}}]}},"_links":{"self":[{"href":"https:\/\/www.learn-vp.com\/fr\/wp-json\/wp\/v2\/gallery\/8101","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.learn-vp.com\/fr\/wp-json\/wp\/v2\/gallery"}],"about":[{"href":"https:\/\/www.learn-vp.com\/fr\/wp-json\/wp\/v2\/types\/gallery"}],"author":[{"embeddable":true,"href":"https:\/\/www.learn-vp.com\/fr\/wp-json\/wp\/v2\/users\/1"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.learn-vp.com\/fr\/wp-json\/wp\/v2\/media\/8102"}],"wp:attachment":[{"href":"https:\/\/www.learn-vp.com\/fr\/wp-json\/wp\/v2\/media?parent=8101"}],"wp:term":[{"taxonomy":"asset-category","embeddable":true,"href":"https:\/\/www.learn-vp.com\/fr\/wp-json\/wp\/v2\/asset-category?post=8101"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}