Developing WordPress Locally with Vagrant

Jason Yingling

@jason_yingling

Why Should You Develop Locally?

• Gives you the opportunity to test first

• Quickly setup sites for testing

• Avoid this:

MAMP

• Pros

– Free

– Easy setup

• Cons

– No custom domains

– Single server

– Not great for multiple installs

MAMP Pro

• Pros

– Multiple sites

– Custom domains

– Multiple versions of PHP

– GUI Interface

• Cons

– Not free

Vagrant

• Pros

– Custom domains

– Multiple sites

– Free

– Anything is possible!

• Cons

– No gui (by default)

– Command line seems intimidating

What We’ll Need to Setup

• Virtual Box

• Vagrant

• Varying Vagrant Vagrants

• Variable VVV

What We’ll Need to Do to Setup Local WordPress Sites When Done

• Open terminal

• Type “vv create”

• Answer a few prompts

• Grab a beer and wait

Install VirtualBox

• https://www.virtualbox.org/wiki/Downloads

• Download the most recent version

• Install like any other application

Install Vagrant

• https://www.vagrantup.com/downloads.html

• Download the most recent version

• Install like any other application

Setup Varying Vagrant Vagrants

• Open up Terminal

• Run “vagrant plugin install vagrant-hostsupdater”

• Run “vagrant plugin install vagrant-triggers”

• Navigate to a directory to use for your vagrant directory: “cd ~/sites”

• Clone the VVV repo: “git clone git://github.com/Varying-Vagrant-Vagrants/VVV.git vagrant-local”

Variable VVV

• Let’s you create new WordPress installs by answering a few prompts

Install Variable VVV

• Don’t have Homebrew. Install it with ruby -e"$(curl -fsSLhttps://raw.githubusercontent.com/Homebrew/install/master/install)”

• Run “brew install bradp/vv/vv”

• Run “vv create” any time you want to make a new dev site

• Set your path– /Users/{ComputerUserName}/sites/vagrant-local

Vagrant Manager

Vagrant Manager Installation

• https://github.com/lanayotech/vagrant-manager/releases/tag/2.3.0

Vagrant Dashboard

Install Vagrant Dashboard

• Navigate to your vagrant-local folder: cd~/sites/vagrant-local/www

• Run: git clone https://github.com/topdown/VVV-Dashboard.git dashboard

• From the Dashboard folder:– Copy the dashboard-custom.php to vagrant-

local/www/default/dashboard-custom.php

– Copy the style.css to vagrant-local/www/default/style.css

• Check out your Fancy new dashboard at vvv.dev

VVV Provision Flipper

• Speed up the provisioning process• Download from Github: https://github.com/bradp/vvv-

provision-flipper• Run: echo $PATH• Copy flip file into one of the paths from the previous step• Run: flip• Set path to your vagrant-local folder:

/Users/{ComputerUserName}/sites/vagrant-local

• Select your provision script with “flip set {scripte_name}” ex: flip set quick

• Reset to the original provision script with “flip reset”

Blueprints

• Allows you to set specific plugins, themes, content, and more to be installed when a new site is created

• Run: vv --blueprint-init to create vv-blueprints.json file

• Sample: https://github.com/bradp/vv#blueprints

Hooks

• Newer feature of Variable VV

• Similar to WP Hooks

• Let’s you hook into processes that run during site creation and add your own code

Resources

• Detailed setup guide: https://jasonyingling.me/setting-up-a-local-wordpress-environment-with-vagrant/

• Varying Vagrant Vagrants -https://github.com/Varying-Vagrant-Vagrants/VVV#varying-vagrant-vagrants

• Variable VV -https://github.com/bradp/vv#variable-vvv---the-best-vvv-site-wizard