03
Feb
2013
33 Comments

GitGutter

Almost a year ago I switched to using Sublime Text and soon wondered how I ever lived without it. Sublime text is awesome, but there are many other works out on the net talking about how great it is, so I won't try to convince you. You can google why sublime text is awesome if you are curious though.

I was using Netbeans at the time and I went from primarily working on PHP applications to Rails. I didn't need an IDE like that anymore and was looking for a lightweight editor. I also was switching from development on Windows to OSX, I liked Notepadd++ but it wasn't available in my new environment. After brief encounters with Text Wrangler, Komodo Edit, and TextMate, I soon found Sublime Text and have been using it ever since.

From day one though, I always thought it was missing a feature. I had grown to love the way Netbeans displayed a color coded gutter for code modifications if you were using Mercurial. I tried to find something like that, I used the annotate feature of the git plugin but didn't like that the code lost it's syntax highlighting. So I finally decided to spend a weekend and build a plugin myself that did this.

I submitted it to sublime package manager and despite the fact that it initially didn't even work when installed via package manager (due to a directory name mismatch) it immediately started gaining a lot of traction.

It was talked about a lot on twitter, featured in Pycoder's Weekly, and on github it was the most starred python repo for the week when it was just a couple days old.




I was shocked. I mean I really only made this for myself, I had no idea everyone else would like it as much as I did. But they did, so suck it! just kidding. If you haven't checked it out yet its really cool. It shows you what lines were changed, added, and removed since your last commit:



In the screenshot above you can easily see at a glance that lines 10-13 (the new_method) were added. You can also see that lines 15 and 16 were modified and that one or more lines between 17 and 18 were removed (which would explain the indentation.) It also helps you spot debug statements you might easily overlook and accidentally commit (like line 23.) Sometimes I accidentally type into my text editor when I don't realize the window is selected, it makes that more easy to spot too. It really is quite useful.

You can install it via package manager by the name GitGutter. Check out the Read Me for more information.

33 Comments

D9000383017000de1e1025f4f80d8655?s=40
Osman
Fri Mar 14 17:34:37 2014
Nice work man. Really helpful!
0f858fa89b575c74b5fea72a776e67a0?s=40
Tue Mar 26 18:31:45 2013
Hello,
This plugin is really nice and helping whilst developing.
By the way, I have written an introduction in Farsi language for GitGutter in this link: http://www.adeveloper.org/2013/01/git-gutter-sublime-text.html

Thanks
5eee714742b20cd2dcccb9eb30aaa039?s=40
Thu Apr 24 13:31:32 2014
Really cool, thanks!
0bcb9d9fd3a77fd1a41ae3cbe2e6bfe2?s=40
Nicolás
Fri May 17 19:49:52 2013
Awesome plugin! Thanks!
3abd6047a5dc4565b6d6a81202085761?s=40
Joseph Ryan Wagner
Sat Oct 19 15:37:15 2013
I'm really excited about your plugin, but I'm having trouble getting it to work. I'm using Sublime Text 3 build 3047 on Mac 10.8.5, using the Tomorrow Theme - Night/Default. My .git folder is in the root of the project. I have tried both leaving the git binary as-is, and inputting /usr/local/git/bin. In all cases, the icons don't show up, though the annotations from the git plugin do. Thoughts?
Cebb8f230ae552b94c5b7967c342c1ce?s=40
Fri Nov 1 03:48:03 2013
Joseph, I think you put the wrong path it most like needs to be /usr/local/git/bin/git  You can get the correct path by running $ which git If you continue to have issues, you should open a ticket on github. :)
3abd6047a5dc4565b6d6a81202085761?s=40
Ryan Wagner
Fri Nov 1 13:09:59 2013
That did it, thanks so much! Awesome Plugin
A69adb82327dd8e0d65a46a91facc6f7?s=40
Hadi
Wed Feb 13 17:43:10 2013
Thanks for sharing, really nice plugin. You know what would be awesome? A plugin that shows you the changes done by others after you do git pull.
D35c20fc92588af66af32a84d7cb4e44?s=40
Thu Mar 7 16:19:43 2013
Get a GUI tool like Source Tree by Atlassian and you can view changes quite conveniently.
3e42b4e4c14eacd3357ba4c936bd858a?s=40
Sun Jan 19 16:41:47 2014
Been using this plugin, it is one awesome plugin. Thanks for creating it, you have made the Sublime eco-system much more rich with this plugin.
37ae21ca914bcb7b2143f5768de69347?s=40
Mon Feb 4 09:20:55 2013
I've been using this plugin for a few months now and it has helped me IMMENSELY! No longer am I keeping track of the files I've modified and where when in a git repo.
C7913541bb785426da778a3c6976cc35?s=40
Mon Feb 4 12:53:07 2013
I wish someone would port this to vim :)
Cebb8f230ae552b94c5b7967c342c1ce?s=40
Tue Feb 5 01:43:26 2013
I know there is an emacs port: https://github.com/syohex/emacs-git-gutter

