Cum să includeți diagrame de sirenă în proiectul dvs. GitHub

Populara platformă de partajare a codului, GitHub, a anunțat suport pentru un nou tip de conținut încorporat. În fișierele markdown, acum puteți utiliza sintaxa Mermaid pentru a crea cu ușurință diagrame de flux, diagrame de secvență și multe altele.

Aromă de reducere a GitHub gestionează deja imaginile, listele de activități și codurile scurte emoji. Cu suport pentru diagrame obișnuite, GitHub face parte pentru o documentație mai informativă și utilă.

Ce este nou cu GitHub?

Acum puteți încorpora codul Mermaid în dvs README.md și alte fișiere de reducere. Dacă o faci, GitHub va reda o diagramă descrisă de acel cod. Codul sirenei folosește o sintaxă simplă care descrie părțile individuale ale fiecărei diagrame în text simplu.

Vezi si: Ce este GitHub? O introducere în caracteristicile sale de bază

Cum includeți diagramele?

1. Alegeți un fișier de reducere existent sau creați unul nou pe care să îl adăugați în depozit. Folosiți fie .md sau .reducere extensii.
2. Adăugați un cod Mermaid la acel fișier. Exact ce cod depinde de tine; iată un exemplu simplu pentru a începe:
   instagram viewer

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

3. Vizualizați fișierul pe GitHub. Ar trebui să vedeți o redare frumoasă a diagramei dvs.

Acum trebuie doar să înveți multitudinea de diagrame pe care Mermaid le are la dispoziție. Sau puteți pur și simplu să vă referiți la Sirenă documentație pe măsură ce aveți nevoie de o diagramă.

Ce tipuri de diagrame pot folosi?

Mermaid acceptă următoarele tipuri de diagrame:

• Diagramă
• Secvenţă
• Clasă
• Stat
• Relația cu entitate
• Călătoria utilizatorului
• Gantt
• Plăcintă
• Cerinţă

Vezi si: Diagrama Gantt vs. Diagrama PERT: Care sunt diferențele?

Fiecare are propria sa sintaxă, pentru a reflecta tipul de date pe care le afișează diagrama. De exemplu, iată codul pentru o diagramă de secvență simplă:

Diagrama secvenței
 Bart->>Homer: Nu ai vaca, omule.

Care arată astfel când este redat:

Și iată codul pentru o diagramă de stare de bază:

stateDiagram-v2
 [*] --> Nou
 Nou --> Gata: admis
 Gata --> Rulează: expedierea programatorului
 Running --> Gata: întrerupere
 Running --> Waiting: I/O sau eveniment așteptare
 În așteptare --> Gata: I/O sau finalizarea evenimentului
 Rulare --> Terminat: ieșire
 Terminat --> [*]

Care se redă ca atare:

Adăugați valoare proiectelor dvs. GitHub cu diagrame sirene

Diagramele cu sirene sunt un plus util pentru GitHub, mai ales că credem că încurajează o documentare mai bună. Multe proiecte ar putea fi îmbunătățite cu niște explicații vizuale chiar în documentația lor sau în fișierele README.

GitHub este acum un serviciu atât de popular, caracteristicile și modificările sale afectează mulți dezvoltatori din întreaga lume. Din fericire, suportul pentru diagramele Mermaid este acolo dacă aveți nevoie de el și invizibil dacă nu aveți. Dar, sperăm, veți începe să vedeți măcar o documentație mai frumoasă.

Cum să găzduiești un site web gratuit folosind paginile GitHub

Dacă aveți un site web simplu, nu trebuie să plătiți pentru găzduire web. Puteți folosi Paginile GitHub gratuit!

Citiți în continuare

Despre autor