Git for Humans

Git for Humans

A presentation I gave at UXBri.
Audio + Slides here: https://www.youtube.com/watch?v=eWxxfttcMts

Df057cdadda4cd7a2a2db52576de1bf2?s=128

Alice Bartlett

November 04, 2016
Tweet

Transcript

  1. 8.

    “ Git is an application that runs on your computer, like

    a web browser or a word processor ” Tom Stuart http://codon.com/ “ Git is an application that runs on your computer, like a web browser or a word processor ”
  2. 18.
  3. 20.

    You use Git to take snapshots of all the files

    in a folder. This folder is called a repository or repo. @alicebartlett
  4. 21.

    When you want to take a snapshot of a file

    or files, you create a commit @alicebartlett
  5. 26.

    @alicebartlett By saving copies By making commits logo.svg logo.svg logo.svg

    logo.svg logo-2.svg logo-3-monica-feedback.svg commit
  6. 27.

    @alicebartlett By saving copies By making commits logo.svg logo.svg logo.svg

    logo.svg logo.svg logo-2.svg logo-3-monica-feedback.svg logo-3-FINAL.svg commit
  7. 28.

    @alicebartlett By saving copies By making commits logo.svg logo.svg logo.svg

    logo.svg logo.svg logo.svg logo-2.svg logo-3-monica-feedback.svg logo-3-FINAL.svg logo-3-FINAL-1.svg commit
  8. 29.

    @alicebartlett By saving copies By making commits logo.svg logo-2.svg logo-3-monica-feedback.svg

    logo-3-FINAL.svg logo-3-FINAL-1.svg logo.svg logo.svg logo.svg logo.svg logo.svg
  9. 30.

    When you commit a file or files, some information is

    saved along with the changes to the file @alicebartlett
  10. 32.
  11. 33.

    Update link style User research showed that many people did

    not spot links in the copy. This commit updates the link style to the new underlined style which performed better. @alicebartlett A good commit message:
  12. 35.

    @alicebartlett By making commits logo.svg logo.svg logo.svg logo.svg logo.svg Alice

    Bartlett 10:34am March 11th 2016 Update link style User research showed that many people did not spot links in the copy. This commit updates the link style to the new underlined style which performed better.
  13. 36.

    @alicebartlett By making commits logo.svg logo.svg logo.svg logo.svg logo.svg Alice

    Bartlett 12:43pm May 5th 2016 Add new colours New colours for US election campaign
  14. 37.

    @alicebartlett By making commits logo.svg logo.svg logo.svg logo.svg logo.svg Alice

    Bartlett 12:43pm May 8th 2016 Fix Orange The orange we used fails AAA accessibility contrast tests so beef it up to contrast properly
  15. 38.

    Git stores the whole history of your project @alicebartlett 20-09-2016:

    updated link style 20-05-2016: added changes from monica 20-06-2016: deleted save icon
  16. 42.

    Git stores the whole history of your project @alicebartlett 20-09-2016:

    updated link style 20-05-2016: added changes from monica 20-06-2016: deleted save icon
  17. 43.

    Each of these commits has an id called a hash

    @alicebartlett 439301fe69e8f875c049ad0718386516b4878e22 377dfcd00dd057542b112cf13be6cf1380b292ad 456722223e9f9e0ee0a92917ba80163028d89251
  18. 44.

    @alicebartlett I can tell Git what commit I want to

    check out using the commit hash d5b87865bc2cd9d38ba8284c2eaa0d0241d800bb 20-05-2016: deleted play icon
  19. 45.

    Getting the files from a commit in the past is

    known as doing a check out @alicebartlett
  20. 46.

    @alicebartlett I can tell Git what commit I want to

    check out using the commit hash d5b87865bc2cd9d38ba8284c2eaa0d0241d800bb 20-05-2016: deleted play icon
  21. 47.

    @alicebartlett I can tell Git what commit I want to

    check out using the commit hash d5b87865bc2cd9d38ba8284c2eaa0d0241d800bb 20-05-2016: deleted play icon
  22. 48.

    @alicebartlett My other commits still exist, but when I look

    in my repo, it’s as if they never happened d5b87865bc2cd9d38ba8284c2eaa0d0241d800bb 20-05-2016: deleted play icon
  23. 49.

    hash - a computer generated id checkout - time travel

    to a specific commit @alicebartlett
  24. 52.

    This isn’t really how projects work, sometimes you want to

    make easily discardable experiments @alicebartlett
  25. 59.

    Branches are useful for trying out stuff, as they’re really

    easy to throw away if you decide you don’t like your changes @alicebartlett
  26. 60.

    At the FT most dev work is done in branches,

    the master branch is considered special @alicebartlett
  27. 61.

    It’s common for the master branch to be the version

    of the code or files that are live on the site @alicebartlett
  28. 63.

    Once you’re happy with some work, you need a way

    to get it back into master @alicebartlett
  29. 66.

    branch - a moveable label that points to a commit

    merge - the combination of two or more branches @alicebartlett
  30. 74.

    To get some work from a remote for the first

    time you clone it @alicebartlett
  31. 79.

    Remote @alicebartlett Lucy Kellaway 10:34am November 4th 2016 Fix broken

    icon tinting Icon tinting was case sensitive so #FFF worked but #fff didn’t. This commit removes this bug.
  32. 87.

    remote - a computer with a repo on it clone

    - get the repo from the remote for the first time pull - get new commits to the repo from the remote push - send your new commits to the remote @alicebartlett
  33. 92.

    @alicebartlett Git allows lots of people to work on the

    same project, which is why people suffer through the terrible UX of it.
  34. 93.

    @alicebartlett repository commit hash checkout branch merge remote clone push

    pull Git terms we’ve covered your project folder a snapshot of your repo an id for a commit time travel to a specific commit a movable label that points to a commit combining two branches a computer with the repository on it get the repository from the remote for the first time send commits to a remote get commits from a remote
  35. 94.

    1. Tell the story of your project 2. Travel back

    in time 3. Experiment with changes 4. Back up your work 5. Collaborate on projects