Marco Eidinger
Swifty Tech by Marco Eidinger

Swifty Tech by Marco Eidinger

The easiest way to draw git graphs

The easiest way to draw git graphs

Marco Eidinger's photo
Marco Eidinger
·Feb 6, 2021·

2 min read

Subscribe to my newsletter and never miss my upcoming articles

I find it easier to discuss branching and release strategies for git repositories with visual aid. Here is an example of a git graph:

branching.png

You might think that looks really complex! How difficult is it to draw such graphs?!?

If you know JavaScript a bit (don't worry, you don't have to be an expert) then its quite easy thanks to GitGraph.js. This JavaScript library does all the heavy lifting and enables you to programmatically define the git graph which then gets rendered in the browser by the library.

I really dig their online documentation in form of a slide show.

gitgraphjs.gif

My tip: use CodePen or any alternative online editor (which supports HTML/JS/CSS) to get started quickly. No unnecessary download of GitGraphJS as you can specify the use as an external script.

If you like this then please leave a star on this open-source project.

Did you find this article valuable?

Support Marco Eidinger by becoming a sponsor. Any amount is appreciated!

See recent sponsors Learn more about Hashnode Sponsors
 
Share this