Commit 7030ba99 authored by Mihai Lefter's avatar Mihai Lefter
Browse files

Commit graph presentation draft

parent 50b79cf6
\documentclass[slidestop]{beamer}
\usepackage{framed}
\input{../shared/shared.tex}
\author{Mihai Lefter}
\title{\courseTitle}
\providecommand{\mySubTitle}{The commit graph}
\providecommand{\myConference}{\courseTitle}
\providecommand{\myGroup}{}
\providecommand{\myDepartment}{Department of Human Genetics}
\providecommand{\myCenter}{Center for Human and Clinical Genetics}
\definecolor{cblack}{rgb}{0,0,0}
\definecolor{cwhite}{rgb}{1,1,1}
\definecolor{command-color}{rgb}{0,0.5,0}
\definecolor{git-color}{rgb}{0.94,0.23,0.18}
\definecolor{option-color}{rgb}{0.9,0.2,0.11}
\definecolor{argument-color}{rgb}{0.11,0.27,0.7}
\definecolor{pattern-color}{rgb}{0,0.5,0.5}
\definecolor{wildcard-color}{rgb}{0.75,0.3,0}
\definecolor{cli-text}{rgb}{0.15,0.15,0.15}
\definecolor{important-note}{rgb}{0.69,0.13,0.13}
\definecolor{redirection}{rgb}{0.99,0.13,0.13}
\definecolor{shadecolor}{rgb}{0.9,0.9,0.9}
\definecolor{one-dot}{rgb}{0.9,0.2,0.0}
\definecolor{two-dots}{rgb}{0.11,0.11,0.8}
\definecolor{slash}{rgb}{0.3,0.3,0.3}
\definecolor{head}{HTML}{B22222}
\definecolor{branch}{HTML}{20b2aa}
\definecolor{commit-id}{HTML}{b8860b}
\usetheme{lumc}
\lstset{ %
basicstyle=\ttfamily,
language=none,
frame=none,
numbers=none,
numbersep=0,
keepspaces=true,
stringstyle=\color{cli-text},
keywordstyle=\color{cli-text},
commentstyle=\color{cli-text}
}
\AtBeginSection[]
{
\begin{frame}
\frametitle{Table of contents}
\tableofcontents[currentsection, subsectionstyle=hide/hide]
\end{frame}
}
\begin{document}
% This disables the \pause command, handy in the editing phase.
%\renewcommand{\pause}{}
% Make the title page.
\makeTitleSlide{\includegraphics[width=3.5cm]{../shared/git_logo.pdf}}
\section{The Git commit graph}
\subsection{A linear history}
\begin{pframe}
\begin{center}
\includegraphics[width=\textwidth]{images/commit_graph/commit_graph_00.pdf}
\end{center}
\end{pframe}
\begin{pframe}
\begin{center}
\includegraphics[width=\textwidth]{images/commit_graph/commit_graph_01.pdf}
\end{center}
\end{pframe}
\subsection{The default \lstinline{master} branch}
\begin{pframe}
\begin{center}
\includegraphics[width=\textwidth]{images/commit_graph/commit_graph_02.pdf}
\end{center}
\end{pframe}
\subsection{The \lstinline{HEAD} pointer}
\begin{pframe}
\begin{center}
\includegraphics[width=\textwidth]{images/commit_graph/commit_graph_03.pdf}
\end{center}
\end{pframe}
\subsection{Committing}
\begin{pframe}
\begin{center}
\includegraphics[width=\textwidth]{images/commit_graph/commit_graph_04.pdf}
\end{center}
\end{pframe}
\begin{pframe}
\begin{center}
\includegraphics[width=\textwidth]{images/commit_graph/commit_graph_05.pdf}
\end{center}
\end{pframe}
\subsection{A non-linear history}
\begin{pframe}
\begin{center}
\includegraphics[width=\textwidth]{images/commit_graph/commit_graph_06.pdf}
\end{center}
\end{pframe}
\subsection{Use branches to keep track of different code paths}
\begin{pframe}
\begin{center}
\includegraphics[width=\textwidth]{images/commit_graph/commit_graph_07.pdf}
\end{center}
\end{pframe}
\subsection{Merging}
\begin{pframe}
\begin{center}
\includegraphics[width=\textwidth]{images/commit_graph/commit_graph_08.pdf}
\end{center}
\end{pframe}
\section{Inspecting the commit graph}
\subsection{An example repository}
\begin{pframe}
\begin{center}
\includegraphics[width=\textwidth]{images/inspect_commit_graph/inspect_commit_graph_00.pdf}
\end{center}
\end{pframe}
\subsection{Showing the current branch}
\begin{pframe}
\begin{framed}
\lstinline{$} \textcolor{git-color}{\lstinline{git}} \textcolor{command-color}{\lstinline{status}}\\
\lstinline{On branch master}\\
\lstinline{nothing to commit, working directory clean.}
\end{framed}
Remember: you cannot type \textcolor{git-color}{\lstinline{git}} \textcolor{command-color}{\lstinline{status}} enough!
\end{pframe}
\subsection{Listing branches}
\begin{pframe}
\begin{framed}
\lstinline{$} \textcolor{git-color}{\lstinline{git}} \textcolor{command-color}{\lstinline{branch}}\\
\lstinline{ interface}\\
\lstinline{ license}\\
\lstinline{* master}
\end{framed}
\vspace{-0.3cm}
Three branches, current branch is \lstinline{master}.
\pause
\vspace{-0.3cm}
\begin{framed}
\lstinline{$} \textcolor{git-color}{\lstinline{git}} \textcolor{command-color}{\lstinline{branch}} \textcolor{argument-color}{\lstinline{-v}}\\
\lstinline{ interface 8fc25c1 Trivial Python interface}\\
\lstinline{ license 0fbe3e3 Add MIT license}\\
\lstinline{* master c7f3bd9 Add .gitignore file}
\end{framed}
\vspace{-0.3cm}
\textcolor{argument-color}{\lstinline{-v}}: Shows the commit each branch points to.
\end{pframe}
\subsection{The commit log}
\begin{pframe}
\begin{framed}
\lstinline{$} \textcolor{git-color}{\lstinline{git}} \textcolor{command-color}{\lstinline{log}}
\textcolor{argument-color}{\lstinline{--oneline --decorate}}\\
\textcolor{commit-id}{\lstinline{c7f3bd9}} \lstinline{(}\textcolor{head}{\lstinline{HEAD}} \lstinline{->} \textcolor{branch}{\lstinline{master}}\lstinline{) Add .gitignore file}\\
\textcolor{commit-id}{\lstinline{4a44c4e}} \lstinline{Merge branch 'license'}\\
\textcolor{commit-id}{\lstinline{64af1ee}} \lstinline{Add course teachers to README}\\
\textcolor{commit-id}{\lstinline{0fbe3e3}} \lstinline{(}\textcolor{branch}{\lstinline{license}}\lstinline{) Add MIT license}\\
\textcolor{commit-id}{\lstinline{d1c7fd7}} \lstinline{Initial commit with README}
\end{framed}
\textcolor{argument-color}{\lstinline{--oneline}}: Shows commit summary on one line.
\textcolor{argument-color}{\lstinline{--decorate}}: Adds branch information.
\end{pframe}
\subsection{The commit log as a graph}
\begin{pframe}
\begin{framed}
\lstinline{$} \textcolor{git-color}{\lstinline{git}} \textcolor{command-color}{\lstinline{log}}
\textcolor{argument-color}{\lstinline{--oneline --decorate --graph --all}}\\
\lstinline{*} \textcolor{commit-id}{\lstinline{8fc25c1}} \lstinline{(}\textcolor{branch}{\lstinline{interface}}\lstinline{) Trivial Python interface}\\
\lstinline{| *} \textcolor{commit-id}{\lstinline{c7f3bd9}} \lstinline{(}\textcolor{head}{\lstinline{HEAD}} \lstinline{->} \textcolor{branch}{\lstinline{master)}} \lstinline{Add .gitignore file}\\
\lstinline{|/}\\
\lstinline{*} \textcolor{commit-id}{\lstinline{4a44c4e}} \lstinline{Merge branch 'license'}\\
\lstinline{|\\}\\
\lstinline{| *} \textcolor{commit-id}{\lstinline{0fbe3e3}} \lstinline{(}\textcolor{branch}{\lstinline{license}}\lstinline{) Add MIT license}\\
\lstinline{* |} \textcolor{commit-id}{\lstinline{64af1ee}} \lstinline{Add course teachers to README}\\
\lstinline{|/}\\
\lstinline{*} \textcolor{commit-id}{\lstinline{d1c7fd7}} \lstinline{Initial commit with README}
\end{framed}
\vspace{-0.2cm}
\textcolor{argument-color}{\lstinline{--graph}}: Shows the commit graph.
\textcolor{argument-color}{\lstinline{--all}}: Includes all branches instead of just the current one.
\end{pframe}
\section{Navigating the commit graph}
\subsection{Switching to another branch}
\begin{pframe}
\begin{framed}
\lstinline{$} \textcolor{git-color}{\lstinline{git}} \textcolor{command-color}{\lstinline{checkout}} \textcolor{argument-color}{\lstinline{interface}}\\
\lstinline{Switched to branch 'interface'}
\end{framed}
\vspace{-0.2cm}
\begin{itemize}
\item Points \lstinline{HEAD} to the named branch.
\item Updates your working directory.
\end{itemize}
\pause
\begin{framed}
\lstinline{$} \textcolor{git-color}{\lstinline{git}} \textcolor{command-color}{\lstinline{status}}\\
\lstinline{On branch interface}\\
\lstinline{nothing to commit, working directory clean.}
\end{framed}
\end{pframe}
\begin{pframe}
\begin{center}
\includegraphics[width=\textwidth]{images/graph_navigation/graph_navigation_00.pdf}
\end{center}
\end{pframe}
\begin{pframe}
\begin{center}
\includegraphics[width=\textwidth]{images/graph_navigation/graph_navigation_01.pdf}
\end{center}
\end{pframe}
\subsection{Detached \lstinline{HEAD} state}
\begin{pframe}
\begin{framed}
\lstinline{$} \textcolor{git-color}{\lstinline{git}} \textcolor{command-color}{\lstinline{checkout}} \textcolor{argument-color}{\lstinline{4a44c4e}}\\
\lstinline{Note: checking out '4a44c4e'.}\\ \\
\lstinline{You are in 'detached HEAD' state. You can look ...}\\ \\
% \lstinline{around, make experimental changes and commit them,}\\
% \lstinline{and you can discard any commits you make in this}\\
% \lstinline{state without impacting any branches by performing}\\
% \lstinline{another checkout.}\\ \\
\lstinline{If you want to create a new branch to retain}\\
\lstinline{commits you create, you may do so (now or later) by}\\
\lstinline{using -b with the checkout command again. Example:}\\ \\
\lstinline{ git checkout -b <new-branch-name>}\\ \\
\lstinline{HEAD is now at 4a44c4e... Merge Branch 'license'}
\end{framed}
\end{pframe}
\begin{pframe}
\begin{framed}
\lstinline{$} \textcolor{git-color}{\lstinline{git}} \textcolor{command-color}{\lstinline{status}}\\
\textcolor{red}{\lstinline{HEAD detached at}} \lstinline{4a44c4e}\\
\lstinline{nothing to commit, working directory clean.}
\end{framed}
\end{pframe}
\begin{pframe}
\begin{center}
\includegraphics[width=\textwidth]{images/graph_navigation/graph_navigation_02.pdf}
\end{center}
\end{pframe}
\begin{pframe}
\begin{center}
\includegraphics[width=\textwidth]{images/graph_navigation/graph_navigation_03.pdf}
\end{center}
\end{pframe}
\begin{pframe}
\begin{center}
\includegraphics[width=\textwidth]{images/graph_navigation/graph_navigation_04.pdf}
\end{center}
\end{pframe}
\section{Manipulating the commit graph}
\subsection{Creating a new branch}
\begin{pframe}
\begin{framed}
\lstinline{$} \textcolor{git-color}{\lstinline{git}} \textcolor{command-color}{\lstinline{branch}} \textcolor{argument-color}{\lstinline{lib}}
\end{framed}
\vspace{-0.2cm}
Creates branch \textcolor{argument-color}{\lstinline{lib}} at \lstinline{HEAD}.
\pause
\medskip
How can I see the branches list?
\pause
\vspace{-0.3cm}
\begin{framed}
\lstinline{$} \textcolor{git-color}{\lstinline{git}} \textcolor{command-color}{\lstinline{branch}}\\
\lstinline{ interface}\\
\lstinline{ lib}\\
\lstinline{ license}\\
\lstinline{* master}
\end{framed}
\vspace{-0.2cm}
\pause
How can I switch to the new \textcolor{argument-color}{\lstinline{lib}} branch?
\end{pframe}
\begin{pframe}
\begin{framed}
\lstinline{$} \textcolor{git-color}{\lstinline{git}} \textcolor{command-color}{\lstinline{checkout}} \textcolor{argument-color}{\lstinline{lib}}\\
\lstinline{Switched to branch 'lib'}
\end{framed}
\pause
\end{pframe}
\begin{pframe}
For Git pro's, in one command:
\begin{framed}
\lstinline{$} \textcolor{git-color}{\lstinline{git}} \textcolor{command-color}{\lstinline{checkout -b}}
\textcolor{argument-color}{\lstinline{lib}} \\
\lstinline{Switched to a new branch 'lib'}
\end{framed}
At this point, \textcolor{argument-color}{\lstinline{lib}} is just a label to the same commit as
\lstinline{master}.
\end{pframe}
\begin{pframe}
\begin{center}
\includegraphics[width=\textwidth]{images/branching/branching_00.pdf}
\end{center}
\end{pframe}
\subsection{Working on a branch}
\begin{pframe}
We can extend the \lstinline{lib} branch by adding commits.
\vspace{-0.4cm}
\begin{framed}
\lstinline{$} \lstinline{echo 'VERSION=1' > testlib.py}\\
\lstinline{$} \textcolor{git-color}{\lstinline{git}} \textcolor{command-color}{\lstinline{add}}
\textcolor{argument-color}{\lstinline{testlib.py}} \\
\lstinline{$} \textcolor{git-color}{\lstinline{git}} \textcolor{command-color}{\lstinline{commit -m}}
\textcolor{argument-color}{\lstinline{'Add empty testlib'}}
\end{framed}
\pause
\vspace{-0.5cm}
\begin{framed}
\lstinline{$} \textcolor{git-color}{\lstinline{git}} \textcolor{command-color}{\lstinline{log}}
\textcolor{argument-color}{\lstinline{--oneline --decorate --graph --all}}\\
\lstinline{*} \textcolor{commit-id}{\lstinline{251a51b}} \lstinline{(}\textcolor{head}{\lstinline{HEAD}} \lstinline{->} \textcolor{branch}{\lstinline{lib}}\lstinline{) Add empty testlib}\\
\lstinline{*} \textcolor{commit-id}{\lstinline{c7f3bd9}} \lstinline{(}\textcolor{branch}{\lstinline{master}} \lstinline{) Add .gitignore file}\\
\lstinline{| *} \textcolor{commit-id}{\lstinline{8fc25c1}} \lstinline{(}\textcolor{branch}{\lstinline{interface}}\lstinline{) Trivial Python interface}\\
\lstinline{|/}\\
\lstinline{*} \textcolor{commit-id}{\lstinline{4a44c4e}} \lstinline{Merge branch 'license'}\\
\lstinline{...}
% \lstinline{|\\}\\
% \lstinline{| *} \textcolor{commit-id}{\lstinline{0fbe3e3}} \lstinline{(}\textcolor{branch}{\lstinline{license}}\lstinline{) Add MIT license}\\
% \lstinline{* |} \textcolor{commit-id}{\lstinline{64af1ee}} \lstinline{Add course teachers to README}\\
% \lstinline{|/}\\
% \lstinline{*} \textcolor{commit-id}{\lstinline{d1c7fd7}} \lstinline{Initial commit with README}
\end{framed}
\end{pframe}
\subsection{Extended \lstinline{lib} branch}
\begin{pframe}
\begin{center}
\includegraphics[width=\textwidth]{images/branching/branching_01.pdf}
\end{center}
\end{pframe}
\subsection{Fast forward merging}
\begin{pframe}
Let's merge our work on \lstinline{lib} back into \lstinline{master}.
\begin{framed}
\lstinline{$} \textcolor{git-color}{\lstinline{git}} \textcolor{command-color}{\lstinline{checkout}}
\textcolor{argument-color}{\lstinline{master}} \\
\lstinline{Switched to branch 'master'}\\
\lstinline{$} \textcolor{git-color}{\lstinline{git}} \textcolor{command-color}{\lstinline{merge}}
\textcolor{argument-color}{\lstinline{lib}}\\
\lstinline{Updating c7f3bd9..251a51b}\\
\lstinline{Fast-forward}\\
\lstinline{ testlib.py | 1 +}\\
\lstinline{ 1 file changed, 1 insertion(+)}\\
\lstinline{ create mode 100644 testlib.py}
\end{framed}
\end{pframe}
\subsection{Merged branch \lstinline{lib} into \lstinline{master} (fast forward).}
\begin{pframe}
\begin{center}
\includegraphics[width=\textwidth]{images/branching/branching_02.pdf}
\end{center}
\end{pframe}
\subsection{Three-way merging}
\begin{pframe}
Let's merge our work on \lstinline{interface} back into \lstinline{master}.
\begin{framed}
\lstinline{$} \textcolor{git-color}{\lstinline{git}} \textcolor{command-color}{\lstinline{merge}}
\textcolor{argument-color}{\lstinline{interface}}\\
\lstinline{Merge made by the 'recursive' strategy.}\\
\lstinline{ interface.py | 3 +++}\\
\lstinline{ 1 file changed, 3 insertions(+)}\\
\lstinline{ create mode 100755 interface.py}
\end{framed}
\vspace{-0.2cm}
This merge was harder:
\begin{itemize}
\item \lstinline{interface} and \lstinline{master} had diverged.
\item Git determines changes in \lstinline{interface} and
\lstinline{master} since their most recent common ancestor.
\item A new commit is created.
\end{itemize}
\end{pframe}
\subsection{Merged branch \lstinline{interface} into \lstinline{master}}
\begin{pframe}
\begin{center}
\includegraphics[width=\textwidth]{images/branching/branching_03.pdf}
\end{center}
\end{pframe}
\begin{pframe}
\begin{center}
\includegraphics[width=\textwidth]{images/branching/branching_04.pdf}
\end{center}
\end{pframe}
\subsection{Deleting branches}
\begin{pframe}
Old branches that have been merged can be deleted.
\begin{framed}
\lstinline{$} \textcolor{git-color}{\lstinline{git}} \textcolor{command-color}{\lstinline{branch -d}}
\textcolor{argument-color}{\lstinline{interface}}\\
\lstinline{Deleted branch interface (was 8fc25c1).}
\end{framed}
\begin{framed}
\lstinline{$} \textcolor{git-color}{\lstinline{git}} \textcolor{command-color}{\lstinline{branch -d}}
\textcolor{argument-color}{\lstinline{lib license}}\\
\lstinline{Deleted branch lib (was 251a51b).}\\
\lstinline{Deleted branch license (was 0fbe3e3).}
\end{framed}
No history is lost, just labels removed.
\end{pframe}
\begin{pframe}
\begin{center}
\includegraphics[width=\textwidth]{images/branching/branching_05.pdf}
\end{center}
\end{pframe}
\section{Basic merge conflicts}
\subsection{Merge conflicts}
\begin{pframe}
Git is pretty good at merging:
\begin{itemize}
\item The changes might have been in different files.
\item Or in different parts of the same file.
\item Git tries to figure out a sensible result.
\end{itemize}
\bigskip
\pause
Sometimes this is not possible:
\begin{itemize}
\item The changes might be incompatible.
\item When we try \lstinline{git merge}, Git gives up.
\item This situation is called a {\em merge conflict}.
\end{itemize}
\end{pframe}
\subsection{Setting the stage (1/3)}
\begin{pframe}
\begin{framed}
\textcolor{cli-text}{
\lstinline{$} \textcolor{git-color}{\lstinline{git}} \textcolor{command-color}{\lstinline{log}}
\textcolor{argument-color}{\lstinline{--oneline --decorate --graph --all}}\\
\lstinline{* 5edaf08 (hue) State character ...}\\
\lstinline{| * f1ef19c (HEAD, master) State character ...}\\
\lstinline{|/}\\
\lstinline{* 1f6d2ab Initial commit}
}
\end{framed}
We'd like to merge branch \lstinline{hue} into \lstinline{master}.
\end{pframe}
\subsection{Setting the stage (2/3)}
\begin{pframe}
The last commit on \lstinline{master}:
\vspace{-0.3cm}
\begin{framed}
\lstinline{$} \textcolor{git-color}{\lstinline{git}} \textcolor{command-color}{\lstinline{show}}\\
\lstinline{f1ef19c State character preference}\\
\lstinline{diff --git a/FACTS.md b/FACTS.md}\\
\lstinline{index de15194..ef40359 100644}\\
\lstinline{--- a/FACTS.md}\\
\lstinline{+++ b/FACTS.md}\\
\lstinline{@@ -1,2 +1,4 @@}\\
\lstinline{ Facts about television series}\\
\lstinline{ =============================}\\
\lstinline{+}\\
\lstinline{+My favorite character is Eric Cartman.}
\end{framed}
\end{pframe}
\subsection{Setting the stage (3/3)}
\begin{pframe}
The last commit on \lstinline{hue}:
\vspace{-0.3cm}
\begin{framed}
\lstinline{$} \textcolor{git-color}{\lstinline{git}} \textcolor{command-color}{\lstinline{show}}
\textcolor{argument-color}{\lstinline{--oneline}} \textcolor{argument-color}{\lstinline{hue}}\\
\lstinline{5edaf08 State character preference}\\
\lstinline{diff --git a/FACTS.md b/FACTS.md}\\
\lstinline{index de15194..5e69508 100644}\\
\lstinline{--- a/FACTS.md}\\
\lstinline{+++ b/FACTS.md}\\
\lstinline{@@ -1,2 +1,4 @@}\\
\lstinline{ Facts about television series}\\
\lstinline{ =============================}\\
\lstinline{+}\\
\lstinline{+My favorite character is Milhouse.}
\end{framed}
\end{pframe}
\subsection{Creating a merge conflict}
\begin{pframe}
\vspace{-0.5cm}
\begin{framed}
\lstinline{$} \textcolor{git-color}{\lstinline{git}} \textcolor{command-color}{\lstinline{merge}}
\textcolor{argument-color}{\lstinline{hue}}\\
\lstinline{Auto-merging FACTS.md}\\
\lstinline{CONFLICT (content): Merge conflict in FACTS.md}\\
\lstinline{Automatic merge failed; fix conflicts and then}\\
\lstinline{commit the result.}\\
\lstinline{$} \textcolor{git-color}{\lstinline{git}} \textcolor{command-color}{\lstinline{status}}\\
\lstinline{# On branch master}\\
\lstinline{# Unmerged paths:}\\
\lstinline{# (use "git add/rm <file>.." as appropriate)}\\
\lstinline{# to mark resolution)}\\
\lstinline{# both modified: FACTS.md}\\
\lstinline{# no changes added to commit (use "git add" and/or}\\
\lstinline{# "git commit -a")}
\end{framed}
\end{pframe}
\subsection{Resolving a merge conflict (1/3)}
\begin{pframe}
\begin{framed}
\textcolor{cli-text}{
\lstinline{$} \textcolor{command-color}{\lstinline{cat}} \textcolor{argument-color}{\lstinline{FACTS.md}}\\
\lstinline{Facts about television series}\\
\lstinline{=============================}\\
\textcolor{white}{\lstinline{S}}\\
\lstinline{<<<<<<< HEAD}\\
\lstinline{My favorite character is Eric Cartman.}\\
\lstinline{=======}\\
\lstinline{My favorite character is Milhouse.}\\
\lstinline{>>>>>>> hue}
}
\end{framed}
What we had is under \lstinline{HEAD}, what \lstinline{hue} had is
above \lstinline{hue}.
\end{pframe}
\subsection{Resolving a merge conflict (2/3)}
\begin{pframe}
We resolve the conflict by hand.
\begin{framed}
\textcolor{cli-text}{
\lstinline{$} \textcolor{command-color}{\lstinline{nano}} \textcolor{argument-color}{\lstinline{FACTS.md}} \\
\lstinline{$} \textcolor{command-color}{\lstinline{cat}} \textcolor{argument-color}{\lstinline{FACTS.md}} \\
\lstinline{Facts about television series}\\
\lstinline{=============================}\\
\textcolor{white}{\lstinline{S}}\\
\lstinline{My favorite characters are Eric Cartman}\\
\lstinline{and Milhouse.}
}
\end{framed}
\end{pframe}
\subsection{Resolving a merge conflict (3/3)}