42
Visualizing Git Workflows A visual guide to 539 workflows

Visualizing Git Workflows539/notes/notes-visualizing-git-workflows.pdf · GitHub Alice Now Alice pulls Bob’s updated changes from GitHub to her computer. Bob put the new feature

  • Upload
    others

  • View
    35

  • Download
    0

Embed Size (px)

Citation preview

Page 1: Visualizing Git Workflows539/notes/notes-visualizing-git-workflows.pdf · GitHub Alice Now Alice pulls Bob’s updated changes from GitHub to her computer. Bob put the new feature

Visualizing Git Workflows

A visual guide to 539 workflows

Page 2: Visualizing Git Workflows539/notes/notes-visualizing-git-workflows.pdf · GitHub Alice Now Alice pulls Bob’s updated changes from GitHub to her computer. Bob put the new feature

Table of Contents

Notation

Collaboration Without Review or Branches

Merge Conflicts

Requesting Code Review

Collaboration with Multiple Branches

Page 3: Visualizing Git Workflows539/notes/notes-visualizing-git-workflows.pdf · GitHub Alice Now Alice pulls Bob’s updated changes from GitHub to her computer. Bob put the new feature

Notation

Page 4: Visualizing Git Workflows539/notes/notes-visualizing-git-workflows.pdf · GitHub Alice Now Alice pulls Bob’s updated changes from GitHub to her computer. Bob put the new feature

Notation

C1

C1

This is a single commit. The text is the commit ID.

C2 C3 C4

This is a branch (i.e. sequence of commits). Each branch has a different color.

Page 5: Visualizing Git Workflows539/notes/notes-visualizing-git-workflows.pdf · GitHub Alice Now Alice pulls Bob’s updated changes from GitHub to her computer. Bob put the new feature

Notation

GitHub

These boxes show the state of a repository at a given location.

Page 6: Visualizing Git Workflows539/notes/notes-visualizing-git-workflows.pdf · GitHub Alice Now Alice pulls Bob’s updated changes from GitHub to her computer. Bob put the new feature

Notation

This means that GitHub is storing two branches. One has 4 commits, the other has 3.

C1

C1 C2 C3 C4

GitHub

C1 C8

Page 7: Visualizing Git Workflows539/notes/notes-visualizing-git-workflows.pdf · GitHub Alice Now Alice pulls Bob’s updated changes from GitHub to her computer. Bob put the new feature

Notation

C1

C1 C2

GitHub

This means that Alice’s computer is storing local copies of the same two branches.

C7 C8

Alice

C9

Page 8: Visualizing Git Workflows539/notes/notes-visualizing-git-workflows.pdf · GitHub Alice Now Alice pulls Bob’s updated changes from GitHub to her computer. Bob put the new feature

Notation

C1

C1 C2

GitHub

C7 C8

Alice

C9 C1

C1 C2 C3 C4

GitHub

C7 C8

Local Copy Remote Copy

Same branches, different commits.

Page 9: Visualizing Git Workflows539/notes/notes-visualizing-git-workflows.pdf · GitHub Alice Now Alice pulls Bob’s updated changes from GitHub to her computer. Bob put the new feature

Notation

C1

C1 C2

C2 C3 C4

I show branches like this:

Other tutorials may show this:

C5

C1C4

C2C3

C5

They mean the same thing

Page 10: Visualizing Git Workflows539/notes/notes-visualizing-git-workflows.pdf · GitHub Alice Now Alice pulls Bob’s updated changes from GitHub to her computer. Bob put the new feature

Collaboration Without Review or Branches

Page 11: Visualizing Git Workflows539/notes/notes-visualizing-git-workflows.pdf · GitHub Alice Now Alice pulls Bob’s updated changes from GitHub to her computer. Bob put the new feature

GitHub

Alice Bob

There is a “master branch” on github with two commits.

C2C1

Page 12: Visualizing Git Workflows539/notes/notes-visualizing-git-workflows.pdf · GitHub Alice Now Alice pulls Bob’s updated changes from GitHub to her computer. Bob put the new feature

GitHub

Alice Bob

Alice clones the repository on her computer.

C2C1

C2C1

Page 13: Visualizing Git Workflows539/notes/notes-visualizing-git-workflows.pdf · GitHub Alice Now Alice pulls Bob’s updated changes from GitHub to her computer. Bob put the new feature

GitHub

Alice Bob

Bob clones the repository on his computer.

C2C1

C2C1 C2C1

Page 14: Visualizing Git Workflows539/notes/notes-visualizing-git-workflows.pdf · GitHub Alice Now Alice pulls Bob’s updated changes from GitHub to her computer. Bob put the new feature

GitHub

Alice Bob

Alice commits new code to her master branch

C2C1 C3

C2C1

C2C1

Page 15: Visualizing Git Workflows539/notes/notes-visualizing-git-workflows.pdf · GitHub Alice Now Alice pulls Bob’s updated changes from GitHub to her computer. Bob put the new feature

GitHub

Alice Bob

