8 ms·
Diagram as Code
- subhobroto 6y agoIt seems to be hyperfocused on system architecture diagrams. There are some other kinds of diagrams would we like to draw that’s not system architecture diagrams, eg: - algorithms - decision trees - UML/ER Diagrams Mermaid (JS) helps draw quality diagrams quickly - more than system architecture diagrams. It would have been perfect if the development cycles that went here was used to create Mermaid templates instead. Unless this also lets us draw more than just system architecture diagrams.
- cs02rm0 6y agoThe focus would make sense to me if, say, it exported to initial terraform templates or something like that.
- jekriro7 6y agoI’d prefer to avoid text blob artifacts if this was being used at work with plenty of text blobs to babysit already IMO the end days for TF and YAML engineering are close, at least for new work It’s all HTTP APIs. Build a web UX and store the state in a DB. SRE/ops people ...at work just use the methods everyone else does Unless the company still has hardware, cloud ops/SRE is just making their lives harder to be different
- mugsie 6y ago> It’s all HTTP APIs. Build a web UX and store the state in a DB. Please no. Don't make running a stateful service a requirement for tooling people need to use when the world is on fire. Or needs to load 40Mb of JS to rebuild a deployment, and works only on Chrome 46.012.2039465. Ops/SRE/DevOps/SysAdmin/SysOps/etc are different, and have optimised things to reduce the amount of dependancies.
- snejj5 6y agoWhat's the alternative you'd recommend?
- mugsie 6y agoThe explicit, declarative model, using tools that don't need a ton of other things deployed. Ideally the same tool can be run locally and in CI (with the same invocation commands) so that an Op can run tests locally, and even see the potential diff, before putting it up for review. The advantage of this approach is you can see a diff, and use standard tooling like git / pr reviews to approve changes in day to day, and when the world is on fire, someone can break the glass and run it locally. Never underestimate the value of peer review on a change to the infra - there is a reason things like ITIL exist, and we should learn from them.
- subhobroto 6y ago> The advantage of this approach is you can see a diff, and use standard tooling like git / pr reviews to approve changes in day to day, and when the world is on fire, someone can break the glass and run it locally. sounds sweet. imagine applying gerrit to infra > there is a reason things like ITIL exist, and we should learn from them spot on. That said, I am unsure if most people here are ITIL aware/certified. TBH, the primary reason why I am familiar with ITIL is our clients from Accenture days requires certification to win contracts.
- mugsie 6y ago> sounds sweet. imagine applying gerrit to infra Yeah, it is cool - https://opendev.org/ https://opendev.org/ is done that way, as is some of the wikimedia labs infrastructure I am not certified either - I have just worked in places with ITIL inspired processes, but I can really see a way they can move forward with tools like terraform / pulumi / ansible and git
- kronin 6y agoThere is significant value in text blob workflows. Requiring the definition of everything that makes up your stack to be stored in a format that is not text adds complexity to the disaster recovery process, not to mention mutation, diffing, reviewing, approving, promoting, etc. For places where a single environment that is updated in place and requires little/no approval to do so, sure. Personally I really like textual definition of infrastructure and configuration, and disagree that it is end days for them.
- rbanffy 6y agoI'd love if it generated full terraform files with all the required information from the Python code, the rest from sane defaults. Would also be great to import things with generic names: from diagrams.aws.database import RDS as Database which you could replace at a later point with: from diagrams.gcp.database import SQL as Database And have a provider neutral description that could eventually be compiled into a provider-specific Terraform description just by changing the imports.
- subhobroto 6y agoUp-voted. That would really make sense and be extremely useful but I don't see anything related to that.
- josegonzalez 6y agoThis would have been perfect for you maybe. I find the Diagrams package to be just fine as it is. A tool or library doesn't have to support _every_ bit of functionality in order to be useful.
- techbio 6y agoNice suggestion. The headline appears misleading to me, I like what I see there, but it's really "Diagram as Config" not source code generally.
- subhobroto 6y ago> "Diagram as Config" not source code generally Yup! As "Diagram as Config" this tool is a great fit but not for "Diagram as Code". There are better alternatives out there.
- the_arun 6y agoThanks for sharing! This is really cool.
- samsquire 6y agoI've got a similar project which takes a diagram of your infrastructure, such as [1] and runs the diagram to build your devops infrastructure [2]. [1]: http://devops-pipeline.com/architecture.tb.png http://devops-pipeline.com/architecture.tb.png [2]: http://devops-pipeline.com/ http://devops-pipeline.com/
- kitd 6y agoInteresting. That was going to be my next question!
- nautilus12 6y agoWhen I first read this I thought this did the inverse of what it actually does. Let you interactively draw out diagrams then it would generate the boilerplate code to achieve that diagram.
- maitredusoi 6y agoI have the exact seem disappointment ;(. As we evolve towards a world were low code will become a part of everday tools, diagram generating code is to me a good answer, at least on a scaffolding level...
- hinkley 6y agoIf we had a decent diff tool for visual elements, then a whole lot of tools would be practical, including the one you suggest. Certainly a lot of the building blocks for such a system now exist.
- jameskraus 6y agoI was hoping this tool would support directionality/sequencing of nodes. A tool I've used in the past is SequenceDiagram.org for diagraming a sequence of service calls. While a bit old-school, it's good for its purpose. I've also used Whimsical[0] to model flows and graph-like relationships. It's got the added benefit of allowing multiple users to view and edit the same document. Whimsical is still my favorite tool right now due to flexibility, but it's a closed-source/paid product, so I'm open to alternatives. [0] https://whimsical.com/ https://whimsical.com/
- camillovisini 6y agoVisually Whimsical looks absolutely stunning... Wow
- dorian-graph 6y agoWhat about mermaid-js? Here's a sequence diagram example: https://mermaid-js.github.io/mermaid-live-editor/#/edit/eyJjb2RlIjoic2VxdWVuY2VEaWFncmFtXG5cdEFsaWNlLT4-K0pvaG46IEhlbGxvIEpvaG4sIGhvdyBhcmUgeW91P1xuXHRBbGljZS0-PitKb2huOiBKb2huLCBjYW4geW91IGhlYXIgbWU_XG5cdEpvaG4tLT4-LUFsaWNlOiBIaSBBbGljZSwgSSBjYW4gaGVhciB5b3UhXG5cdEpvaG4tLT4-LUFsaWNlOiBJIGZlZWwgZ3JlYXQhXG5cdFx0XHRcdFx0IiwibWVybWFpZCI6eyJ0aGVtZSI6ImRlZmF1bHQifSwidXBkYXRlRWRpdG9yIjp0cnVlfQ https://mermaid-js.github.io/mermaid-live-editor/#/edit/eyJj...
- subhobroto 6y agoExactly. PlantUML and Mermaid have really been very useful to me.
- eddiegroves 6y agoLooks visually pleasing, but I found their more complex diagrams harder to read compared with something more plain.
- theptip 6y agoFor quick sequence diagrams I really like https://swimlanes.io/ https://swimlanes.io/ It's text-based (build on Mermaid if I'm not mistaken) and really easy to work with for simple interactions. Also because it's purely text-based you can pass around the full context in the URL. This makes it a little awkward to collaborate vs. a true hosted solution, but it also lowers the barrier to entry significantly.
- mugsie 6y agoI like this a lot - trying to store diagrams that look good, without sticking a visio file into a git repo is something I keep an eye out for.
- hugozap 6y agoYou may also find value in diagram.codes (I'm the author) It's focused on non technical users so the syntax will always be very simple (at the cost of flexibility but that's on purpose).
- subhobroto 6y ago> diagram.codes looks fascinating. is this closed source? Can I run this over an API or a local container?
- polote 6y agoWhy do we need a tool to draw its architecture and we don't have a tool which auto discover the architecture and auto updates it and draw it form here ? That will shrink the gap between the current architecture and the current diagram that almost always exists
- rurounijones 6y agoxloudcraft.com auto-generates and updates from live account and gives you info like cost etc. Looks really.i.ptessive
- rurounijones 6y agocloudcraft.com Stupid mobile keyboards...
- bingo_cannon 6y agoThis looks really neat! Is it possible to have embedded diagrams. For example, Gitlab lets you embed a PlantUML[1] diagram in any Markdown or ADoc file using a proxy server. This makes it really easy to write and serve documentation. Personally, I'm a fan of PlantUML. Having an svg served in a browser that has labels linking directly to the relevant entity (code, resource etc) is a huge plus for new hire onboarding. 1: https://plantuml.com/ https://plantuml.com/
- arduinomancer 6y agoI wish plantUML would update it's default theme, I feel like more people would use it if it didn't look ancient.
- gentleman11 6y agoI personally enjoy the style of it, but it could be described as “retro.”
- subhobroto 6y agoPlantUML and Mermaid have really been very useful to me! It feels like I'm missing something with this tool if one's already aware of Mermaid (and PlantUML)
- kovek 6y agoThis is cool! I was hoping it would look something like: ‘’’ import diagrams calc_d = diagrams.new_diagram(“calculator_123”) calc_d.Datum("SuperNumber") class SuperNumber(int): pass @calc_d.Service(“Calculator”, “takes numbers and operations and operates”) class Calculator(object): @calc_d.Endpoint("Add", calls=["Increment"], main_data={"b": "SuperNumber}) def add(self, a, b: SuperNumber): out = a for i in range(b): calc_d.multi(calls=["Increment"]) out = self.increment(out) @calc_d.Function("Increment") def increment(self, a): return a+1 def integration_test(): calc_d.instantiate("Calculator") calc = Calculator() ... ‘’’ EDIT: Dear dang and YC Hacker News, I would love to create code blocks using surrounding triple quotes..
- kitd 6y agoIndent with 4 spaces at the start of each line for code blocks.
- anamexis 6y agoThis is annoyingly difficult in a browser.
- Allezxandre 6y agoJust copy the text and use `sed` on your clipboard to transform your text. On macOS: pbpaste | sed 's/^.*$/ &/' | pbcopy
- yesenadam 6y agoPerhaps it's more readable/writeable with Awk: pbpaste | awk '{print " "$0}' | pbcopy Although this also seems to do the same thing pbpaste | sed 's/^/ &/' | pbcopy
- deleted 6y ago[deleted]
- kovek 6y ago
- Bedon292 6y agoI have been thinking about using this for some diagrams, but whats been on the back of my mind since I heard about it is how to combine it with Terraform, or Troposphere, and have your infrastructure as code also draw the diagrams automatically.
- inetknght 6y agoI had the exact same thought!
- baq 6y agoIME diagrams resulting from production code are not helpful - code is full of boilerplate, irrelevant details and is generally made to solve a problem instead of being documentation. ...but if a tool that simplifies configuration or code into a diagramable state exists, i'd like to know :)
- 2fast4you 6y agoSent this to a few people at work and it spread pretty quickly. We all love it!
- iblaine 6y agoThis is great. Code needs to replace more drag n drop tools, at the very least to give people options.
- dr_hooo 6y agoI was recently looking for something similar, allowing me to draw network diagrams using text or code. I came across [0] which looks great, but has some rough corners and seems to be abandoned by he author. Does anyone have any other recommendations for more bare-metal oriented topologies? [0] http://go.drawthe.net/ http://go.drawthe.net/
- delduca 6y agoI just created a Dockerfile to run: https://github.com/skhaz/diagrams https://github.com/skhaz/diagrams
- BiteCode_dev 6y agoSlightly different, but there is now an VSCode extension to use draw.io directly in the editor. https://marketplace.visualstudio.com/items?itemName=hediet.vscode-drawio https://marketplace.visualstudio.com/items?itemName=hediet.v... If you don't know draw.io, it's an free diagram software that not only has an XML format to save them, but can also be used to save it as a PNG that EMBEDS said XML, so you can edit it again, but display it like a regular image.
- seph-reed 6y agoWhen I was ~10yrs old, I would play with a program called RPG Maker 2000. It had a really interesting code system where you could click blocks of code and it would bring up a UI for modifying them. It was always simple stuff like if/else, for, switch.. but it merged the simplicity of clicking dropdowns and the like with the complexity of actually seeing the code and learning to read and navigate it. You could also go rogue and write custom code. I still think that this solution has more life to it and would like to explore that some day.
- muffin24 6y agocool stuff
- slackfan 6y agoSo, how well does this compare to graphviz? Seems a heck of a lot more verbose.
- eeZah7Ux 6y agoGraphviz is way more flexible.
- xendo 6y agomy favorite: https://plantuml.com/ https://plantuml.com/
- subhobroto 6y agoPlantUML and Mermaid have really been very useful to me.
- neves 6y agoWhy is this better than Mermaid? It works in Markdown, you can version control, and Git(Hub|Lab) displays it automatically. I'm really curious. Maybe for doing something programmatically, but GraphViz may be better.
- neves 6y agoHere is the link to Mermaid: https://mermaid-js.github.io/mermaid/#/ https://mermaid-js.github.io/mermaid/#/
- topspin 6y ago> Why is this better than Mermaid? It isn't. Apples and oranges; Mermaid deals with UML-ish type diagrams whereas 'Diagram as Code' is illustrating cloud system architecture. > but GraphViz may be better GraphViz is actually doing the rendering. You might want to take a moment and study the site.
- eeZah7Ux 6y agoGraphviz is even better: you can generate SVGs and PNGs that can be displayed without jabbascript
- tamiral 6y agothis is going to send me down a rabbit hole for a long long time .... there was another thread some months ago about an architecture diagraming tool that reads the code and outputs architecture based on methods.
- eeZah7Ux 6y agoWhy the obsession with product names and logos? Having a Python class for a specific product is not necessary. ...and then people talk about CV-driven development...
- fold_left 6y ago> from diagrams import Diagram Slightly off-topic, but I wish JavaScript's import syntax was designed to be this way around, for better autocomplete in your editor.
- deleted 6y ago[deleted]
- sleet 6y agoSELECT column FROM table :(
- ktaylora 6y agoCame here half-expecting to see probabilistic programming implemented via Direct Acyclic Graphs (DAGs). This is cool, too, though.
- heisenzombie 6y agoThe author has made DSL in Python by (ab?)using context managers and the bitshift operator. It's very interesting, and I haven't seen anything quite like it. Python can lend itself to horrific abuses through shenanigans like this. I sometimes feel that siren call myself, and usually regret it. So by default I'm pretty skeptical of this kind of thing, but I'm actually on the fence about this one.
- whatshisface 6y agoCheck out Sagemath for an entire Mathematica thing done entirely through overloading.
- heisenzombie 6y agoYes! A good point of comparison. (n.b. I have only used SymPy, not Sagemath. I'm assuming they're similar) I think sympy (and maybe sage) is a bit different because they're (mostly?) overloading operators for their intended purpose -- that is, the "+" operator does semantically add python objects that represent symbolic math.
- whatshisface 6y agoSagemath is a big package that includes sympy.
- arminiusreturns 6y agoIf you are interested in this kind of thing please check out the blockdiag series of tools (seqdiag, rackdiag, netdiag, etc) I haven't looked back since I started using them other than a workplace that uses lucidchart. http://blockdiag.com/en/ http://blockdiag.com/en/
- chrisweekly 6y agoSlight tangent, but some of the cool tools noted in the comments remind me of some of the amazing things put out by Netflix engineering in recent years, like Vizceral^1 and Flux^2. 1. https://github.com/Netflix/vizceral/wiki https://github.com/Netflix/vizceral/wiki 2. https://link.medium.com/LY2vw4Rsr6 https://link.medium.com/LY2vw4Rsr6 (Sorry about the Medium.com link; all I could grab on the spot on phone)
- jzer0cool 6y agoThis looks pretty cool and has as nice modern look to it. I can see did a good job with the layout/design too. If you don't mind sharing (or if anyone knows of any toolkits/libraries): I wanted to try getting at drawing some custom diagrams and was unsure where to begin coding just project. Any know of anything that comes to mind?