Show HN: Infragram – C4 style interactive architecture diagrams for Terraform(marketplace.visualstudio.com) If you're not familiar with C4 model (https://c4model.com), the idea is to visualize your system at different "zoom levels" to see the abstraction you are interested in. When it comes to infrastructure, looking at how different cloud services connect together might give us an overview of the high level architecture of the system. We can zoom in and look at domain specific units of infrastructure and how they interact to get a deeper understanding of what the system is doing. Finally we might want to look at the resource view to see individual resources and how they are configured. Each view gives a different perspective and allows us to tell different stories about our system depending on the audience. Having to document and maintain such diagrams for a constantly changing system can be quite tedious. So I'm building a tool to generate such diagrams directly in your IDE (actually just vscode). Running in the IDE integrates it seamlessly into the dev workflow. We can do nifty things like mapping the diagram to source code so you can navigate between elements of the diagram and source as you work through the code. Once we have a diagram, we can overlay additional information to bring information into context, like visualizing a change plan over the diagram, or perhaps health metrics of a live system or cost estimates. I made a quick video to give you a demo of what it looks like. You can also see some samples of generated diagrams below. And checkout the extension page on the marketplace for more information. I'd love to hear your thoughts and any feedback you have! Btw, the extension runs entirely client side with no remote server integration, so your code never leaves your machine. Video demo (2 min) Extension link https://marketplace.visualstudio.com/items?itemName=infragra... Example diagrams: [1] https://raw.githubusercontent.com/akulapid/infragram-root/re... [2] https://raw.githubusercontent.com/akulapid/infragram-root/re... [3] https://raw.githubusercontent.com/akulapid/infragram-root/re... [4] https://raw.githubusercontent.com/akulapid/infragram-root/re... [5] https://raw.githubusercontent.com/akulapid/infragram-root/re... |
