mermaid VS excalidraw

* Drawn by mermaid.

The Markdown format is a blessing for documentation. While many are aware it can create headings, tables, text styles, and lists, not many know about extensions available to the basic Markup language. Today, we'll learn about Mermaid.js. This powerful yet simple diagramming tool speaks to the aspirations of Markdown format.

The diagrams in the first half of the article are made with tldraw https://www.tldraw.com/

The lower half look like the output from Mermaid https://mermaid.js.org/

Lets, assume we want to add rendered Mermaid diagrams to our page by transforming the source code in fenced code blocks like the following:

I might know nothing about debates, but in my impression you always make the diagram that does its job best. Argdown seems to constrain everything to its framework and forces the style of the output.

Also, Mermaid (https://mermaid.js.org/) exists.

i hope they'll eventually support Mermaid (https://github.com/mermaid-js/mermaid) for creating diagrams directly within documents. i've been using it a lot for my markdown files and it works amazingly well with LLMs (e.g. asking LLM to generate the diagram representation of something using Mermaidjs)

Web for Designing Schematics and Sketches

Add diagrams if needed to help you understand what’s going on in the future. Tools like Excalidraw and Figma have made creating great diagrams for workflows or infrastructure easy.

✅Try out Excalidraw

Note: Professionally I do practically nothing with the frontend of web development, so my experience may be far from normal, but when I do have to do something frontend related for personal work or the rare work-related task, I prefer a very rough wireframe using something like https://excalidraw.com/

You can still produce something useful even if you’re not a professional designer. For example, you can use a rapid wireframing tool like Balsamiq (my favorite) or Excalidraw. With such tools, you can sketch an idea quickly without spending time on minor visual details. Or, use a whiteboard or good old pencil and paper. Any sketch is better than nothing.