feat: ✨ Finish presentation

frame/frame1.tex

@@ -0,0 +1,33 @@
+\begin{frame}
+    \section{Introduction}
+    \frametitle{What you all do when working alone}
+    \begin{tikzpicture}[
+  commit/.style={circle, draw, fill=orange!80, minimum size=8mm, font=\footnotesize\bfseries},
+  branch/.style={rounded corners, fill=gray!20, draw=gray, font=\small\ttfamily, inner sep=4pt},
+  head/.style={rounded corners, fill=cyan!20, draw=cyan!60, font=\small\ttfamily, inner sep=4pt},
+  arrow/.style={-{Stealth[length=3mm]}, thick, gray},
+  node distance=1.8cm
+]
+     % Commits
+  \node[commit] (c1) {C1};
+  \node[commit, right=of c1] (c2) {C2};
+  \node[commit, right=of c2] (c3) {C3};
+  \node[commit, right=of c3] (c4) {C4};
+  \node[commit, right=of c4] (c5) {C5};
+
+  % Arrows between commits
+  \draw[arrow] (c1) -- (c2);
+  \draw[arrow] (c2) -- (c3);
+  \draw[arrow] (c3) -- (c4);
+  \draw[arrow] (c4) -- (c5);
+
+  % Label master
+  \node[branch, above=0.6cm of c5] (master) {master};
+  \draw[-{Stealth}, thick] (master) -- (c5);
+
+  % Label HEAD
+  \node[head, above=0.4cm of master] (head) {HEAD};
+  \draw[-{Stealth}, thick] (head) -- (master);
+  \end{tikzpicture}
+
+\end{frame}

frame/frame2.tex

@@ -0,0 +1,62 @@
+\begin{frame}
+    \frametitle{What happens when working in a group}
+    \begin{tikzpicture}[
+  commit/.style={circle, draw, fill=orange!80, minimum size=6mm, font=\tiny\bfseries},
+  conflict/.style={circle, draw, fill=red!70, minimum size=6mm, font=\tiny\bfseries},
+  branch/.style={rounded corners, fill=gray!20, draw=gray, font=\tiny\ttfamily, inner sep=3pt},
+  head/.style={rounded corners, fill=cyan!20, draw=cyan!60, font=\tiny\ttfamily, inner sep=3pt},
+  label/.style={font=\small\bfseries, text=gray!70},
+  arrow/.style={-{Stealth[length=2mm]}, thick, gray},
+  node distance=1.2cm
+]
+
+  % === PC 1 (Alice) ===
+  \node[label] at (-1.8, 0) {Alice};
+  \node[commit] (a1) at (0,0) {C1};
+  \node[commit, right=of a1] (a2) {C2};
+  \node[commit, right=of a2] (a3) {C3};
+  \node[commit, right=of a3] (a4) {C4};
+  \node[commit, right=of a4] (a5) {C5};
+  \draw[arrow] (a1) -- (a2);
+  \draw[arrow] (a2) -- (a3);
+  \draw[arrow] (a3) -- (a4);
+  \draw[arrow] (a4) -- (a5);
+  \node[branch, above=0.4cm of a5] (m1) {master};
+  \draw[-{Stealth}, thin] (m1) -- (a5);
+
+  % === PC 2 (Bob) - conflit ===
+  \node[label] at (-1.8, -2.2) {Bob};
+  \node[commit] (b1) at (0,-2.2) {C1};
+  \node[commit, right=of b1] (b2) {C2};
+  \node[commit, right=of b2] (b3) {C3};
+  \node[commit, right=of b3] (b6) {C6};
+  \node[conflict, right=of b6] (bx) {!!};
+  \draw[arrow] (b1) -- (b2);
+  \draw[arrow] (b2) -- (b3);
+  \draw[arrow] (b3) -- (b6);
+  \draw[arrow, red!70] (b6) -- (bx);
+  \node[branch, above=0.4cm of b6] (m2) {master};
+  \draw[-{Stealth}, thin] (m2) -- (b6);
+  \node[font=\tiny\color{red!70}, right=0.3cm of bx] {CONFLICT on push!};
+
+  % === PC 3 (Charlie) - conflit ===
+  \node[label] at (-1.8, -4.4) {Charlie};
+  \node[commit] (d1) at (0,-4.4) {C1};
+  \node[commit, right=of d1] (d2) {C2};
+  \node[commit, right=of d2] (d7) {C7};
+  \node[commit, right=of d7] (d8) {C8};
+  \node[conflict, right=of d8] (dx) {!!};
+  \draw[arrow] (d1) -- (d2);
+  \draw[arrow] (d2) -- (d7);
+  \draw[arrow] (d7) -- (d8);
+  \draw[arrow, red!70] (d8) -- (dx);
+  \node[branch, above=0.4cm of d8] (m3) {master};
+  \draw[-{Stealth}, thin] (m3) -- (d8);
+  \node[font=\tiny\color{red!70}, right=0.3cm of dx] {CONFLICT on push!};
+
+  % Dashed lines to show the remote link
+  \draw[dashed, gray!40, thick] (a3.south) -- (b3.north);
+  \draw[dashed, gray!40, thick] (a2.south) -- (d2.north);
+
+\end{tikzpicture}
+\end{frame}