Alice pushes the feature branch to GitHub for all to see.

C2C1 C3

C2C1 C3 C2C1

Page 16: Visualizing Git Workflows539/notes/notes-visualizing-git-workflows.pdf · GitHub Alice Now Alice pulls Bob’s updated changes from GitHub to her computer. Bob put the new feature

GitHub

Alice Bob

Bob fetches Alice’s new changes from GitHub.

C2C1 C3

C2C1 C3 C2C1 C3

Page 17: Visualizing Git Workflows539/notes/notes-visualizing-git-workflows.pdf · GitHub Alice Now Alice pulls Bob’s updated changes from GitHub to her computer. Bob put the new feature

GitHub

Alice Bob

Bob builds some of his code on Alice’s new commit.

C2C1 C3

C2C1 C3 C2C1 C3 C4

Page 18: Visualizing Git Workflows539/notes/notes-visualizing-git-workflows.pdf · GitHub Alice Now Alice pulls Bob’s updated changes from GitHub to her computer. Bob put the new feature

GitHub

Alice Bob

Bob pushes his code to GitHub for Alice to see.

C2C1 C3

C2C1 C3 C2C1 C3 C4

C4

Page 19: Visualizing Git Workflows539/notes/notes-visualizing-git-workflows.pdf · GitHub Alice Now Alice pulls Bob’s updated changes from GitHub to her computer. Bob put the new feature

GitHub

Alice Bob

Alice pulls Bob’s changes, so now everyone has the same code.

C2C1 C3

C2C1 C3 C2C1 C3 C4

C4

C4

Page 20: Visualizing Git Workflows539/notes/notes-visualizing-git-workflows.pdf · GitHub Alice Now Alice pulls Bob’s updated changes from GitHub to her computer. Bob put the new feature

Merge Conflicts

What happens when we change the same file?

Page 21: Visualizing Git Workflows539/notes/notes-visualizing-git-workflows.pdf · GitHub Alice Now Alice pulls Bob’s updated changes from GitHub to her computer. Bob put the new feature

GitHub

Alice

Imagine Alice is fixing a bug.

She starts by checking out a new purple branch, based off of her local master.

C2C1 C3

C1 C2 C3

C2C1 C3

Page 22: Visualizing Git Workflows539/notes/notes-visualizing-git-workflows.pdf · GitHub Alice Now Alice pulls Bob’s updated changes from GitHub to her computer. Bob put the new feature

GitHub

Alice

Around the same time, bob pushes a new commit, C4, to master.

Now the remote master (on GitHub) is out of sync with Alice’s local master branch.

C2C1 C3 C4

C1 C2 C3

C2C1 C3

Page 23: Visualizing Git Workflows539/notes/notes-visualizing-git-workflows.pdf · GitHub Alice Now Alice pulls Bob’s updated changes from GitHub to her computer. Bob put the new feature

GitHub

Alice

Alice creates a new commit, C5, to fix the bug on her new branch.

C2C1 C3 C4

C1 C2 C3 C5

C2C1 C3

Page 24: Visualizing Git Workflows539/notes/notes-visualizing-git-workflows.pdf · GitHub Alice Now Alice pulls Bob’s updated changes from GitHub to her computer. Bob put the new feature

GitHub

Alice

Now Alice pulls Bob’s updated changes from GitHub to her computer.

Bob put the new feature on the master branch, so when Alice pulls, it goes to her local master branch.

Notice how the last commit of the bug fix branch is different from master.

C2C1 C3 C4

C1 C2 C3 C5

C2C1 C3 C4

Page 25: Visualizing Git Workflows539/notes/notes-visualizing-git-workflows.pdf · GitHub Alice Now Alice pulls Bob’s updated changes from GitHub to her computer. Bob put the new feature

GitHub

Alice

Now Alice adds her local bug fix to her local master branch.

She does this by merging her changes from her bug fix branch to her master branch.

If there is a conflict with Bob’s changes, this results in a special merge commit.

C2C1 C3 C4

C2C1 C4C3 C6

C5

Page 26: Visualizing Git Workflows539/notes/notes-visualizing-git-workflows.pdf · GitHub Alice Now Alice pulls Bob’s updated changes from GitHub to her computer. Bob put the new feature

Requesting Code Review

Do this for every change outside of SkunkWorks!

Page 27: Visualizing Git Workflows539/notes/notes-visualizing-git-workflows.pdf · GitHub Alice Now Alice pulls Bob’s updated changes from GitHub to her computer. Bob put the new feature

GitHub

Alice

Alice creates a new “feature” branch.

C2C1

C2C1

C2C1

Page 28: Visualizing Git Workflows539/notes/notes-visualizing-git-workflows.pdf · GitHub Alice Now Alice pulls Bob’s updated changes from GitHub to her computer. Bob put the new feature

GitHub

Alice

Alice commits new code to her feature branch

C2C1

C3

C2C1

C2C1

