WordPress & Version Control (v2) - WordCamp Chicago 2012

Version Control lets you track your files over time. Why should you care? So when you mess up you can easily get back to a previous working version! I will take you through what version control is, why it’s important and how to start using it today on projects you’re already working on.

Transcript

1. WordPress &
   Version Control
   Aaron Holbrook
   

   View Slide

2. @aaronjholbrook
   aaron@a7web.com
   a7web.com
   me
   

   View Slide

3. Full-time Freelance Web Developer (1.5yr)
   Web Developer & WordPress fanatic since 2005
   Father, husband, gamer, geek
   AARON
   HOLBROOK
   

   View Slide

4. BACKGROUND
   Webmaster (5yrs) for a Hospital
   Saved Hospital >$400,000
   Built a network of Git repos/remotes
   

   View Slide

5. CURRENTLY
   Founded and run A7 Web Design (3yrs)
   Global client base
   Theme & Plugin Author
   Core contributor
   Automation Script Builder
   Founded McHenry County WordPress Meetup
   

   View Slide

6. OVERVIEW
   WTF is version control?
   Why should I care?
   Use it TODAY!
   WP & Version Control: A match made in
   heaven
   

   View Slide

7. WHAT IS VERSION CONTROL?
   $version_control =
   “A system that tracks changes to your files
   over time”;
   

   View Slide

8. EVER DONE
   THIS?
   

   View Slide

9. YOU’RE A
   GENIUS!
   you made your own
   (rudimentary) version
   control system!!!
   

   View Slide

10. WHY USE IT?
    PREVENT THE
    FOLLOWING
    

    View Slide

11. code y u no work
    anymore?
    

    View Slide

12. backup? what backup?
    

    View Slide

13. seriously though...
    

    View Slide

14. Incremental backups
    Short & long term undo
    Easier collaboration
    Track changes & ownership
    Sandboxing
    BE A BETTER DEV
    

    View Slide

15. “A civilized tool for a civilized age”
    - Si, stack overflow
    

    View Slide

16. Lightning fast
    Distributed
    Easy Branching
    Easy team collaboration
    WHY GIT?
    

    View Slide

17. !=
    version control system collaborative coding web app
    

    View Slide

18. TERMS
    REPO: The database storing the files
    COMMIT: A snapshot of your files in time
    

    View Slide

19. Committed
    Modified
    Staged
    THREE STATES OF EXISTENCE
    (for files)
    

    View Slide

20. Safely stored in Git database
    COMMITTED
    

    View Slide

21. File has been modified, but hasn’t
    been committed yet
    MODIFIED
    

    View Slide

22. File is marked to go into
    your next commit
    STAGED
    

    View Slide

23. Working Directory
    Git Directory
    Staging Area
    THREE SECTIONS OF A GIT
    REPOSITORY
    

    View Slide

24. This is where Git stores the metadata and
    object database for the project
    GIT DIRECTORY
    

    View Slide

25. A single checkout of one version of the
    project
    WORKING DIRECTORY
    

    View Slide

26. A file that contains information
    about what will go in the next
    commit
    STAGING AREA
    

    View Slide

27. Modify files
    Stage files
    Commit!
    GIT WORKFLOW
    

    View Slide

28. Install
    http://git-scm.com/downloads
    GIT STARTED
    

    View Slide

29. Configure
    GIT STARTED
    $ git config --global user.name “Aaron Holbrook”
    $ git config --global user.email “aaron@a7web.com”
    

    View Slide

30. Create a Git repository in ANY directory
    $ git init
    Even existing projects!!
    INITIALIZE
    

    View Slide

31. Add our files to the staging area
    $ git add .
    ADD ALL
    THE
    THINGS!!1
    

    View Slide

32. Commit our snapshot to the repository
    $ git commit -m “Initial Commit”
    COMMIT
    

    View Slide

33. Congratulations!
    You’ve successfully created a Git repository
    and committed a permanent snapshot of
    your files!
    YOU
    ROCK!
    

    View Slide

34. FASTEN
    YOUR
    SEATBELTS
    

    View Slide

35. VIEWING
    COMMITS
    $ git log
    

    View Slide

36. Roll back to previous commits
    $ git checkout db210f
    ROLLBACK
    

    View Slide

37. Create a branch (sandbox!)
    $ git branch NewBranch
    $ git checkout NewBranch
    $ git checkout master
    BRANCHING
    ...do some experiments, decide that we
    want to go back to where its safe:
    

    View Slide