frame/frame3.tex

@@ -0,0 +1,69 @@
+\begin{frame}
+    \frametitle{And the miracle happens}
+    \framesubtitle{Branches}
+    \section{Branches}
+
+    \begin{center}
+        \includegraphics[width=0.5\textwidth]{assets/branches.jpg}
+    \end{center}
+
+\end{frame}
+
+\begin{frame}
+    \frametitle{And the miracle happens}
+    \framesubtitle{What does it look like in practice?}
+
+        \begin{tikzpicture}[
+  commit/.style={circle, draw, fill=orange!80, minimum size=6mm, font=\tiny\bfseries},
+  commitA/.style={circle, draw, fill=teal!60, minimum size=6mm, font=\tiny\bfseries},
+  commitB/.style={circle, draw, fill=violet!60, minimum size=6mm, font=\tiny\bfseries},
+  branch/.style={rounded corners, fill=gray!20, draw=gray, font=\tiny\ttfamily, inner sep=3pt},
+  branchA/.style={rounded corners, fill=teal!15, draw=teal, font=\tiny\ttfamily, inner sep=3pt},
+  branchB/.style={rounded corners, fill=violet!15, draw=violet, font=\tiny\ttfamily, inner sep=3pt},
+  merge/.style={circle, draw, fill=orange!80, minimum size=6mm, font=\tiny\bfseries},
+  arrow/.style={-{Stealth[length=2mm]}, thick, gray},
+  arrowA/.style={-{Stealth[length=2mm]}, thick, teal!70},
+  arrowB/.style={-{Stealth[length=2mm]}, thick, violet!70},
+  label/.style={font=\small\bfseries, text=gray!70},
+  node distance=1.5cm
+]
+
+  % === Master branch ===
+  \node[commit] (c1) {C1};
+  \node[commit, right=of c1] (c2) {C2};
+  \node[merge, right=3.5cm of c2] (c5) {C5};
+  \node[merge, right=3.5cm of c5] (c8) {C8};
+
+  \draw[arrow] (c1) -- (c2);
+  \draw[arrow] (c2) -- (c5);
+  \draw[arrow] (c5) -- (c8);
+
+  \node[branch, above=0.4cm of c8] (master) {master};
+  \draw[-{Stealth}, thin] (master) -- (c8);
+
+  % === Alice's branch (upward) ===
+  \node[commitA, above right=0.8cm and 1cm of c2] (a1) {C3};
+  \node[commitA, right=of a1] (a2) {C4};
+
+  \draw[arrowA] (c2) -- (a1);
+  \draw[arrowA] (a1) -- (a2);
+  \draw[arrowA] (a2) -- (c5);
+
+  \node[branchA, above=0.4cm of a2] (ba) {alice-branch};
+  \draw[-{Stealth}, thin, teal] (ba) -- (a2);
+  \node[label, text=teal!70] at (-1.5, 0.8) {Alice};
+
+  % === Bob's branch (downward) ===
+  \node[commitB, below right=0.8cm and 1cm of c5] (b1) {C6};
+  \node[commitB, right=of b1] (b2) {C7};
+
+  \draw[arrowB] (c5) -- (b1);
+  \draw[arrowB] (b1) -- (b2);
+  \draw[arrowB] (b2) -- (c8);
+
+  \node[branchB, below=0.4cm of b2] (bb) {bob-branch};
+  \draw[-{Stealth}, thin, violet] (bb) -- (b2);
+  \node[label, text=violet!70] at (-1.5, -0.8) {Bob};
+
+\end{tikzpicture}
+\end{frame}

