Git Gud at git

Show of hands, everyone, who knows git?
Not just the standard git pull / git commit / git push arcanery that you go through to magically make your changes public, who actually understands git? Who here understands its internal tree model, the thing that makes it work so well?
If your hand is still up, you can feel free to skip this post, or pop over to the source and help implement more features. You may want to hold off for a little while before you contribute, though; I’m porting it from WASM to JavaScript.
If you don’t know how it works, though, can I recommend something I made? It’s called Git Gud.

What is it?

Git Gud is a web-based Git simulator. It shows you the git tree visually, and you can run commands to show you what they do to the tree. You start out with an initial commit:

You’ll notice it’s labeled “c0". That’s the commit ID. Because we don’t have any actual files to track — that’s for a much later version — we don’t have anything to hash, and on our initial build, we just ordered commits sequentially. The first, automatically generated commit is "c0", the second is "c1", and so on. Speaking of the second commit, click in the bottom area and try typing:

You’ll see another commit get added:

Just like in Git, you can checkout individual commits:
checkout c0

You can also make a new branch with branch, check it out with checkout b1, commit on it, merge it back in, etc. For example, enter this sequence of commands:
checkout c0
checkout b1
checkout b0

and you’ll get this:

If you want to reset, well, there’s no git command for that, but we’ve repurposed init:


If you look at the commit history for Git Gud, you’ll notice a massive spike in development over the course of a weekend. That weekend was BrickHack, RIT’s annual hackathon. It was an interesting experience, and a great way to get a prototype up and running.
It did introduce some issues, though. The code isn’t too great, since we didn’t have a chance to really think through issues in just 24 hours. We wrote it in WebAssembly rather than the pure JavaScript that would have been less effort to develop and debug, because one of the team members only knew C++ and wasn’t sure he could learn JavaScript in the few days well enough in the few days before the hackathon1.
1: As it turns out, he was able to learn it in an hour or so during the hackathon, at least well enough to edit some drawing code. Oops. Probably could have done that better, then.

Next steps

Right now, Git Gud pretty barebones, as you’ll definitely notice if you try it. There are quite a few features we want to implement, most of which boil down to working more like the real git. For example:

If you type git at the beginning of the line (say, out of habit from using real git), delete it from the input rather than breaking
Informative (aka any, in some cases) error messages when you do something wrong
Commit messages
Branches with names
Parsing flags like -b on checkout

File changes, rather than just abstract ‘commits’
More themes. Amber on black is pretty, but it’d be nice (and not too hard, really) to offer multiple colors.

Got any other ideas? Anything you want me to know as I develop it more? Either raise an issue, or comment on this post.