38. MERGING
    BRANCHES
    Commit changes on a branch
    $ git commit -m “NewBranch commit”
    $ git checkout master
    $ git merge NewBranch
    Check out the branch you wish to merge into
    Merge the branches!
    

    View Slide

39. OH NOES!
    A WILD MERGE
    CONFLICT APPEARS!!
    

    View Slide

40. View Slide

41. View Slide

42. View Slide

43. View Slide

44. Customized Log Output: https://gist.github.com/3453149
    

    View Slide

45. WHEW!
    DISASTER AVERTED!
    

    View Slide

46. WORDPRESS &
    VERSION CONTROL
    Now with multiple environments!
    

    View Slide

47. DEPLOY
    WORKFLOW
    Development Environment
    Set up remotes to live server
    Deploy changes!
    

    View Slide

48. Special file: .gitignore
    Goes in the root of your repo
    Add filenames or directories that Git should ignore
    .GITIGNORE
    

    View Slide

49. .GITIGNORE
    wp-config.local.php
    .DS_Store/Thumbs.db
    .htaccess
    wp-content/uploads/
    wp-content/cache/
    Optional - ignore user uploads
    Optional - ignore live cache
    

    View Slide

50. WP-CONFIG.LOCAL.PHP
    Define dev DB info
    Keeps dev DB separate
    from production DB
    this file is the magic key
    Credit to Mark Jaquith (@markjaquith)
    http://markjaquith.wordpress.com/2011/06/24/wordpress-local-dev-tips/
    

    View Slide

51. Test for
    If it exists, use it
    If not, use Production DB info
    WP-CONFIG.PHP
    wp-config.local.php
    

    View Slide

52. WP-CONFIG.PHP
    

    View Slide

53. PASSWORDLESS
    SSH
    a@A:$ ssh-keygen -t rsa
    a@A:$ ssh b@B mkdir -p .ssh
    a@A:$ cat .ssh/id_rsa.pub | ssh b@B ‘cat >> .ssh/authorized_keys’
    

    View Slide

54. Create two repositories on Production:
    -> collaboration (central hub) repo
    -> live site repo
    HUB
    PRIME
    Thanks to Joe Maller
    http://joemaller.com/990/a-web-focused-git-workflow/
    HUB & PRIME
    

    View Slide

55. $ git init --bare
    /domains/site.com/html
    /domains/site.com/git-hub
    Place outside of root in a ‘git-hub’* folder
    *Not to be confused with the fantastic GitHub
    https://github.com/
    HUB
    

    View Slide

56. HOOK
    IT UP
    Hooks allow you to run bash scripts upon certain criteria
    (a lot like WordPress!)
    We’ll want to create a hook so HUB updates PRIME
    automatically
    

    View Slide

57. HOOKS
    Located in .git/hooks
    applypatch-msg
    commit-msg
    post-update
    pre-applypatch
    pre-commit
    pre-rebase
    prepare-commit-msg
    update
    

    View Slide

58. POST-UPDATE HOOK
    Fires after receiving a
    push from a remote
    /git-hub/hooks/post-update
    

    View Slide

59. /domains/site.com/html
    PRIME
    $ git init
    $ git remote add hub /domains/site.com/git-hub
    Secure the .git directory with .htaccess!
    

    View Slide

60. $ git remote add hub ssh://login@host.com/home/domains/site.com/git-hub
    DEVELOPMENT
    ENVIRONMENT
    Add a remote from DEV to HUB
    

    View Slide

61. DEPLOY!
    $ git add .
    $ git commit -am “Updated header to include nav links”
    $ git push hub master
    

    View Slide

62. DEPLOY
    SUCCESSFUL!
    

    View Slide

63. PUSH / PULL
    $ git pull hub master
    If you make any changes directly on PRIME you will need
    to commit on PRIME and PULL to PRODUCTION
    

    View Slide

64. CAUTION!
    If you did NOT put the wp-content/uploads
    folder in .gitignore, you will have to
    manually commit changes frequently
    

    View Slide

65. PRETTY MUCH
    THIS
    Version control is amazing!
    It will improve your life!
    Using the basics is simple!
    Google is your friend!
    

    View Slide

66. aaronjholbrook.com/?p=310
    Slides
    @aaronjholbrook
    a7web.com
    aaron@a7web.com
    #wpgit
    #wcchi
    

    View Slide