Getting Started with Vagrant for WordPress Development
February 18, 2013
In the dark days of the past, we used a few different solutions for hosting our development environments. Ron preferred MAMP, while I used Parallels virtual machines. It made writing build scripts and standardizing our workflows a nightmare. Then, a few projects ago, I discovered the magic that is Vagrant.
Vagrant is a wrapper around VirtualBox that allows developers to create and share virtual machines with each other. Why is this a good thing? We can create a standard development environment with all the tools and resources we need, and it’s completely self contained. We can then share that standard environment with each other so that everybody’s on the same page.
Ron and I have been using Vagrant for the last several projects we’ve built, and we love it! Here’s how we got started:
Creating a Base Box
First, we read the excellent Getting Started guide. It covers installation and initial setup. Next we created a simple virtual machine and started installing the software we needed to run a WordPress site (in our case that’s MySQL, PHP-FPM, and Nginx). Because we use Thor, Compass, and CoffeeScript, we also needed to install Node.js and RVM with Ruby 1.9.3 on the VM. Note that this step required some basic command line jujitsu.
One quick gotcha with Nginx is that we had to disable Sendfile support because it’s not compatible with Vagrant’s shared folder system.
Setting Up WordPress
Next, we had to figure out how to automate the installation of WordPress itself onto the VM. Luckily, Vagrant has built-in support for Puppet. Puppet is a configuration management tool that lets you specify the state you want your system to be in and the steps required to get there. Here’s the manifest I wrote to install WordPress and some other necessary software, as well as setup a MySQL database for WP to use. Once you’ve got a manifest created, all you need to do is uncomment the Puppet lines in your project’s Vagrantfile and run
vagrant up or
After we got the VM set up the way we wanted it, we needed to share our WP theme folder to the correct path on the virtual machine. Again, Vagrant makes this dead simple with its VirtualBox shared folders support. We added the following line to our project’s Vagrantfile:
config.vm.share_folder 'v-theme', '/home/vagrant/www/wp-content/themes/theme-name', './theme'
Once you create a base box, you can reuse it for all your projects really easily. After setting everything up, I ran
vagrant package to create a reusable VM template that Vagrant calls a “box”.
I uploaded it to Dropbox, got the public link, and put it in the Vagrantfile so that Vagrant will automatically download the box if it doesn’t exist on the user’s system:
config.vm.box_url = "https://dl.dropbox.com/s/m22yeq59v2cn4h7/Squeeze64_PHP_RVM_Node.box?token_hash=AAHk1P67Cty2bCBCVrvTA9eyrtF7CtJ4LCxMqOL-B1Ka4Q&dl=1"
If you want to get started with Vagrant, we’ve released our boilerplate project code on GitHub. You can check it out at https://github.com/fifthroom/vagrant-wp-theme. Instructions are in the README.