Your Web News in One Place

Help Webnuz

Referal links:

Sign up for GreenGeeks web hosting
February 15, 2022 02:30 am GMT

Github README with diagram using mermaid

Want to add diagrams in your github .md files to tell the flow of your system or the flow of each component talking to each other ? Today I just found something useful worth to share and lets just dive in with some examples.

Flowchart

    ```mermaid        flowchart TD;        A[Process] --> B{Condition?};        B -- Yes --> C[Another Process];        B -- No --> D[Exit Process];        C ----> E{Another Condition?};        E -- Yes --> F[Etc...];        E -- No --> G[Etc...];    ```

Each Letters before nodes represents as their id's so when you call A ----> B means node A will point to node B.

Output:

github

More diagram examples here Mermaid Documentation
Other sources github-blog


Original Link: https://dev.to/vindecodex/github-readme-with-diagram-using-mermaid-2kfg

Share this article:    Share on Facebook
View Full Article

Dev To

An online community for sharing and discovering great ideas, having debates, and making friends

More About this Source Visit Dev To