You Can Set Up A

WordPress Dev Environment



WordCamp Bawlmer
Oct 14, 2017

You may be familiar with ...

Windows BSOD circa Win XP

Goals For This Session

  • Create environment on a Windows 10 box with ...
  • Familiar Windows UI
  • Robust toolset
  • Easily duplicated
  • Low cost
  • Includes features:
    1. Local build & testing
    2. Smart file editing
    3. FTP connection to host server
    4. Version Control & Deployment

This is What I Have On My Desktop

  • Local by Flywheel - LAMP stack
  • Visual Studio Code - editor
  • FileZilla FTP
  • Git - version control
  • WP Migrate DB - deployment

Who am I and why am I up here?

  • 40+ years in IT
  • Beginning with software and now returning to it
  • Freelance web developer and business owner
  • Started with Microsoft -
      Why change now?

Today's Development Environment

Local by Flywheel -

Editor Preference - Visual Studio Code

  • Free
  • Open Source
  • Runs Everywhere

FTP Client - Really?

  • Yes - I insist!
  • FileZilla - Just get it
  • No editing files using the dashboard editor


No Editing themes, plugins, or
any source from the admin dashboard.
Add to
above the
/* That's all, stop editing! */

Local By Flywheel (LBF)

  • Quick Windows Install
  • Uses .NET, VirtualBox, Docker
  • Includes database utility, SSL cert authentication, Email handler
  • Installs additional support utilities

Creating A New WordPress Site with Local

  • "Live" Demo
  • Build new site
  • See environment tools
  • Access WP Admin
  • See new site

Demo: Adding New Site on Local

Local Dev Environment Exists on Windows

What does it look like and what do I do with it?

WordPress Lives on Windows

New WP Site folder structure on C:\

Editor - Visual Studio Code

Code Editing / Development

  • Right Click LBF Admin "Show Folder"
  • Open Local Project Folder VSC
  • Edit Source - PHP, CSS, JS
  • Create files/folders
  • Drag/drop files & folders
  • Intellisense - Code aware - syntax highlighting, auto-complete
This is what we're talking about

VSC - Open website project folder

VSC - Browse to theme folder

Complete file structure open for editing.

Test Changes

  • Edit & Save files
  • Browser Refresh
  • Repeat ad nauseam

A Little Deployment Anyone?

Basic Assumptions:

  • New WordPress Installation Exists on Host
  • WP Migrate DB Installed and Activated
    on local and remote sites
    • Migrate DB Pro handles handshake
    • Authenticates connection
    • Uploads DB to staging / live server
    • Performs Search & Replace on db
  • Upload wp-content folder via FTP
Waving of Hands
Magic Deployment Happens

Deployment Magic with
WP Migrate DB

Create New Migration Profile

Push Local db to Password Protected Remote

Connect Successful. Search & Replace Set Automatically

Migration in Progress

Migration Completed

Dull FTP Upload of WP-CONTENT

  • FileZilla
  • SFTP/FTP connection to remote site
  • Drag WP-CONTENT from local to remote


Lather · Rinse · Repeat

Time For A Little Control

  • Git Version Control
  • Create a local repository
  • Add your project folder

Remainder of Git process
  left as an exercise for the viewer after a quick "live" demo

Git Integrated with Visual Studio Code Demo

  • Init repo from VSC
  • Stage all changes - all files
  • Use a .gitignore to limit files under control
    • Theme / Child theme
    • Custom plugins

Demo: Git with Visual Studio Code

It Is Happening

Even if it sounds quiet at your local WordPress technical gathering ...

Wrapping It Up

You CAN setup a nice WordPress dev environment on Windows

  • Local Server: Local by Flywheel
  • Editor: Visual Studio Code
  • FTP Client: FileZilla
  • Source Control: Integrated Git
  • Deployment: WP Migrate DB


Matt Ryan

[email protected]

Q's ???