Git on the Command Line — Improving the Experience

Git is great. Git was a breath of fresh air for those of use who came from a background of SVN, Perforce, ClearCase or…*shudder*, CVS.

We at ag-Grid love open-source, and our VCS of choice is Git, with Github our choice of host.

Although I live most of my time in my IDE (IntelliJ FTW!) when it comes to version control I almost always drop down to the command line. The support for Git in most IDEs is great — it’s more of a personal preference.

I can script common tasks from the command line (although of course you could execute these script from the IDE), and don’t have to worry about synchronizing the IDE to the state of the file system (a rare problem to be fair). What the command line tells me is the truth — if I want to know what the state my project is git status tells me, in a quick to parse information dump.

Familiarity and habit may also play a large part of my love of the command line though…

Out of the box Git is great, but without too much effort the command line experience can be improved a great deal. With a bit of colour we and a few icons we can, at a glance, get most of the information we commonly require from Git.

Do we have modified files? Check. Do we have files that are untracked? Check. What branch am I in at the moment? Got that covered. And so on.

At the end of my playing around this is what I now use day to day here at ag-Grid:

At a glance I can seee who I’m logged in as (seanlandsman), which host I'm on (MPB), the current directory (ag-grid-dev), what branch (master), the number of modified files (+1) and the number of untracked files (+1).

If I happened to be in a non-Git controlled directory then the branch and file status information would not be shown.

Adding Colour to Git — The Basics

You can add colour to Git output by modifying ~/.gitconfig. The following will add colour to the main Git commands:

[color]
    branch = auto
    diff = auto
    status = auto
[color "branch"]
    current = yellow reverse
    local = yellow
    remote = green
[color "diff"]
    meta = yellow bold
    frag = magenta bold
    old = red bold
    new = green bold
[color "status"]
    added = yellow
    changed = green
    untracked = cyan

This is great and already helps visually distinguish between the different pieces of information — a good start!

Information… Without Asking

The above helps, but relies us executing Git commands to get the current state of play. This is fine of course, but if like me you’d like a gentle reminder of what’s going on, and where you are, then we can improve on this.

bash-git-prompt

bash-git-prompt is a shell script maintained by Martin Gondermann which adds information to the command line for us.

As with any any executable from the web there is a risk. I’ve read through the script and am happy with what it’s doing, but please ensure you’re happy with it before trying this too!

You can install this either via Git clone, or via Homebrew. I work primarily on OSX and found the cloning method easier, but both should work.

cd ~
git clone https://github.com/magicmonty/bash-git-prompt.git .bash-git-prompt --depth=1

This will create a directory within your home directory called .bash-git-prompt, which does the work of executing Git status commands and returning the results in a format with icons and colours - all of which is configurable.

Next we need to ensure the script is run when we’re in the terminal. Add the following to ~/.bashrc:

GIT_PROMPT_ONLY_IN_REPO=1
source ~/.bash-git-prompt/gitprompt.sh

GIT_PROMPT_ONLY_IN_REPO=1 will ensure that the Git output will only be done in Git managed directories.

As the terminal opens a login shell, your .bashrc may not get excuted in new windows. While experimenting you may want to add this to your .bash_profile to ensure your changes are picked up each time you open a new terminal window:

[[ -s ~/.bashrc ]] && source ~/.bashrc

The default configuration would give you an output something like this:

This is a good start, but all of this is configurable. For my use case I’d prefer to keep the output a little terser, partly as when I’m working exclusively on my laptop screen real estate becomes a premium.

I also (occasionally) work on remote hosts and it’s a good reminder to know what and who I am when I’m there, so I’d like to have this shown too.

Finally, although nice I don’t really need to know the status of the last command excuted (the little green tick at the start indicates this).

Themes are how bash-git-prompt allows for user configuration of the output. There are a number of themes provide with bash-git-prompt and I'd encourage you to try them to see what's possible, but in my case I decided to tweak the output to something bespoke.

git_prompt_make_custom_theme Default

The above will create a new theme file (~/.git-prompt-colors.sh) based on the Default theme.

I won’t list the entire file contents here, but will highlight the parts I’ve changed:

That’s it! With these small changes in place I’m done — I have the output I wanted with very little configuration.

I encourage you to give this a go, and experiment with the provided themes — you may find one of them already does want you want. I’d also encourage you to read the docs in the bash-git-prompt page — there’s a lot of good information there.

Learn more about AG Grid — high performance JavaScript Data Grid. We write the code to visualise data in interactive tables so you can concentrate on writing the application code. We support multiple frameworks: Angular, Vue, React so you can pick the best framework for your needs.