frame/frame4.tex

@@ -0,0 +1,9 @@
+\begin{frame}
+    \frametitle{How do we name them?}
+    \framesubtitle{Naming convention}
+    \begin{itemize}
+        \item<1-> master: the main branch, containing production code
+        \item<3-> feature/xxx: feature branches, containing new features under development
+        \item<4-> fix/xxx: bugfix branches, containing bug fixes under development
+    \end{itemize}
+\end{frame}

frame/frame5.tex

@@ -0,0 +1,45 @@
+\begin{frame}
+    \frametitle{And how do we orchestrate all this?}
+    \framesubtitle{The workflow}
+      \begin{itemize}
+    \item<1-> Create a branch
+    \item<2-> Develop and commit
+    \item<3-> Push to the remote
+    \item<4-> Open a Pull Request
+    \item<5-> Team review
+    \item<6-> Fix if needed
+    \item<7-> Merge into main
+  \end{itemize}
+
+
+        \begin{tikzpicture}[
+  step/.style={rectangle, rounded corners=4pt, draw=gray!50, fill=gray!10, minimum width=2.2cm, minimum height=0.9cm, font=\scriptsize, align=center, text=gray!80},
+  active/.style={rectangle, rounded corners=4pt, draw=orange!70, fill=orange!15, minimum width=2.2cm, minimum height=0.9cm, font=\scriptsize\bfseries, align=center, text=orange!90},
+  arrow/.style={-{Stealth[length=2mm]}, thick, gray!50},
+  node distance=0.6cm
+]
+
+  % === Mini git diagram below ===
+  \node[font=\scriptsize\bfseries, text=gray!60] at (0, -3.2) {Example:};
+
+  \node[circle, draw, fill=orange!80, minimum size=5mm, font=\tiny\bfseries] (c1) at (1.5, -3.2) {C1};
+  \node[circle, draw, fill=orange!80, minimum size=5mm, font=\tiny\bfseries, right=0.8cm of c1] (c2) {C2};
+  \node[circle, draw, fill=teal!60, minimum size=5mm, font=\tiny\bfseries, above right=0.5cm and 0.8cm of c2] (f1) {C3};
+  \node[circle, draw, fill=teal!60, minimum size=5mm, font=\tiny\bfseries, right=0.8cm of f1] (f2) {C4};
+  \node[circle, draw, fill=orange!80, minimum size=5mm, font=\tiny\bfseries, below right=0.5cm and 0.8cm of f2] (m1) {C5};
+
+  \draw[-{Stealth[length=2mm]}, thick, gray] (c1) -- (c2);
+  \draw[-{Stealth[length=2mm]}, thick, teal!70] (c2) -- (f1);
+  \draw[-{Stealth[length=2mm]}, thick, teal!70] (f1) -- (f2);
+  \draw[-{Stealth[length=2mm]}, thick, teal!70] (f2) -- (m1);
+  \draw[-{Stealth[length=2mm]}, thick, gray] (c2) -- (m1);
+
+  \node[rounded corners, fill=gray!20, draw=gray, font=\tiny\ttfamily, inner sep=2pt, above=0.3cm of m1] {main};
+  \node[rounded corners, fill=teal!15, draw=teal, font=\tiny\ttfamily, inner sep=2pt, above=0.3cm of f2] {feature/login};
+
+  % Labels PR and merge
+  \draw[dashed, red!40, thick] (f2) -- (m1) node[midway, right, font=\tiny, text=red!60] {PR + merge};
+
+\end{tikzpicture}
+
+\end{frame}

