Upgrade to Pro — share decks privately, control downloads, hide ads and more …

WordPress & Version Control (v2) - WordCamp Chicago 2012

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.

Aaron Holbrook

August 25, 2012
Tweet

More Decks by Aaron Holbrook

Other Decks in Technology

Transcript

  1. WordPress &
    Version Control
    Aaron Holbrook

    View Slide

  2. @aaronjholbrook
    [email protected]
    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 “[email protected]

    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
    [email protected]:$ ssh-keygen -t rsa
    [email protected]:$ ssh [email protected] mkdir -p .ssh
    [email protected]:$ cat .ssh/id_rsa.pub | ssh [email protected] ‘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://[email protected]/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
    [email protected]
    #wpgit
    #wcchi

    View Slide