Git Visuals#
A tale of bubbles, arrows, post-its and stickers#
Or, an illustration of key concepts in a daily workflow.
This is a companion notebook with code to follow the visuals of this presentation, where it is illustrated a minimalistic git workflow. Even when small, this example complies many of the key elements you need to know in order to understand how git works.
Initialization#
%%bash
rm -rf git-visuals-tmp
mkdir -p git-visuals-tmp
cd git-visuals-tmp
git init
echo "first file" > file.md
git add file.md
git commit -m"a0: first commit"
echo
echo "Git Log:"
git slog2
Initialized empty Git repository in /Users/fperez/teach/stat159/2022sp/site/lectures/intro-git/git-visuals-tmp/.git/
[main (root-commit) cab4518] a0: first commit
1 file changed, 1 insertion(+)
create mode 100644 file.md
Git Log:
* cab4518 a0: first commit (0 seconds ago) (HEAD -> main) [Fernando Perez]
Next commit#
%%bash
cd git-visuals-tmp
echo "more work" >> file.md
git commit -am"b1: some new ideas"
echo
echo "Git Log:"
git slog2
[main 73d141a] b1: some new ideas
1 file changed, 1 insertion(+)
Git Log:
* 73d141a b1: some new ideas (0 seconds ago) (HEAD -> main) [Fernando Perez]
* cab4518 a0: first commit (1 second ago) [Fernando Perez]
Introducing tags#
%%bash
cd git-visuals-tmp
git tag -a ver0 -m"Release version 0"
echo
echo "Git Log:"
git slog2
Git Log:
* 73d141a b1: some new ideas (0 seconds ago) (HEAD -> main, tag: ver0) [Fernando Perez]
* cab4518 a0: first commit (1 second ago) [Fernando Perez]
New branches#
%%bash
cd git-visuals-tmp
git switch -c dev
echo
echo "Git Log:"
git slog2
Switched to a new branch 'dev'
Git Log:
* 73d141a b1: some new ideas (0 seconds ago) (HEAD -> dev, tag: ver0, main) [Fernando Perez]
* cab4518 a0: first commit (1 second ago) [Fernando Perez]
Parallel development in branches#
%%bash
cd git-visuals-tmp
echo "new development work " > file2.md
git add file2.md
git commit -am"c2: a new line of development!"
echo
echo "Git Log:"
git slog2
[dev 6e0ee08] c2: a new line of development!
1 file changed, 1 insertion(+)
create mode 100644 file2.md
Git Log:
* 6e0ee08 c2: a new line of development! (0 seconds ago) (HEAD -> dev) [Fernando Perez]
* 73d141a b1: some new ideas (0 seconds ago) (tag: ver0, main) [Fernando Perez]
* cab4518 a0: first commit (1 second ago) [Fernando Perez]
Back to the main branch#
%%bash
cd git-visuals-tmp
git switch main
echo
echo "Git Log:"
git slog2 --all
Switched to branch 'main'
Git Log:
* 6e0ee08 c2: a new line of development! (0 seconds ago) (dev) [Fernando Perez]
* 73d141a b1: some new ideas (0 seconds ago) (HEAD -> main, tag: ver0) [Fernando Perez]
* cab4518 a0: first commit (1 second ago) [Fernando Perez]
Progress on the main branch#
%%bash
cd git-visuals-tmp
echo "More work on main line" >> file.md
git commit -am"d3: ontinued main work"
echo
echo "Git Log:"
git slog2 --all
[main 5581513] d3: ontinued main work
1 file changed, 1 insertion(+)
Git Log:
* 6e0ee08 c2: a new line of development! (0 seconds ago) (dev) [Fernando Perez]
| * 5581513 d3: ontinued main work (0 seconds ago) (HEAD -> main) [Fernando Perez]
|/
* 73d141a b1: some new ideas (0 seconds ago) (tag: ver0) [Fernando Perez]
* cab4518 a0: first commit (1 second ago) [Fernando Perez]
Continued work on the main branch#
%%bash
cd git-visuals-tmp
echo "And yet more work on main line" >> file.md
git commit -am"e4: main work continues"
echo
echo "Git Log:"
git slog2 --all
[main 56cad78] e4: main work continues
1 file changed, 1 insertion(+)
Git Log:
* 6e0ee08 c2: a new line of development! (0 seconds ago) (dev) [Fernando Perez]
| * 56cad78 e4: main work continues (0 seconds ago) (HEAD -> main) [Fernando Perez]
| * 5581513 d3: ontinued main work (0 seconds ago) [Fernando Perez]
|/
* 73d141a b1: some new ideas (0 seconds ago) (tag: ver0) [Fernando Perez]
* cab4518 a0: first commit (1 second ago) [Fernando Perez]
Merging our two branches#
%%bash
cd git-visuals-tmp
git merge dev -m"f5: merging great new developments"
echo
echo "Git Log:"
git slog2
Merge made by the 'ort' strategy.
file2.md | 1 +
1 file changed, 1 insertion(+)
create mode 100644 file2.md
Git Log:
* 6ea0830 f5: merging great new developments (0 seconds ago) (HEAD -> main) [Fernando Perez]
|\
| * 6e0ee08 c2: a new line of development! (1 second ago) (dev) [Fernando Perez]
* | 56cad78 e4: main work continues (1 second ago) [Fernando Perez]
* | 5581513 d3: ontinued main work (1 second ago) [Fernando Perez]
|/
* 73d141a b1: some new ideas (1 second ago) (tag: ver0) [Fernando Perez]
* cab4518 a0: first commit (2 seconds ago) [Fernando Perez]
Cleanup after merge: delete dev branch#
%%bash
cd git-visuals-tmp
git branch --delete dev
echo
echo "Git Log:"
git slog2 --all
Deleted branch dev (was 6e0ee08).
Git Log:
* 6ea0830 f5: merging great new developments (0 seconds ago) (HEAD -> main) [Fernando Perez]
|\
| * 6e0ee08 c2: a new line of development! (1 second ago) [Fernando Perez]
* | 56cad78 e4: main work continues (1 second ago) [Fernando Perez]
* | 5581513 d3: ontinued main work (1 second ago) [Fernando Perez]
|/
* 73d141a b1: some new ideas (1 second ago) (tag: ver0) [Fernando Perez]
* cab4518 a0: first commit (2 seconds ago) [Fernando Perez]
More tags#
%%bash
cd git-visuals-tmp
git tag -a ver1 -m"Releasing version 1 to the world!"
echo
echo "Git Log:"
git slog2 --all
Git Log:
* 6ea0830 f5: merging great new developments (0 seconds ago) (HEAD -> main, tag: ver1) [Fernando Perez]
|\
| * 6e0ee08 c2: a new line of development! (1 second ago) [Fernando Perez]
* | 56cad78 e4: main work continues (1 second ago) [Fernando Perez]
* | 5581513 d3: ontinued main work (1 second ago) [Fernando Perez]
|/
* 73d141a b1: some new ideas (1 second ago) (tag: ver0) [Fernando Perez]
* cab4518 a0: first commit (2 seconds ago) [Fernando Perez]
And the git life continues…#
%%bash
cd git-visuals-tmp
echo "More and more work" >> file.md
git commit -am"a6: our work marches on..."
echo
echo "Git Log:"
git slog2 --all
[main f582848] a6: our work marches on...
1 file changed, 1 insertion(+)
Git Log:
* f582848 a6: our work marches on... (0 seconds ago) (HEAD -> main) [Fernando Perez]
* 6ea0830 f5: merging great new developments (1 second ago) (tag: ver1) [Fernando Perez]
|\
| * 6e0ee08 c2: a new line of development! (2 seconds ago) [Fernando Perez]
* | 56cad78 e4: main work continues (2 seconds ago) [Fernando Perez]
* | 5581513 d3: ontinued main work (2 seconds ago) [Fernando Perez]
|/
* 73d141a b1: some new ideas (2 seconds ago) (tag: ver0) [Fernando Perez]
* cab4518 a0: first commit (3 seconds ago) [Fernando Perez]
A note on the order of the log above: by default, the above is ordered by the topology of the commits, not by the time they were made. We can ask git to show us the same information but sorted by the timestamps of the commits, which will match the way our diagrams were drawn. This is done by using the --author-date-order flag to git log:
%%bash
cd git-visuals-tmp
echo
echo "Git Log:"
git slog2 --all --author-date-order
Git Log:
* f582848 a6: our work marches on... (1 second ago) (HEAD -> main) [Fernando Perez]
* 6ea0830 f5: merging great new developments (2 seconds ago) (tag: ver1) [Fernando Perez]
|\
* | 56cad78 e4: main work continues (3 seconds ago) [Fernando Perez]
| * 6e0ee08 c2: a new line of development! (3 seconds ago) [Fernando Perez]
* | 5581513 d3: ontinued main work (3 seconds ago) [Fernando Perez]
|/
* 73d141a b1: some new ideas (3 seconds ago) (tag: ver0) [Fernando Perez]
* cab4518 a0: first commit (4 seconds ago) [Fernando Perez]