Skip to content
SayDiagramSayDiagram

Learn

Git graph syntax

Learn commits, branches, checkout, and merges used in the Feature branch merge template.

On this page7 sections
  1. Syntax cheatsheet
  2. 1.Start a git graph
  3. 2.Commits with ids and messages
  4. 3.Branches and checkout
  5. 4.Merge a branch
  6. 5.Put it together: Feature branch merge
  7. Check your level

Syntax cheatsheet

Quick reference for this diagram type

ConceptSyntax
DeclaregitGraph · gitGraph LR:
Commitcommit · commit id: "setup"
Branchbranch feature
Switchcheckout feature · switch main
Mergemerge feature
Tagcommit tag: "v1"
  1. 1

    Start a git graph

    Begin with gitGraph so Mermaid renders a commit history. Optional direction: LR (default), TB, or BT.

    Git graphs are Preview-only in SayDiagram — Present reveals commits and branch ops step by step.

    gitGraph
  commit
  commit
    Expand
  2. 2

    Commits with ids and messages

    Use commit alone for anonymous nodes, or commit id: "name" / commit "message" for readable labels.

    type: HIGHLIGHT and tag: "v1" call out important commits.

    gitGraph
  commit id: "init"
  commit id: "setup"
  commit id: "release" tag: "v1"
    Expand
  3. 3

    Branches and checkout

    branch name creates a new line of history from the current tip. checkout (or switch) moves subsequent commits onto that branch.

    Always checkout main (or another base) before merging a feature back.

    gitGraph
  commit id: "init"
  branch feature
  checkout feature
  commit id: "work"
  checkout main
    Expand
  4. 4

    Merge a branch

    merge branchName creates a merge commit on the current branch.

    List ops in chronological order so Present and Mermaid stay easy to follow.

    gitGraph
  commit id: "init"
  branch feature
  checkout feature
  commit id: "work"
  checkout main
  merge feature
    Expand
  5. 5

    Put it together: Feature branch merge

    Combine commits, a feature branch, and a merge into the Examples gallery template.

    • Tip: Present mode reveals one git operation per slide — useful for walking a branching strategy.
    gitGraph
  commit id: "init"
  commit id: "setup"
  branch feature
  checkout feature
  commit id: "api"
  commit id: "ui"
  checkout main
  merge feature
  commit id: "release"
    Expand

Check your level

80% or higher certifies this lesson. You'll get 3–5 random questions from a larger bank.

Back to examples