Diagram as code
10 Mar'24
How many of us are awed by the software architecture diagrams displayed in technology websites? I, for one, sure do. My knowledge of creating diagrams is limited to tools in Microsoft Office like PowerPoint and Word. The beautiful cloud architecture diagrams available on Amazon websites and the occasional systems architecture diagrams by ByteByteGo piqued my interest in how these diagrams are created. I googled on the topic and was brought to a ByteByteGo blog article titled Diagram as Code.
Diagram as Code is a paradigm to drawing diagrams, in particular software architecture diagrams, using codes. One of the more established diagram as code tool is Diagrams, which allows users to create system architecture diagrams with Python code. Here are some of the examples provided by the Diagrams official page.
These two diagrams are created by me. The left image shows a client-server architecture while the right image shows an AWS global infrastructure (Diagrams might not be fully accurate in its implementations). There are some techniques in creating these diagrams which I have not fully grasps yet. So, these will be KIV'ed until a more suitable time.
Here are a couple of online resources if you are interested to find out more about Diagram as Code:
7 diagrams as code tools for software architecture (Medium article)