DEV Community

Volodymyr Pavlyshyn
Volodymyr Pavlyshyn

Posted on

Developers experience. Architecture Diagrams for mortals. C4 & C5 diagrams as code


So for me, Developer eXperience — is not about DevOps or pipelines. It is crucial, but the cognitive load of understanding systems is the most critical for me. The cognitive load that developers have while interacting with a system.

The most significant impedance of all modern systems — is the gap between solution architecture and code. Even architects must use the elevator

to meet the solution-application gap, we are still hoping for 5th-generation languages, but to survive with the instruments that we currently have, we use models. All models are wrong, but some of them are useful.

So C4 diagrams https://c4model.com/ and C5 (C4+ connection diagrams) give us a drill-down view from systems and users to components and classes and lower cognitive load and represent a system in a digestible human-friendly way

We use a C4 plantUML

https://github.com/plantuml-stdlib/C4-PlantUML

Quick sample

@startuml  
title Salary Statistic

!include https://raw.githubusercontent.com/plantuml-stdlib/C4-PlantUML/master/C4\_Container.puml

Person(consumer, "Consumer")  
System\_Boundary(SalaryStatisticBoundary, "Salary statistic  Backend") {  
    Container(SalaryStatisticService, "Statistic Service", "")  
    ContainerDb(userDB, "User storage", "file storage")  
    ContainerDb(salaryDB, , "salary storage", "SqlLite")  
}

Rel(consumer, SalaryStatisticService, "get data")  
Rel(consumer, SalaryStatisticService, "login")  
Rel(SalaryStatisticService, userDB, "user data and scopes")  
Rel(SalaryStatisticService, salaryDB, "salary data")

@enduml
Enter fullscreen mode Exit fullscreen mode

So all our diagrams are versioned code, and if you are a lucky user of GitLab, all your diagrams could be embedded and rendered out of the box from MD files. One suggestion is to focus not on real infrastructure connections but on logical relations and put all plumbing into a connection diagram. More you could find in my video For fans of books

Top comments (1)

Collapse
 
der_gopher profile image
Alex Pliutau

Great write-up, we also published an article on C4 recently - packagemain.tech/p/software-archit...