Page 29: Visualizing Git Workflows539/notes/notes-visualizing-git-workflows.pdf · GitHub Alice Now Alice pulls Bob’s updated changes from GitHub to her computer. Bob put the new feature

GitHub

Alice

Alice pushes the feature branch to GitHub for all to see.

She creates a pull request and asks for a review.

C3

C3

C2C1

C2C1

C2C1

C2C1

Page 30: Visualizing Git Workflows539/notes/notes-visualizing-git-workflows.pdf · GitHub Alice Now Alice pulls Bob’s updated changes from GitHub to her computer. Bob put the new feature

GitHub

Alice

After addressing a few comments in a new commit, the Koz says “Ayyyy that code looks good.”

C3

C3 C4

C4

C2C1

C2C1

C2C1

C2C1

Page 31: Visualizing Git Workflows539/notes/notes-visualizing-git-workflows.pdf · GitHub Alice Now Alice pulls Bob’s updated changes from GitHub to her computer. Bob put the new feature

GitHub

Alice

After Alice addresses any review comments and obtains approval, the Koz merges her changes to master.

C3

C2C1 C3 C4

C4

C2C1

C2C1

Page 32: Visualizing Git Workflows539/notes/notes-visualizing-git-workflows.pdf · GitHub Alice Now Alice pulls Bob’s updated changes from GitHub to her computer. Bob put the new feature

GitHub

Alice

Alice now pulls the new master from GitHub, and deletes her old branch.

Now everyone has the same code.

C2C1 C3

C2C1 C3

C4

C4

Page 33: Visualizing Git Workflows539/notes/notes-visualizing-git-workflows.pdf · GitHub Alice Now Alice pulls Bob’s updated changes from GitHub to her computer. Bob put the new feature

Collaboration With Multiple branches

Page 34: Visualizing Git Workflows539/notes/notes-visualizing-git-workflows.pdf · GitHub Alice Now Alice pulls Bob’s updated changes from GitHub to her computer. Bob put the new feature

GitHub

Alice Bob

There is a “master branch” on github with two commits.

C2C1

Page 35: Visualizing Git Workflows539/notes/notes-visualizing-git-workflows.pdf · GitHub Alice Now Alice pulls Bob’s updated changes from GitHub to her computer. Bob put the new feature

GitHub

Alice Bob

Both Alice and Bob clone the repository on their computers.

C2C1

C2C1 C2C1

Page 36: Visualizing Git Workflows539/notes/notes-visualizing-git-workflows.pdf · GitHub Alice Now Alice pulls Bob’s updated changes from GitHub to her computer. Bob put the new feature

GitHub

Alice Bob

Alice creates a local orange branch.

Bob creates a local purple branch.

C2C1

C2C1

C2C1

C2C1

C2C1

Page 37: Visualizing Git Workflows539/notes/notes-visualizing-git-workflows.pdf · GitHub Alice Now Alice pulls Bob’s updated changes from GitHub to her computer. Bob put the new feature

GitHub

Alice Bob

They both commit new code to each of their branches.

C2C1

C3 C4

C2C1

C2C1

C2C1

C2C1

Page 38: Visualizing Git Workflows539/notes/notes-visualizing-git-workflows.pdf · GitHub Alice Now Alice pulls Bob’s updated changes from GitHub to her computer. Bob put the new feature

GitHub

Alice Bob

Alice pushes the feature branch to GitHub for all to see.

She requests a pull request.

C3

C4

C2C1

C2C1 C3

C2C1

C2C1

C2C1

C2C1

Page 39: Visualizing Git Workflows539/notes/notes-visualizing-git-workflows.pdf · GitHub Alice Now Alice pulls Bob’s updated changes from GitHub to her computer. Bob put the new feature

GitHub

Alice Bob

The course staff merges Alice’s changes with the master branch on GitHub.

C2C1 C3

C2C1

C2C1 C3

C2C1

C2C1 C4

Page 40: Visualizing Git Workflows539/notes/notes-visualizing-git-workflows.pdf · GitHub Alice Now Alice pulls Bob’s updated changes from GitHub to her computer. Bob put the new feature

GitHub

Alice Bob

Both Alice and Bob pull down the changes from master.

C2C1

C2C1

C4

C3

C3

C3C2C1

C2C1

Page 41: Visualizing Git Workflows539/notes/notes-visualizing-git-workflows.pdf · GitHub Alice Now Alice pulls Bob’s updated changes from GitHub to her computer. Bob put the new feature

GitHub

Alice Bob

Bob merges master into his feature branch.

C2C1

C2C1 C3

C3 C4 C6

C3

C3

C1 C2

C2C1

Page 42: Visualizing Git Workflows539/notes/notes-visualizing-git-workflows.pdf · GitHub Alice Now Alice pulls Bob’s updated changes from GitHub to her computer. Bob put the new feature

GitHub

Alice Bob

Bob pushes his feature branch to master and asks for a PR.

C2C1 C3 C4 C6

C3

C3

C4 C6

C3

C3

C1 C2

C2C1

C1 C2

C2C1