frame/frame6.tex

@@ -0,0 +1,34 @@
+\begin{frame}
+    \frametitle{And how do we prevent bad practices?}
+    \framesubtitle{Branch protection}
+    \section{Protection}
+
+    Branch protection is a Git feature
+    that allows protecting certain branches against unauthorized modifications.
+    For example, you can protect the master branch to prevent direct commits, require code reviews, or require tests to pass before merging.
+\end{frame}
+
+\begin{frame}
+    \frametitle{How do we do that?}
+    \framesubtitle{Branch protection}
+    \begin{center}
+        \includegraphics[width=1\textwidth]{assets/branch_protection_rules_name.png}
+    \end{center}
+\end{frame}
+
+\begin{frame}
+    \frametitle{How do we do that?}
+    \framesubtitle{Branch protection}
+    \begin{center}
+        \includegraphics[width=0.6\textwidth]{assets/branch_protection_rules_push.png}
+    \end{center}
+\end{frame}
+
+\begin{frame}
+    \frametitle{And the magic happens}
+    \framesubtitle{Branch protection}
+    \begin{center}
+        \includegraphics[width=1\textwidth]{assets/branch_protection_rules_error.png}
+    \end{center}
+\end{frame}
+

frame/frame7.tex

@@ -0,0 +1,42 @@
+\begin{frame}
+    \frametitle{Maximum security}
+    \framesubtitle{Protecting pull requests}
+    \section{For security enthusiasts!}
+
+    Generally, pull request settings are found in the same place as branch settings
+    \begin{center}
+        \includegraphics[width=0.6\textwidth]{assets/branch_protection_rules_pr1.png}
+        \includegraphics[width=0.7\textwidth]{assets/branch_protection_rules_pr2.png}
+    \end{center}
+\end{frame}
+
+\begin{frame}[fragile]
+    \frametitle{Maximum security}
+    \framesubtitle{CI}
+
+    CI (Continuous Integration) are tools that allow automating tests
+    on a pull request before merging it.
+\end{frame}
+
+\begin{frame}[fragile]
+    \frametitle{Maximum security}
+    \framesubtitle{CI}
+
+    \begin{center}
+            \begin{block}{.gitea/workflows/ci.yml}
+    \begin{verbatim}
+name: CI
+on:
+  pull_request:
+    branches: [master]
+jobs:
+  check:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - name: Validation
+        run: echo "All checks passed!"
+    \end{verbatim}
+    \end{block}
+    \end{center}
+\end{frame}

frame/frame8.tex

@@ -0,0 +1,10 @@
+\begin{frame}
+    \frametitle{References}
+    \begin{itemize}
+        \item Git documentation: \url{https://git-scm.com/doc}
+        \item Pro Git book: \url{https://git-scm.com/book/en/v2}
+        \item GitHub documentation: \url{https://docs.github.com/en}
+        \item Oh Shit, Git!: \url{https://ohshitgit.com/}
+        \item Datacamp: \url{https://www.datacamp.com/fr/tutorial/github-and-git-tutorial-for-beginners}
+    \end{itemize}
+\end{frame}

main.tex

@@ -1,6 +1,11 @@
 \documentclass[aspectratio=1610]{beamer}
+
+\usepackage{tikz}
+
+\usetikzlibrary{positioning, arrows.meta}
 \usetheme{Madrid}
 \usecolortheme{beaver}
+
 \title{Collaborating with Git}
 \author{Louis Gallet}
 \institute{EPITA}
@@ -8,4 +13,21 @@
 
 \begin{document}
 \frame{\titlepage}
+
+% frame 1
+
+\begin{frame}
+    \frametitle{Summary}
+    \tableofcontents
+\end{frame}
+
+\input{frame/frame1.tex}
+\input{frame/frame2.tex}
+\input{frame/frame3.tex}
+\input{frame/frame4.tex}
+\input{frame/frame5.tex}
+\input{frame/frame6.tex}
+\input{frame/frame7.tex}
+\input{frame/frame8.tex}
+
 \end{document}