Alawn/C4-PlantUML
1
0
Fork 0
mirror of https://github.com/plantuml-stdlib/C4-PlantUML.git synced 2022-10-18 01:14:54 +00:00
Code Issues Projects Releases Wiki Activity

external person, system boundary, container boundary, updated samples from c4model.com

Browse Source
This commit is contained in:
Victor Lupu
2018-09-26 00:12:41 +03:00
parent 61ed9d0c1d
commit ce478229f9
7 changed files with 88 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files
C4.puml
+20 -4
View File
@@ -2,9 +2,10 @@
' ##################################
!define PERSON_BG_COLOR #08427B
!define CONTAINER_BG_COLOR #438DD5
!define EXTERNAL_SYSTEM_BG_COLOR #999999
!define EXTERNAL_PERSON_BG_COLOR #686868
!define SYSTEM_BG_COLOR #1168BD
!define EXTERNAL_SYSTEM_BG_COLOR #999999
!define CONTAINER_BG_COLOR #438DD5
!define COMPONENT_BG_COLOR #85BBF0
!define ELEMENT_FONT_COLOR #FFFFFF
@@ -35,6 +36,13 @@ skinparam rectangle<<person>> {
BorderColor #073B6F
}
skinparam rectangle<<external_person>> {
StereotypeFontColor ELEMENT_FONT_COLOR
FontColor ELEMENT_FONT_COLOR
BackgroundColor EXTERNAL_PERSON_BG_COLOR
BorderColor #8A8A8A
}
skinparam rectangle<<container>> {
StereotypeFontColor ELEMENT_FONT_COLOR
FontColor ELEMENT_FONT_COLOR
@@ -85,6 +93,7 @@ skinparam package<<boundary>> {
legend right
|= |= Type |
|<PERSON_BG_COLOR> | person |
|<EXTERNAL_PERSON_BG_COLOR> | external person |
|<SYSTEM_BG_COLOR> | system |
|<EXTERNAL_SYSTEM_BG_COLOR> | external system |
|<CONTAINER_BG_COLOR> | container |
@@ -100,6 +109,8 @@ skinparam package<<boundary>> {
!define Person(e_alias, e_label) rectangle "==e_label" <<person>> as e_alias
!define Person(e_alias, e_label, e_descr) rectangle "==e_label\n\n e_descr" <<person>> as e_alias
!define Person_Ext(e_alias, e_label) rectangle "==e_label" <<external_person>> as e_alias
!define Person_Ext(e_alias, e_label, e_descr) rectangle "==e_label\n\n e_descr" <<external_person>> as e_alias
!define Container(e_alias, e_label, e_techn) rectangle "==e_label\n//<size:TECHN_FONT_SIZE>[e_techn]</size>//" <<container>> as e_alias
!define Container(e_alias, e_label, e_techn, e_descr) rectangle "==e_label\n//<size:TECHN_FONT_SIZE>[e_techn]</size>//\n\n e_descr" <<container>> as e_alias
@@ -110,8 +121,13 @@ skinparam package<<boundary>> {
!define System(e_alias, e_label) rectangle "==e_label" <<system>> as e_alias
!define System(e_alias, e_label, e_descr) rectangle "==e_label\n\n e_descr" <<system>> as e_alias
!define ExtSystem(e_alias, e_label) rectangle "==e_label" <<external_system>> as e_alias
!define ExtSystem(e_alias, e_label, e_descr) rectangle "==e_label\n\n e_descr" <<external_system>> as e_alias
!define System_Ext(e_alias, e_label) rectangle "==e_label" <<external_system>> as e_alias
!define System_Ext(e_alias, e_label, e_descr) rectangle "==e_label\n\n e_descr" <<external_system>> as e_alias
' Boundaries
' ##################################
!define System_Boundary(e_alias, e_label) package "==e_label [System]" <<boundary>> as e_alias
!define Container_Boundary(e_alias, e_label) package "==e_label [Container]" <<boundary>> as e_alias
' Relationship
' ##################################
samples/C4_Component Diagram Sample.puml
+22 -15
View File
@@ -1,24 +1,31 @@
@startuml
!include ../C4.puml
' !includeurl https://raw.githubusercontent.com/RicardoNiepel/C4-PlantUML/master/C4.puml
LAYOUT_WITH_LEGEND
title Component Diagram
title Component diagram for Internet Banking System - API Application
Person(client, "Client", "A user of a system")
package "Platform:system" <<boundary>> as platform {
Container(api_app, "Mobile App", "Android / IOS", "Uses SDK for direct calls")
package "Web App:container" <<boundary>> as api_dash {
Component(c1, "User Controller", "MVC REST Controller", "Lorem ipsum")
Component(c2, "Product Controller", "MVC REST Controller", "Lorem ipsum")
}
Container(spa, "Single Page Application", "javascript and angular", "Provides all the internet banking functionality to customers via their web browser.")
Container(ma, "Mobile App", "Xamarin", "Provides a limited subset ot the internet banking functionality to customers via their mobile mobile device.")
Container(db, "Database", "Relational Database Schema", "Stores user registration information, hashed authentication credentials, access logs, etc.")
System_Ext(mbs, "Mainframe Banking System", "Stores all of the core banking information about customers, accounts, transactions, etc.")
Container_Boundary(api, "API Application") {
Component(sign, "Sign In Controller", "MVC Rest Controlle", "Allows users to sign in to the internet banking system")
Component(accounts, "Accounts Summary Controller", "MVC Rest Controlle", "Provides customers with a summory of their bank accounts")
Component(security, "Security Component", "Spring Bean", "Provides functionality related to singing in, changing passwords, etc.")
Component(mbsfacade, "Mainframe Banking System Facade", "Spring Bean", "A facade onto the mainframe banking system.")
Rel(sign, security, "Uses")
Rel(accounts, mbsfacade, "Uses")
Rel(security, db, "Read & write to", "JDBC")
Rel(mbsfacade, mbs, "Uses", "XML/HTTPS")
}
ExtSystem(3rdparty, "3rd Party Platform", "Implements actual business logic")
Rel(client, platform, "Uses")
Rel(client, 3rdparty, "Uses")
Rel(api_dash, 3rdparty, "Uses", "REST API")
Rel(api_app, 3rdparty, "Uses", "SDK")
Rel(api_app, c2, "Query", "SDK")
Rel(api_app, c1, "Query", "SDK")
Rel(spa, sign, "Uses", "JSON/HTTPS")
Rel(spa, accounts, "Uses", "JSON/HTTPS")
Rel(ma, sign, "Uses", "JSON/HTTPS")
Rel(ma, accounts, "Uses", "JSON/HTTPS")
@enduml
samples/C4_Container Diagram Sample - bigbankplc.puml
+5 -4
View File
@@ -1,5 +1,6 @@
@startuml "bigbankplc"
!includeurl https://raw.githubusercontent.com/RicardoNiepel/C4-PlantUML/master/C4_Container.puml
!include ../C4.puml
' !includeurl https://raw.githubusercontent.com/RicardoNiepel/C4-PlantUML/master/C4.puml
LAYOUT_TOP_DOWN
'LAYOUT_AS_SKETCH
@@ -8,7 +9,7 @@ LAYOUT_WITH_LEGEND
Person(customer, Customer, "A customer of the bank, with personal bank accounts")
package "Internet Banking System" <<boundary>> as c1 {
System_Boundary(c1, "Internet Banking") {
Container(web_app, "Web Application", "Java, Spring MVC", "Delivers the static content and the Internet banking SPA")
@@ -21,8 +22,8 @@ package "Internet Banking System" <<boundary>> as c1 {
Container(database, "Database", "SQL Database", "Stores user registraion information, hased auth credentials, access logs, etc.")
}
System(email_system, "E-Mail System", "The internal Microsoft Exchange system")
System(banking_system, "Mainframe Banking System", "Stores all of the core banking information about customers, accounts, transactions, etc.")
System_Ext(email_system, "E-Mail System", "The internal Microsoft Exchange system")
System_Ext(banking_system, "Mainframe Banking System", "Stores all of the core banking information about customers, accounts, transactions, etc.")
Rel(customer, web_app, "Uses", "HTTPS")
Rel(customer, spa, "Uses", "HTTPS")
samples/C4_Container Diagram Sample - message bus.puml
+3 -2
View File
@@ -1,5 +1,6 @@
@startuml "bigbankplc"
!includeurl https://raw.githubusercontent.com/RicardoNiepel/C4-PlantUML/master/C4_Container.puml
!include ../C4.puml
' !includeurl https://raw.githubusercontent.com/RicardoNiepel/C4-PlantUML/master/C4.puml
skinparam wrapWidth 200
skinparam maxMessageSize 200
@@ -11,7 +12,7 @@ LAYOUT_WITH_LEGEND
Person(customer, Customer, "A customer")
package "Customer Information System" <<boundary>> as c1 {
System_Boundary(c1, "Customer Information") {
Container(app, "Customer Application", "Javascript, Angular", "Allows customers to manage their profile")
samples/C4_Container Diagram Sample - techtribesjs.puml
+6 -5
View File
@@ -1,12 +1,13 @@
@startuml "techtribesjs"
!includeurl https://raw.githubusercontent.com/RicardoNiepel/C4-PlantUML/master/C4_Container.puml
!include ../C4.puml
' !includeurl https://raw.githubusercontent.com/RicardoNiepel/C4-PlantUML/master/C4.puml
LAYOUT_TOP_DOWN
'LAYOUT_AS_SKETCH
LAYOUT_WITH_LEGEND
Person(anonymous_user, "Anonymous User")
Person_Ext(anonymous_user, "Anonymous User")
Person(aggregated_user, "Aggregated User")
Person(administration_user, "Administration User")
@@ -23,9 +24,9 @@ package "techtribes.js" <<boundary>> as c1 {
Container(updater, "Updater", "Java 7 Console App", "Updates profiles, tweets, GitHub repos and content on a scheduled basis")
}
System(twitter, "Twitter")
System(github, "GitHub")
System(blogs, "Blogs")
System_Ext(twitter, "Twitter")
System_Ext(github, "GitHub")
System_Ext(blogs, "Blogs")
Rel(anonymous_user, web_app, "Uses", "HTTPS")
samples/C4_Container Diagram Sample.puml
+22 -10
View File
@@ -1,19 +1,31 @@
@startuml
!include ../C4.puml
' !includeurl https://raw.githubusercontent.com/RicardoNiepel/C4-PlantUML/master/C4.puml
LAYOUT_WITH_LEGEND
title Container Diagram
title Container diagram for Internet Banking System
Person(client, "Client", "A user of a system")
package "Platform" <<boundary>> as platform {
Container(api_app, "Mobile App", "Android / IOS", "Uses SDK for direct calls")
Container(api_dash, "Web App", "asp.net", "Covers one or more business needs")
Person(pbc, "Personal Banking Customer", "A customer of the bank, with personal bank accounts.")
System_Ext(es, "E-mail system", "The internal Microsoft Exchange e-mail system.")
System_Ext(mbs, "Mainframe Banking System", "Stores all of the core banking information about customers, accounts, transactions, etc.")
System_Boundary(ibs, "Internet Banking") {
Container(wa, "Web Application", "java and Spring MVC", "Delivers the static content and the internet banking single page application.")
Container(spa, "Single Page Application", "javascript and angular", "Provides all the internet banking functionality to customers via their web browser.")
Container(ma, "Mobile App", "Xamarin", "Provides a limited subset ot the internet banking functionality to customers via their mobile mobile device.")
Container(db, "Database", "Relational Database Schema", "Stores user registration information, hashed authentication credentials, access logs, etc.")
Container(api, "API Application", "java and String MVC", "Provides internet banking functionality via a JSON/HTTP API.")
Rel(api, es, "Sends e-mails", "SMTP")
Rel(api, mbs, "Uses", "XML/HTTPS")
Rel(api, db, "Reads & writes to", "JDBC")
Rel(wa, spa, "Delivers")
Rel(spa, api, "Uses", "JSON/HTTPS")
Rel(ma, api, "Uses", "JSON/HTTPS")
}
ExtSystem(3rdparty, "3rd Party Platform", "Implements actual business logic")
Rel(client, platform, "Uses")
Rel(client, 3rdparty, "Uses")
Rel(api_dash, 3rdparty, "Uses", "REST API")
Rel(api_app, 3rdparty, "Uses", "SDK")
Rel(pbc, wa, "Uses", "HTTPS")
Rel(pbc, spa, "Uses")
Rel(pbc, ma, "Uses")
Rel(es, pbc, "Sends e-mails to")
@enduml
samples/C4_Context Diagram Sample.puml
+10 -7
View File
@@ -1,15 +1,18 @@
@startuml
!include ../C4.puml
' !includeurl https://raw.githubusercontent.com/RicardoNiepel/C4-PlantUML/master/C4.puml
LAYOUT_WITH_LEGEND
title System Context Diagram
title System Context diagram for Internet Banking System
Person(client, "Client", "A user of a system")
System(platform, "Platform", "Distributed system of independent Machines")
ExtSystem(3rdparty, "3rd Party Platform", "Implements actual business logic")
Person(pbc, "Personal Banking Customer", "A customer of the bank, with personal bank accounts.")
System(ibs, "Internet Banking System", "Allows customers to view information about their bank accounts, and make payments.")
System_Ext(es, "E-mail system", "The internal Microsoft Exchange e-mail system.")
System_Ext(mbs, "Mainframe Banking System", "Stores all of the core banking information about customers, accounts, transactions, etc.")
Rel(client, platform, "Uses")
Rel(client, 3rdparty, "Uses")
Rel(3rdparty, platform, "Depends on", "SDK, REST API")
Rel(pbc, ibs, "Uses")
Rel(es, pbc, "Sends e-mails to")
Rel(ibs, es, "Sends e-mails", "SMTP")
Rel(ibs, mbs, "Uses")
@enduml