1. Powering Development
and Testing Environments
with Vagrant
Coen Jacobs / @CoenJacobs
at
WordCamp Norway 2014
!
#WCNorge

2. Coen Jacobs
@CoenJacobs
!
http://coenjacobs.me
!
WooThemes / WooCommerce

3. Powering Development
and Testing Environments
with Vagrant

4. Vagrant

7. Problem at hand

8. Get someone started
on your project

10. Let’s get you up and running…
•
“I just use MAMP, it’s brilliant”
•
“Tell me what you need and I’ll make a VM”
•
“My VPS runs a custom compiled LAMP setup”
•
“A server, what do I need that for?”

11. Bring order to chaos

12. Three common ways to do this
and all three are horrible…

13. 1. Setup script

14. 1. Setup script
•
Special maintenance!
•
Different to production!
•
Windows or Linux?

15. 2. The über README

16. 2. The über README
•
Extremely prone to user error!
•
Unlikely to keep it up to date!
•
Very time consuming!
•
Windows or Linux?

17. 3. “Good luck, have fun”

18. 3. “Good luck, have fun”
•
Extremely prone to user error!
•
Extremely time consuming!
•
Extremely frustrating!
•
Your developer will hate you…

19. Downsides
•
Not repeatable
•
Not verifiably correct
•
Not isolated
•
Difficult to understand
•
Slow

22. What is Vagrant?

23. “A tool for creating,
managing and distributing
portable development
environments”
- Mitchell Hashimoto (creator of Vagrant)

24. What is Vagrant?
•
Command line tool
•
Creates virtual machines
•
Handles networking and shared folders
•
Supports provisioning

25. What problems does it solve?
•
Repeatable & verifiably correct
•
Isolated
•
Understandable
•
As fast as possible

26. What problems does it solve?
•
Works on Mac, Windows and Linux
•
Works with VirtualBox, VMware and many more

27. How does it work then?
It’s magic, it really is…

28. “Vagrant reads a
Vagrantfile and builds a
virtual machine based on
a template called a box”
- Mitchell Hashimoto (creator of Vagrant)

29. Vagrantfile
“The primary function of the
Vagrantfile is to describe the type
of machine required for a project,
and how to configure and
provision these machines.”
http://docs.vagrantup.com/v2/vagrantfile/index.html

30. Vagrantfile
Vagrant::configure("2") do |config|!
! config.vm.box = "precise32"!
! config.vm.box_url = “http://.../precise32.box”!
! config.vm.hostname = "vagrant.localhost"!
!
! config.vm.network :private_network, ip: "192.168.99.100"!
end

31. Virtual machine
•
Isolated environment
•
Any operating system
•
Any installed software
•
Project specific configuration and versions

32. Boxes
“Boxes are the skeleton from
which Vagrant machines are
constructed. They are portable
files which can be used by others
on any platform that runs Vagrant
to bring up a working
environment.”
http://docs.vagrantup.com/v2/boxes.html

33. Boxes
•
Pre-installed OS
•
May contain pre-installed software
•
Custom boxes can be made

34. Provisioning

35. Provisioning
“Provisioners in Vagrant allow you
to automatically install software,
alter configurations, and more on
the machine as part of the vagrant
up process.”
http://docs.vagrantup.com/v2/provisioning/index.html

36. Provisioning
•
Shell
•
Ansible
•
Chef
•
Puppet
•
Docker
•
Salt

37. Providers
Enabling Vagrant to do its job

38. Providers
“While Vagrant ships out of the
box with support for VirtualBox,
Vagrant has the ability to manage
other types of machines as well.
This is done by using other
providers with Vagrant.”
https://docs.vagrantup.com/v2/providers/index.html

39. Providers
•
VirtualBox
•
VMware
•
AWS
•
Rackspace
•
Digital Ocean
and many more…

40. Change providers dynamically
vagrant up --provider=vmware_fusion
vagrant up --provider=digital_ocean

41. Does this really make a
developers life easier?

42. YES!

43. Old situation
•
Setup script
•
The über README file
•
“Good luck, have fun”
or any other manual way of configuring…

45. Vagrant is more like…

46. Get started with a Vagrant project
git clone repository.git folder!
cd folder!
vagrant up

48. What did Vagrant do
in the background?

49. The vagrant up command
•
Check if the box is already downloaded
•
If not, download the box
•
Start the VM
•
Set up synced folders
•
Set up networking
•
Start provisioning

50. Your new VM is ready
vagrant ssh
vagrant halt
vagrant destroy

51. Your new VM is ready
•
Some examples of what ‘ready’ means:
•
Nginx installed
•
PHP installed
•
MySQL installed
•
WordPress installed
•
Database imported
•
wp-config.php file set up

52. From development and
testing to production
Using Vagrant to its full potential

53. Vagrantfile in version control
•
Commit your Vagrantfile
•
Share it with all developers
•
Commit a change, all developers benefit

54. Share the provisioning
•
Provisioning files into version control as well
•
Production server shares the provisioning files
•
•
Use parameters/flags for differences
Change one, all environments will change

55. … and this is only
the beginning

56. Advanced use cases
Now we’re talking!

57. Plugin testing
•
Stable version
•
Development version
•
Combine those two on stable/dev WordPress
•
Four local websites per plugin

58. Multiple PHP version testing
•
One Vagrantfile
•
Multiple machines
•
Different PHP versions
•
One shared set of files
•
One database
http://wordpress.org/about/stats/

59. Integrate useful tools
•
WP-CLI
•
REDIS
•
Xdebug
•
Memcache
•
WebGrind
•
Your own dotfiles

60. All going a little too fast?
No worries

61. Vagrant has great documentation
•
http://docs.vagrantup.com/v2/
•
Plenty of examples
•
Great pointers to providers and provision resources
•
Vagrant is the latest trend

62. Varying Vagrant Vagrants

63. Varying Vagrant Vagrants
•
https://github.com/10up/varying-vagrant-vagrants
•
Ready to use Vagrant setup
•
Really easy to expand
•
Quickly launch new local development websites
•
Automatically installs: WP-CLI, Nginx, MySQL, PHPFPM, Memcache, Xdebug, Imagemagick, PHPunit,
Composer, NodeJS, Grunt, WebGrind and much,
much more, all on one Ubuntu 12.04 VM.

64. Let’s make the world a better place
for developers
!
Start using Vagrant

65. Questions?
Now, or come find me later!
!
@CoenJacobs
http://coenjacobs.me

66. Photo credits
1. http://www.flickr.com/photos/tinali778/2947963220/
2. http://www.flickr.com/photos/naan/2948047370/
3. http://www.flickr.com/photos/riebart/4466482623/
4. http://www.flickr.com/photos/55915190@N00/2302651444/
5. http://www.flickr.com/photos/l2f1/4895151918/
6. http://www.flickr.com/photos/basykes/490907537/
7. http://www.flickr.com/photos/whiskeytango/2098182380/
8. http://www.flickr.com/photos/chr1sp/5942681564/
9. http://www.flickr.com/photos/5wa/6109494115/
10.http://www.flickr.com/photos/msimdottv/4339697089/