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

Extremely Powerful Local WordPress Development with Vagrant and Friends - WordCamp Grand Rapids 2014

Brad Parbs
August 16, 2014

Extremely Powerful Local WordPress Development with Vagrant and Friends - WordCamp Grand Rapids 2014

If you’re developing anything for yourself or for clients, you want to develop locally. This prevents disasters, allows you to develop more quickly, and a lot more benefits.

By using Vagrant and its friends, you can easily create a super-powerful local development toolkit just like the pros.

In this talk, we’ll walk through all of the benefits of Vagrant, how to easily get it setup, and the wide range of complementary tools and process you can add to your workflow to become a local development master.

Brad Parbs

August 16, 2014
Tweet

More Decks by Brad Parbs

Other Decks in Technology

Transcript

  1. (and it has some real neat friends)

    View full-size slide

  2. I’m Brad Parbs
    • Developer @ WebDevStudios
    • Plugin / Theme Author
    • Tweet crappy things @bradparbs
    • Push code to github.com/bradp
    • Collect gifs at http://gifsb.in
    • Probably have a website somewhere

    View full-size slide

  3. Let’s talk about local development environments.

    View full-size slide

  4. So, what’s Vagrant?
    Create and configure lightweight, reproducible, and
    portable development environments.

    View full-size slide

  5. I ♥ Vagrant & its friends.
    • Easy WPCLI!
    • Setting up sites super fast!
    • Always up-to-date!
    • No more MAMP!
    • Keeps your system clean

    View full-size slide

  6. What can you do with WPCLI?
    $ wp core update !
    $ wp plugin install logout-roulette!
    $ wp scaffold post-type books

    View full-size slide

  7. Setting up sites super easily

    View full-size slide

  8. Scripting on setup
    • Auto-create Sublime project
    • Add to Sourcetree
    • Open in Chrome
    • Anything you can imagine

    View full-size slide

  9. Installing Vagrant
    • Any OS works!
    • Install VirtualBox (4.2.x or 4.3.6 recommended by VVV)
    • Install Vagrant
    http://www.vagrantup.com/downloads.html
    https://www.virtualbox.org/wiki/Downloads

    View full-size slide

  10. How does it actually work though?
    • VirtualBox runs a VM
    • Vagrant manages it

    View full-size slide

  11. How to use (without VVV)
    • Clone a box
    • Start up a virtual machine
    • Use it!
    • Pause / Destroy it anytime

    View full-size slide

  12. Commands
    $ vagrant init
    $ vagrant up
    $ vagrant halt
    $ vagrant destroy
    $ vagrant provision
    $ vagrant ssh

    View full-size slide

  13. Varying Vagrant Vagrants
    “Varying Vagrant Vagrants is an evolving Vagrant
    configuration focused on WordPress development.”

    View full-size slide

  14. Installation
    $ vagrant plugin install vagrant-hostsupdater
    $ git clone git://github.com/Varying-Vagrant-Vagrants/VVV.git
    $ cd VVV
    $ vagrant up

    View full-size slide

  15. Sites VVV creates for you

    View full-size slide

  16. http://local.wordpress.dev/ for WordPress stable

    View full-size slide

  17. http://local.wordpress-trunk.dev/ for WordPress trunk

    View full-size slide

  18. http://src.wordpress-develop.dev/ for trunk
    WordPress development files

    View full-size slide

  19. http://build.wordpress-develop.dev/ for the version
    of those development files built with Grunt

    View full-size slide

  20. http://vvv.dev/
    Default dashboard
    containing several useful
    tools: PHPmyAdmin,
    OPCache, links to all sites,
    etc

    View full-size slide

  21. Helpful aliases
    $ alias v=vagrant
    $ alias vp="vagrant provision"
    $ alias vup="vagrant up && vagrant provision && vagrant ssh"

    View full-size slide

  22. Other things
    • Prefer Apache?
    https://github.com/ericmann/vvv-apache

    View full-size slide

  23. Scripting Site Setup
    https://github.com/varying-vagrant-vagrants/vvv/wiki/Auto-site-Setup
    (demo of da codes)

    View full-size slide

  24. VVV Site Wizard
    https://github.com/aliso/vvv-site-wizard

    View full-size slide

  25. Installation
    • Clone https://github.com/aliso/vvv-site-wizard
    • Add to your PATH
    • Run it when you’re in a VVV directory

    View full-size slide

  26. How does it work?
    Gives you a super helpful “$ vvv create” command

    View full-size slide

  27. Commands
    • vvv create (or make or new) [site]
    • vvv delete ( or rm or teardown) [site]
    • vvv list

    View full-size slide

  28. vvv create
    • vvv create
    • asks you for directory name
    • asks you for local domain to use
    • Does all the boring vagrant file setup

    View full-size slide

  29. Modifications
    • Easily add more questions to site-setup
    • Git repo to clone to wp-content
    • Database to import
    • Whether or not to import placeholder content
    • Create Sublime project files
    • Bookmark in SourceTree

    View full-size slide

  30. More Modifications
    • vvv o [site]
    • Opens Sublime Project files
    • Opens local domain in browser
    • Opens git repo in SourceTree

    View full-size slide

  31. Developer Workflow
    (live demo ?)

    View full-size slide

  32. New Project / Site

    View full-size slide

  33. Existing Project / Site
    $ vvv open [site]

    View full-size slide

  34. More Tips and Tricks
    • Anything you do that’s repetitive, script it!
    • Learn to love ‘vagrant provision’

    View full-size slide