I am not aware of any vim ports tho.
0df56f2edb0d80e81c5c0ef1ca91690e?s=40
joel
Thu Feb 7 16:09:31 2013
I guess this is different from Fugitive but I've been plenty happy with what I get from that on the git + vim front : https://github.com/tpope/vim-fugitive
72ee7b478a235f646c3495f03ebbe676?s=40
Wed Feb 20 09:58:29 2013
Here is a vim port:

https://github.com/airblade/vim-gitgutter
10178211a9aa9aa8c865bfe2d050f18b?s=40
AK
Sun Feb 3 17:36:49 2013
>>Almost a year ago I switched to using Sublime Text and soon wondered how I ever lived without it>>

I wish Steve Jobs had seen your post and I am sure Sublime Text would have cured his ailment. Sigh!!
Be110ccb289808429894c89202e4384b?s=40
Mon Feb 4 13:37:41 2013
Paweł Gościcki:

There is a similar plugin to Vim: https://github.com/tpope/vim-fugitive :-)
Ebc95603a264f87d8cd670d8976ef4f2?s=40
Thu Feb 7 16:02:03 2013
I know, I'm using it, but it does not provide 'gutter diff indicator' which is what this article was about.
4daf6f4daceb77bbd6cb266ea6281a5f?s=40
David
Fri Feb 8 18:27:44 2013
Thanks much!
C973b1e9f26631ffa48a92a69c3ef61b?s=40
Jeff
Mon Mar 4 06:08:30 2013
This is great, but is there a way to make it highlight the lines with changes/adds/removes in the mini map as well? Is this a limit of the Sublime Text API that makes that impossible?
Cebb8f230ae552b94c5b7967c342c1ce?s=40
Wed Mar 6 00:51:33 2013
I was going to point you to this issue: https://github.com/jisaacks/GitGutter/issues/55

but it looks like you are the submitter.
756080a0f67d680910f4975bdcf599f3?s=40
Thu Feb 7 16:17:33 2013
One word for this package.... it's super-frickin-awesome!
499bb271a94ea2d97424787abe249e4a?s=40
Marc Sardon
Thu Feb 7 16:27:08 2013
This is awesome. Thanks for your work.
F5536f491c1526366e24ec2a199ceef5?s=40
Alex McPherson
Thu Feb 7 17:11:22 2013
What are the token colors or theme colors for the indicators? My theme shows all 3 indicators as white, and I'd love to change them to the green/red you have: http://cl.ly/image/2b030a2b1g17
F5536f491c1526366e24ec2a199ceef5?s=40
Alex McPherson
Thu Feb 7 18:06:56 2013
Found it on the github readme... so go look there :-)
94dca75a7c077f37b3cc4765791234ed?s=40
Steve
Thu Feb 7 18:07:02 2013
Alex - Check the readme for instructions on how to set the colors: https://github.com/jisaacks/GitGutter#readme
630be6b38e4ebeae3414b685793e7e13?s=40
Kevin
Fri Feb 8 03:35:07 2013
This is really great! Thanks for sharing.

Has anyone provided graphics for retina displays? They're a bit blurry as is.

But still very handy! Thanks again.
918a2b8fc3fc83e383acf0866ae2e253?s=40
Cristina Vázquez
Tue Feb 12 16:04:07 2013
It's great! Thanks for sharing!
Dabef448fac48c6137ca1cfae1ffa156?s=40
Wed Feb 20 14:42:57 2013
Brilliant--thanks for sharing this! Simple, fast, and helpful.
1d4f38a7db84cbc8a2540cd8ee91d679?s=40
Tue Feb 19 18:21:54 2013
Can I assume this only works for files from git? Not just every file?
Cebb8f230ae552b94c5b7967c342c1ce?s=40
Wed Feb 20 01:51:58 2013
Chris, yes this plugin compares your changes since your last git commit.
13616b6551a3854378f9e6fea964e519?s=40
Wed Feb 27 17:17:06 2013
I love you man, this plugin is awesome!
Da31a28657acf1c969daccc86f5d611d?s=40
Wed Mar 6 14:26:44 2013
This is way too awesome, thanks a bunch for creating this plugin!

Leave A Comment