#SEQUENCE DIAGRAM IF LOOP PROFESSIONAL#

Sequence diagrams represent systems and individuals as vertical columns and messages between these parts as horizontal lines that move across the various lanes to show how data flows between different pieces of the system. Mermaid.js is available in a variety of tools, but I most frequently use it in GitHub markdown files and in Polyglot Notebooks.įor those of you who haven't been exposed, sequence diagrams describe a series of messages in a sequence between different objects. It also means that the diagram source is easily version-controlled and anyone on your team can modify it without special tooling or licenses. This means your time is focused on actually writing the interaction logic instead of generating a visual.

#SEQUENCE DIAGRAM IF LOOP PROFESSIONAL#

With Mermaid.js you can write a few lines of text and use its JavaScript library to generate a professional sequence diagram like the one below:

Mermaid.js is the solution I needed 20 years ago. I distinctly remember working on sequence diagrams in my undergraduate computer science education and having so many issues trying to get the various boxes and arrows to look standard, rearrange shapes as I needed to expand the diagram, and generally focusing on anything but the logic the diagrams intended to create. Previously I've shown how Mermaid.js allows you to create entity relationship diagrams and class diagrams, but in this article we'll cover a far more complex diagram: the sequence diagram. I've been really enjoying seeing how Mermaid.js lets you generate technical diagrams from simple markdown.

Sequence diagram if loop