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.

Transcript

1. (and it has some real neat friends)
   

   View 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 Slide

3. Let’s talk about local development environments.
   

   View Slide

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

   View 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 Slide

6. wp cli
   

   View Slide

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

   View Slide

8. Setting up sites super easily
   

   View Slide

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

   View Slide

10. 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 Slide

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

    View Slide

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

    View Slide

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

    View Slide

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

    View Slide

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

    View Slide

16. Sites VVV creates for you
    

    View Slide

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

    View Slide

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

    View Slide

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

    View Slide

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

    View Slide

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

    View Slide

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

    View Slide

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

    View Slide

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

    View Slide

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

    View Slide

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

    View Slide

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

    View Slide

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

    View Slide

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

    View Slide

30. View Slide

31. View Slide

32. 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 Slide

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

    View Slide

34. Developer Workflow
    (live demo ?)
    

    View Slide

35. New Project / Site
    

    View Slide

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

    View Slide

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

    View Slide

38. View Slide