[ARCHIVED] A JavaScript library to draw pretty git graphs in the browser
See the code[!IMPORTANT] This project has been unmaintained since 2019. Since I couldn't find a new dedicated maintainer, the project is now archived.
Gitgraph.js was designed to draw simple git graphs using a JS API, to illustrate blog articles or make presentations. Feel free to fork the project to make it fit your needs. As of 2024, I would recommend checking out what Mermaid.js can do.
Today, my OSS energy is dedicated towards Abracadabra, a VS Code extension that gives you automated refactorings for JS and TS.
Thanks!
— Nicolas Carlo

A JavaScript library to draw pretty git graphs.
GitGraph.js codebase is a monorepo. Packages are released under @gitgraph/* scope.
As a user, you're probably interested in one of the rendering libraries:
You'll find usage details in their README.
As a contributor, you might be interested in checking out gitgraph-core. It contains the core logic for rendering libraries to use.
You can find demo at Here
You can find documentation at Here
Pre-requisites:
Setting things up:
git clone git@github.com:nicoespeon/gitgraph.js.gityarn installyarn run lerna bootstrapLerna will install dependencies of all packages and links any cross-dependencies.
Available root-level commands are detailed in package.json. You would usually need:
yarn test to run Jest unit tests (yarn test --watch for watch mode)yarn develop to start Storybook, watching for changes of all packagesYou can also go to specific packages and run available commands detailed in their
package.json. For example, you couldcd packages/gitgraph-core/and runyarn test --watchto only run tests of this package.But root-level commands are more convenient!
Read our contributing guide to learn about our development process, how to propose bugfixes and improvements, and how to build and test your changes to GitGraph.js.
To help you get your feet wet and get you familiar with our contribution process, we have a list of good first issues that contain bugs which have a relatively limited scope. This is a great place to get started.
We use SemVer as a guideline for our versioning here.
Releases use the following format:
<major>.<minor>.<patch>
<major> (and reset <minor> & <patch>)<minor> (and reset <patch>)<patch>Copyright (c) 2013 Nicolas CARLO and Fabien BERNARD under the MIT license.
Thanks to Chromatic for providing the visual testing platform that help us catch visual regressions for the rendering libs.
Overall
Maintained
Code review
npm
Latest release
Releases this year
(top 24 of 32)
5,039 followers · starred Sep 2019
768 followers · starred Dec 2017
133 followers · starred Jul 2021
598 followers · starred Apr 2016
[ARCHIVED] A JavaScript library to draw pretty git graphs in the browser
See the code[!IMPORTANT] This project has been unmaintained since 2019. Since I couldn't find a new dedicated maintainer, the project is now archived.
Gitgraph.js was designed to draw simple git graphs using a JS API, to illustrate blog articles or make presentations. Feel free to fork the project to make it fit your needs. As of 2024, I would recommend checking out what Mermaid.js can do.
Today, my OSS energy is dedicated towards Abracadabra, a VS Code extension that gives you automated refactorings for JS and TS.
Thanks!
— Nicolas Carlo

A JavaScript library to draw pretty git graphs.
GitGraph.js codebase is a monorepo. Packages are released under @gitgraph/* scope.
As a user, you're probably interested in one of the rendering libraries:
You'll find usage details in their README.
As a contributor, you might be interested in checking out gitgraph-core. It contains the core logic for rendering libraries to use.
You can find demo at Here
You can find documentation at Here
Pre-requisites:
Setting things up:
git clone git@github.com:nicoespeon/gitgraph.js.gityarn installyarn run lerna bootstrapLerna will install dependencies of all packages and links any cross-dependencies.
Available root-level commands are detailed in package.json. You would usually need:
yarn test to run Jest unit tests (yarn test --watch for watch mode)yarn develop to start Storybook, watching for changes of all packagesYou can also go to specific packages and run available commands detailed in their
package.json. For example, you couldcd packages/gitgraph-core/and runyarn test --watchto only run tests of this package.But root-level commands are more convenient!
Read our contributing guide to learn about our development process, how to propose bugfixes and improvements, and how to build and test your changes to GitGraph.js.
To help you get your feet wet and get you familiar with our contribution process, we have a list of good first issues that contain bugs which have a relatively limited scope. This is a great place to get started.
We use SemVer as a guideline for our versioning here.
Releases use the following format:
<major>.<minor>.<patch>
<major> (and reset <minor> & <patch>)<minor> (and reset <patch>)<patch>Copyright (c) 2013 Nicolas CARLO and Fabien BERNARD under the MIT license.
Thanks to Chromatic for providing the visual testing platform that help us catch visual regressions for the rendering libs.
Overall
Maintained
Code review
npm
Latest release
Releases this year
(top 24 of 32)
5,039 followers · starred Sep 2019
768 followers · starred Dec 2017
133 followers · starred Jul 2021
598 followers · starred Apr 2016