Develop WordPress in Vagrant using VVV

Not sure how to view your WordPress site locally? Read on! I’ll explain how to set up an incredibly fast local WordPress development environment. The goal to keep in mind here is being able to view our WordPress site locally in our browser.

First of all, check out the summary at the bottom if you’ve done this before and just want a quick refresher!

Also, here is a video if you prefer it or if you need any clarification.

Step 1 – Install VirtualBox and Vagrant

Download and install Virtual Box

Download and install Vagrant

Virtual Box

vbox_logo2_gradient

What is Virtual Box? Virtual Box is a program that runs operating systems. The operating system (Windows, Ubuntu, or Macintosh) runs inside of virtual box and appears in a window like the one you’re using to view this tutorial.

However, running a whole OS on your computer is a huge drain on your computer and not very convenient for your WordPress goals.

Vagrant

Screen-Shot-2016-01-06-at-10.41.00-PM

Vagrant gets you closer to the solution of viewing WordPress sites locally on your computer. You can think of Vagrant as a manager of Virtual Boxes. With Vagrant, you can quickly boot up a virtual OS in a couple of seconds.

Now that you’ve installed Vagrant, the vagrant command will become available in your terminal.

You are closer to the goal of viewing your WordPress site locally.

 

Step 2 – Install VVV and Variable VVV

Yes, that’s a lot of Vs.

VVV is a helpful Vagrant Box. It has a lot of the tools that you’ll need to set up your local WordPress site already installed.

Local WordPress Development with Varying Vagrant Vagrants

Now comes the fun part. I recommend that you read the guide on Github to give you a better understanding of VVV, but it’s not necessary to read it. You can also read Brad Parbs tutorial for more information if you run into any errors.

Open up your terminal, type vagrant plugin install vagrant-hostsupdater, and hit enter. This will install a Vagrant plugin that takes care of configuring the hosts file. Thankfully, you do not need to understand what a hosts file is, but, basically, it tells your browser where to find your WordPress site.

You also have the option to install a plugin called vagrant-triggers, but don’t. Brad Parb mentioned that installing it caused him some issues. I didn’t install it and haven’t experienced any problems.

To download VVV, go to your terminal and run git clone git://github.com/Varying-Vagrant-Vagrants/VVV.git vagrant-local. This will download VVV from Github and put it in a folder called vagrant-local inside of your terminal’s current working directory. If you want to install VVV in your home folder like I did, type cd ~/ in your terminal before running the previous command. Running this command will make your home folder the terminal’s current working directory.

Next, in your terminal run cd vagrant-local to enter the vagrant-local folder that was just created. This will take you into the folder with VVV. Finally, type vagrant up to start installing VVV.

Once that finishes installing (hopefully without too many errors), you will be able to visit a number of pre-installed WordPress websites in your browser. http://local.wordpress.dev/ is one of them that you can try visiting. Refer to the VVV’s Github page for more examples.

Variable VVV

You have almost set up an incredible local WordPress development environment.

You now have the capability to view those default WordPress sites in your browser, but how do you create a new local WordPress website? That’s where vv comes in.

The following video also might be of some help if you get stuck, but it’s not necessary to watch if everything is going swimmingly.

Brad Parb recommends installing Homebrew to install Variable VVV. Since that’s what I did, I’ll also recommend it. Run ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)" in your terminal to install Homebrew. As a side note to clear up any confusion, run the previous command BEFORE running vagrant ssh. I’ll explain what “vagrant ssh” does in a moment.

Now, to install Variable VVV, run brew install bradp/vv/vv in your terminal.

Next, in your terminal, enter the directory (the folder) where VVV keeps its WordPress websites, by typing cd ~/vagrant-local/www. Now, simply type vv create in your terminal.

The first time you run vv create it will ask you where your installation of VVV is. Type a capital Y if it successfully found it.

After you enter a name for your site, you’ll be asked a few more questions: whether you want it to be a multisite, whether you have local SQL file, or whether you have a Git repo. You can safely say no or just hit enter if you can’t provide something that it’s asking for.

After it finishes creating the WordPress site, you can visit your-site-name.dev in your browser. The entire WordPress site will be inside ~/vagrant-local/www/your-site-name/htdocs

Congratulations!

You can, now, quickly and easily create local WordPress sites and view them in your browser!

Summary

  1. Download and install Virtual Box
  2. Download and install Vagrant
  3. Open up your terminal and run vagrant plugin install vagrant-hottsupdater.
  4. In your terminal, run git clone git://github.com/Varying-Vagrant-Vagrants/VVV.git ~/vagrant-local to download VVV to your home folder.
  5. If you don’t have git install, the terminal will prompt you to install it. Click Install to install git.
  6.  cd vagrant-local to enter the folder with VVV
  7. vagrant up to install VVV using Vagrant
  8.  Run ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)to install home-brew (to install home-brew on your Mac) OR
  9. Do not complete this step. I tried installing VV in Vagrant, but it needs to be installed on the Mac. However, if you want to install home brew in Vagrant, this is how to do it. Install home-brew in vagrant by running the following commands
    1. cd ~/vagrant-local/provision
    2. vi provision.sh
    3. add build-essential and python-setuptools to the list of items to be installed
    4. vagrant provision
    5. vagrant ssh
    6. vi .bashrc
    7. add the following to the bottom of the file
      export PATH="$HOME/.linuxbrew/bin:$PATH"
      export MANPATH="$HOME/.linuxbrew/share/man:$MANPATH"
      export INFOPATH="$HOME/.linuxbrew/share/info:$INFOPATH"
    8. type :wq! and hit enter to save and quit
    9. exit
    10. vagrant provision
  10. Run brew install bradp/vv/vv to install Variable VVV. VV **must** be installed on your Mac and not in Vagrant.
  11. Run cd ~/vagrant-local to enter the folder where VVV was downloaded.
  12. Run vv create to create a local WordPress installation.