Jak zahrnout diagramy mořské panny do vašeho projektu GitHub

Populární platforma pro sdílení kódu, GitHub, oznámila podporu nového typu vloženého obsahu. V souborech markdown můžete nyní použít syntaxi Mermaid ke snadnému vytváření vývojových diagramů, sekvenčních diagramů a dalších.

Styl markdown na GitHubu již zvládá obrázky, seznamy úkolů a krátké kódy emotikonů. S podporou běžných diagramů se GitHub snaží získat více informativní a užitečnou dokumentaci.

Co je nového na GitHubu?

Nyní můžete do svého vložit kód mořské panny README.md a další soubory markdown. Pokud tak učiníte, GitHub vykreslí diagram popsaný tímto kódem. Kód mořské panny používá jednoduchou syntaxi, která popisuje jednotlivé části každého diagramu prostým textem.

Viz také: Co je GitHub? Úvod do jeho základních funkcí

Jak zahrnete diagramy?

1. Buď vyberte existující soubor markdown, nebo vytvořte nový, který přidáte do svého úložiště. Použijte buď .md nebo .snížení rozšíření.
2. Přidejte do toho souboru nějaký kód mořské panny. Jaký kód přesně záleží na vás; zde je jednoduchý příklad pro začátek:

   graf TD;
    A --> B;
    A --> C;
    B --> D;
    C-->D;

instagram viewer
3. Zobrazit soubor na GitHubu. Měli byste vidět pěkné vykreslení vašeho diagramu.

Nyní se stačí naučit množství diagramů, které má Mermaid k dispozici. Nebo můžete jednoduše odkazovat na Mořská panna dokumentaci, jak a kdy potřebujete schéma.

Jaké druhy diagramů mohu použít?

Mořská panna podporuje následující typy diagramů:

• Vývojový diagram
• Sekvence
• Třída
• Stát
• Vztah entity
• Cesta uživatele
• Gantt
• Koláč
• Požadavek

Viz také: Ganttův diagram vs. Graf PERT: Jaké jsou rozdíly?

Každý má svou vlastní syntaxi, která odráží typ dat, která diagram zobrazuje. Zde je například kód pro jednoduchý sekvenční diagram:

sekvenceDiagram
 Bart->>Homer: Neměj krávu, člověče.

Což po vykreslení vypadá takto:

A zde je kód pro základní stavový diagram:

stateDiagram-v2
 [*] --> Nové
 Nové --> Připraveno: přijato
 Připraveno --> Spuštěno: odeslání plánovače
 Spuštěno --> Připraveno: přerušení
 Spuštěno --> Čekání: I/O nebo čekání na událost
 Čekání --> Připraveno: I/O nebo dokončení události
 Spuštěno --> Ukončeno: ukončení
 Ukončeno --> [*]

Což se takto vykreslí:

Přidejte hodnotu svým projektům GitHub pomocí diagramů mořské panny

Diagramy mořské panny jsou užitečným doplňkem GitHubu, zejména proto, že věříme, že podporují lepší dokumentaci. Mnoho projektů by mohlo být vylepšeno některými vizuálními vysvětlivkami přímo v jejich dokumentaci nebo souborech README.

GitHub je nyní tak populární službou, její funkce a změny ovlivňují mnoho vývojářů po celém světě. Naštěstí je zde podpora pro diagramy mořské panny, pokud ji potřebujete, a neviditelná, pokud ji nepotřebujete. Ale doufejme, že začnete vidět alespoň nějakou hezčí dokumentaci.

Jak hostovat web zdarma pomocí stránek GitHub

Pokud máte jednoduchý web, nemusíte platit za webhosting. Stránky GitHub můžete používat zdarma!

Přečtěte si další

O autorovi