tailwind-nextjs-starter-blog
tailwind-nextjs-starter-blog copied to clipboard
Diagram Generation
I'm always looking for ways to automatically generate diagrams in blog posts using DSLs rather than WYSIWYG solutions.
I've read this blog post from GitHub where they have integrated a really nice looking solution for using diagram generation from MD files https://github.blog/2022-02-14-include-diagrams-markdown-files-mermaid/
There is a plugin for remark which seems like it could integrate easily. https://github.com/sjwall/mdx-mermaid
I've already considered a solution using draw.io integrated into VSCode using SVG diagrams. This was in a previous issue on this repo as a good solution to solve this issue. Without being tied specifically to a VSCode and one extension, especially now this project.
Given the large amount of supported platforms this doesn't seem too big of a risk to add https://mermaid-js.github.io/mermaid/#/./integrations
Would you be interested in me trying this out an possibly posing a PR if it works well enough?
I prefer PlantUML to Mermaid, but Mermaid is better than nothing.
https://wyssmann.com/blog/2021/03/diagrams-as-code-plantuml-or-mermaid/
I don't really like the approach taken by mdx-mermaid
. It basically injects mermaid.js as a dependency and renders the markup as a SVG on the client-side.
There's a discussion on remarksjs about adding mermaid support as well. Given that they have just introduced it on Github, I will just wait for the core maintainers of remarkjs to decide how best to handle it and not accept a PR till then.
There's a related thread here as well: https://github.com/remcohaszing/remark-mermaidjs/issues/3
Note that mermaid is included in gitlab for a while
I don't really like the approach taken by
mdx-mermaid
. It basically injects mermaid.js as a dependency and renders the markup as a SVG on the client-side.There's a discussion on remarksjs about adding mermaid support as well. Given that they have just introduced it on Github, I will just wait for the core maintainers of remarkjs to decide how best to handle it and not accept a PR till then.
There's a related thread here as well: remcohaszing/remark-mermaidjs#3
Maybe we can use mermaid-cli to compile *.mmd file (mermaid source file) to svg directly.
Any update on this? I would love to be able to render Mermaid diagrams natively within the template.