Den populära koddelningsplattformen GitHub har meddelat stöd för en ny typ av inbäddat innehåll. I markdown-filer kan du nu använda Mermaid-syntax för att enkelt skapa flödesscheman, sekvensdiagram och mer.

GitHubs smak av markdown hanterar redan bilder, uppgiftslistor och emoji-kortkoder. Med stöd för vanliga diagram gör GitHub sitt för mer informativ och användbar dokumentation.

Vad är nytt med GitHub?

Du kan nu bädda in Mermaid-kod i din README.md och andra markdown-filer. Om du gör det kommer GitHub att återge ett diagram som beskrivs av den koden. Mermaid code använder en enkel syntax som beskriver de enskilda delarna av varje diagram i klartext.

Se även: Vad är GitHub? En introduktion till dess grundläggande funktioner

Hur inkluderar du diagram?

  1. Välj antingen en befintlig nedskrivningsfil eller skapa en ny att lägga till i ditt förråd. Använd antingen .md eller .prissänkning förlängningar.
  2. Lägg till lite Mermaid-kod till den filen. Exakt vilken kod är upp till dig; här är ett enkelt exempel för att komma igång:
    graf TD;
    A-->B;
    A-->C;
    B-->D;
    C->D;
  3. instagram viewer
  4. Se filen på GitHub. Du bör se en fin rendering av ditt diagram.

Nu behöver du bara lära dig rikedomen av diagram som Mermaid har tillgängliga. Eller så kan du helt enkelt hänvisa till Sjöjungfru dokumentation när och när du behöver ett diagram.

Vilka typer av diagram kan jag använda?

Mermaid stöder följande typer av diagram:

  • Flödesschema
  • Sekvens
  • Klass
  • stat
  • Entitetsförhållande
  • Användarresa
  • Gantt
  • Paj
  • Krav

Se även: Gantt-diagram vs. PERT-diagram: Vilka är skillnaderna?

Var och en har sin egen syntax för att återspegla den typ av data som diagrammet visar. Till exempel, här är koden för ett enkelt sekvensdiagram:

sekvensdiagram
Bart->>Homer: Har inte en ko, man.

Som ser ut så här när det renderas:

Och här är koden för ett grundläggande tillståndsdiagram:

stateDiagram-v2
[*] --> Nytt
Ny --> Klar: antagen
Klar --> Kör: schemaläggaren skickas
Kör --> Klar: avbryta
Kör --> Väntar: I/O eller händelse vänta
Väntar --> Klar: I/O eller slutförande av händelse
Kör --> Avslutad: avsluta
Avslutad --> [*]

Vilket renderar som sådan:

Lägg till mervärde till dina GitHub-projekt med sjöjungfrudiagram

Sjöjungfrudiagram är ett användbart tillägg till GitHub, särskilt eftersom vi tror att de uppmuntrar till bättre dokumentation. Många projekt skulle kunna förbättras med några visuella förklaringar direkt i deras dokumentation eller README-filer.

GitHub är nu en så populär tjänst, dess funktioner och ändringar påverkar många utvecklare runt om i världen. Tack och lov finns stöd för sjöjungfrudiagram om du behöver det, och osynligt om du inte gör det. Men förhoppningsvis kommer du åtminstone att börja se lite trevligare dokumentation.

Hur man är värd för en webbplats gratis med hjälp av GitHub-sidor

Om du har en enkel webbplats behöver du inte betala för webbhotell. Du kan använda GitHub-sidor gratis!

Läs Nästa

Dela med sigTweetE-post
Relaterade ämnen
  • Programmering
  • GitHub
  • Programmering
Om författaren
Bobby Jack (69 publicerade artiklar)

Bobby är en teknikentusiast som arbetat som mjukvaruutvecklare under de flesta av två decennier. Han brinner för spel, arbetar som chefredaktör på Switch Player Magazine och är fördjupad i alla aspekter av onlinepublicering och webbutveckling.

Mer från Bobby Jack

Prenumerera på vårt nyhetsbrev

Gå med i vårt nyhetsbrev för tekniska tips, recensioner, gratis e-böcker och exklusiva erbjudanden!

Klicka här för att prenumerera