Level Up Your Coding - WCFI 2020

Many developers know to NEVER do changes directly on a live website, lest we break it.

What if though, you don’t have access to a staging or development environment? Or even if you do, what happens if you are in a situation where you do not have reliable internet access! Local development environments to the rescue!

We’ll touch on why it’s so important, and discuss the plethora of options available. Please note all examples will be shown from a Mac OS, but environments for Linux and Windows will be discussed.

Transcript

1. PRESENTATION TITLE | 1 KANOPI STUDIOS Level Up Your Coding The Whys and Hows of Local Development WordCamp Finland | November 2020
2. PRESENTATION TITLE | 2 This session is for you if... • You want to develop smart • You don’t want to break things • You are planning to go build a website in the middle of nowhere without internet available • You are curious about the mindset of a developer
3. KANOPI STUDIOS PRESENTATION TITLE | 3 3 WordPress Development, Karate, Latin Ballroom Dancing, and Clarinet Playing Currently working on how to do them all simultaneously miriam@kanopi.com Miriam Goldman Technical Lead
4. The What What exactly is a local environment?
5. KANOPI STUDIOS LEVEL UP YOUR CODING | 5 A Server on Your Computer A local environment is like having a server on your computer. You can create any sort of web application, and it will run the full stack.
6. The Why Why should I have a local development setup?
7. KANOPI STUDIOS LEVEL UP YOUR CODING | 7 But why local development? NO HOSTING NEEDED (yet…) Hosting costs money, and there are plenty of options. If you are undecided on your host - you aren’t held back from starting to create your magic. NO BREAKING LIVE WEBSITES Doing development on a live website is always dangerous - you run the risk of breaking the whole site, or even worse, the whole server. NO INTERNET CONNECTION NEEDED Development will be faster, as no internet connection is needed. If you have power, and you have a place to sit - you can work on your website.
8. The How Cool, I get it. But how do I do this?
9. KANOPI STUDIOS LEVEL UP YOUR CODING | 9 COMMAND LINE Are you comfortable with code? There are options that are command line based - allowing you to work within Terminal or Console. GUI (Graphical User Interface) Not as comfortable with code, or just like having a more graphical interface? Prefer things to happen with “just a few clicks”? You’re covered.
10. Options This is really what I came for!
11. Docksal Command line based
12. KANOPI STUDIOS LEVEL UP YOUR CODING | 12 Docksal Based off Docker. https://docksal.io/ ─ Compatible with Windows, MacOS, and Linux ─ MacOS has the option to run within a VM ─ Comes with wp-cli support ─ Fully customizable, allowing for different images to be installed
13. Vagrant Command line based
14. KANOPI STUDIOS LEVEL UP YOUR CODING | 14 Vagrant https://www.vagrantup.com/ ─ Compatible with Windows, MacOS, and Linux ─ Used to manage the lifecycle of virtual machines ─ Has the ability to share your machine ─ Compatible with VMWare ─ VVV (Varying Vagrant Vagrants) - a WordPress focused Vagrant configuration
15. MAMP/WAMP/XAMPP Full stack server
16. KANOPI STUDIOS LEVEL UP YOUR CODING | 16 MAMP WAMP XAMPP ─ (M/W/X) - Mac/Windows/Cross Platform, (A) - Apache, (M) - mySQL/maria DB, (P) - PHP, (P) - Perl ─ Can also be used to host websites online, not just local ─ Needs a bit more configuration ─ MAMP Pro costs money
17. Local by Flywheel GUI
18. KANOPI STUDIOS LEVEL UP YOUR CODING | 18 Local ─ GUI Interface ─ Easy to switch between WordPress, mySQL and PHP versions ─ Can support SSL on your machine ─ Easy to import your sites ─ Share your site via ngrok ─ Uses containers
19. DesktopServer GUI
20. KANOPI STUDIOS LEVEL UP YOUR CODING | 20 DesktopServer By ServerPress https://serverpress.com/ ─ GUI Interface ─ Spin up in seconds ─ Can support SSL on your machine ─ Premium version supports multiple features
21. Plus more!
22. KANOPI STUDIOS LEVEL UP YOUR CODING | 22 Many more... ─ Lando ─ Homestead ─ Plus other smaller projects
23. Docker Why should we use it?
24. KANOPI STUDIOS LEVEL UP YOUR CODING | 24 EMULATE PROD You can set up specific containers to mimic your production environment locally 1 Docker for Development
25. KANOPI STUDIOS LEVEL UP YOUR CODING | 25 EMULATE PROD You can set up specific containers to mimic your production environment locally 1 2 ISOLATION Everything isn’t bundled. You can build images for the web, for your database, and for anything CLI Docker for Development
26. KANOPI STUDIOS LEVEL UP YOUR CODING | 26 EMULATE PROD You can set up specific containers to mimic your production environment locally 1 2 ISOLATION Everything isn’t bundled. You can build images for the web, for your database, and for anything CLI 3 SPEED Less dependencies means faster spin ups. You aren’t waiting for any human interaction. You also use fewer resources. Docker for Development
27. KANOPI STUDIOS LEVEL UP YOUR CODING | 27 EMULATE PROD You can set up specific containers to mimic your production environment locally 1 2 ISOLATION Everything isn’t bundled. You can build images for the web, for your database, and for anything CLI 3 SPEED Less dependencies means faster spin ups. You aren’t waiting for any human interaction. You also use fewer resources. 4 COLLABORATION If you want to collaborate with others, you can just share your containers, and make collaboration much easier. Docker for Development
28. Docksal Why do I like it so much?
29. KANOPI STUDIOS LEVEL UP YOUR CODING | 29 Docksal Why do I like it? ─ Open Source project ─ Good for teams ─ Share your site ─ Not opinionated ─ Actively supports recent PHP versions ─ Debug tools built in ─ Quick to provision
30. Demo Time! Live demos work better virtually, right?
31. Next Steps What do I do from here?
32. KANOPI STUDIOS LEVEL UP YOUR CODING | 32 CENTRAL REPOS GitHub, Gitlab, or BitBucket allow you to store your code in a central place GET HOSTING You want to showcase your website? Make sure you have a hosting provider. CI/CD Provides a way to get your repo and your hosting to talk to each other. What do I do from here?
33. KANOPI STUDIOS LEVEL UP YOUR CODING | 33 KANOPI STUDIOS Thank you! Reach out anytime. miriam@kanopi.com @mirigoldman