GitPlace — Yet Another Tiny Git UI?

When you type git help everyday on your terminal, the guide is described as: giteveryday — A useful minimum set of commands for Everyday Git.

If you use Git everyday, you’d agree with that short description, and by now those git commands may have become second nature to you.

Nevertheless, in the process of understanding the history and evolution of a repository, especially a large repo that has evolved over the course of many years, there comes certain limitations in understanding the repo by simply reading directly from the terminal. With the many branches and their remote tracking branches, tags, and an almost endless commit graph going back in time, you’d agree that using the git commands and consuming the output right from the terminal can be very daunting, sometimes tiring for such tasks as investigating a repo’s evolution.

In the process of investigating the evolution of certain software projects I planned on making contributions to, I thought, why not make a tool that simply calls these commands and show them in a simple UI. That was how GitPlace was born. Perhaps it’s yet another Git UI tool, but time will tell.

It is currently aimed at being a read-only tool, therefore, actions that would mutate the state of either the git index, or the commit tree are not implemented. Leaving only actions such as acheckout which is useful in this case for checking out “milestones” in the history of a repository. The git diff HEAD^ HEAD comes to mind here for checking the “diff” between the current commit under consideration and the one before it, as pointed to by the symbolic ref— HEAD. Similar none mutative commands are implemented in GitPlace.

The following images show some of the features provided by this tool, to aid in understanding the evolution of a project that uses Git as it’s VCS.

The dashboard

Dashboard view of the git repostiory itself.

The dashboard simply shows a graph of the top 50 contributions, and a paginated table of all contributors to the project.

A History Tab

A commit graph of an early stage in the git evolution.

Here as in many other areas, as little as possible is done to the data coming from the git command; only changing the colors for contrast with the aid of the --pretty={format} option.

A View of the Refs

A display of the tags, branches and their remote tracking branches.

The only actions that can be taken here is to checkout to any tag, branch or a commit ref, this action determines the files to be seen on the “Files” menu shown below.

The Files

Files belonging to a commit tree.

The content of a blob

A plain read-only view of a blob — how git sees a file.

Highlight.js was used to help provide color highlights for as many languages as currently supported by the library.

Building GitPlace

GitPlace is simply a more friendly way of seeing the progress of your repository, helpful also when actually developing, as it displays content of the current working directory using git diff and also changes you’ve already added to the index but not yet committed by calling the git diff --cached command.

The Go programming language was used to write a server that exposed a simple interface to calling all the required git commands. See here on github.

Vuejs was used for the frontend bits of the, and a lot of the UI components used was provided by Buefy — Lightweight UI components for Vue.js based on Bulma. Also on github here.

Finally, using the advantage that Go provides, both the frontend client and the backend server were compiled as a single statically linked binary. So getting GitPlace is just a single binary away.

To use, download the binary and add the /path/to/binary to the $PATH environment variable, cd into a directory that already has a .git folder, and execute the binary.

You can add the -URL={url} option to the command, eg. gitplace -URL=:5724 and visit localhost:5724 to view and enjoy the beautiful history of the project you have built or plan to contribute to, or any project you want to learn more about for that matter.

I think GitPlace is not just another Git UI tool, it is one with a difference, to add fun to the learning and realization process of how a software project has evolved and how it is evolving.

It is currently tagged at v0.1 . Before a site is hosted to share the binaries for supported platforms, you can reach me on twitter @_willpoint to get a copy if you’d love to try it immediately and probably give immediate feedback or you can wait a bit till when it’s hosted.

Whatever the case, I hope it would be used for fun and profit.