Local WordPress Development. Why and what’s the easiest way to set it up?

When I work on coding websites, I build them locally on my MAC and push the files on to the live site when its prime time ready. It’s a very popular practice to build websites this way.

Here are a few reasons why local WordPress development is the best:

1. You have a private copy that you can experiment without the world seeing all your changes if you are designing in the browser.
2. You can test out WordPress themes and plugins, update widgets, and the menu with no risk of breaking the live site. It’s easy to troubleshoot WordPress errors as well.
3. Your development-editing the files and testing out the changes- will be super-fast. Because all the HTTP requests are going to the files on your machine and not on a server somewhere on the internet.
4. You can work offline from anywhere even when you don’t have internet access – yes even on those long plane rides.
5. When you are working on a redesign of a huge site, it going to take many days or weeks to complete the development. You don’t want to leave the live site looking half baked especially if you get a lot of traffic to your live site.
6. You can use Sass preprocessor during the development which makes writing CSS a lot easier and faster. Maintaining the CSS code will be easier with Sass, as your project grows and becomes more complicated.
7. If you have multiple developers working in a team, you can use version control. You can merge your changes with the other developer’s code and test it thoroughly before deploying it to the live site. This will also give you a record of what changes were made, when and by whom in case you want to trace back any development issues later.

Now that you’ve decided to set up a local dev environment for WordPress development, there are several tools to help you with that. There is Vagrant, Docker, WAMP/MAMP depending on whether you are on a PC/MAC.

For years I used MAMP to set up the local dev environment and it worked ok for a while. But as I started to build a lot of websites I felt it was time-consuming to set up and also tedious when going back and forth between the different websites I was working on locally. It was also slowing down my machine as the number of websites grew.

Enter Local by Flywheel. This tool makes setting up the Local WordPress dev environment easy-peasy.

The UI is clean and simple and extremely user-friendly. It also has a ton of cool features that will cut short your development time a great deal. Its available for MAC and Windows. And It’s completely FREE.

Here’s how to set up Local By Flywheel:

• Go to the url https://local.getflywheel.com/.

• Select MAC/Windows and add in your user information.

• Click ‘Get It Now’ to start the download.

• The download size for Local is about 500MB, so make sure you have the space available. This takes a while, enough time to make yourself hot masala chai!

• Once the download is complete, go to the downloads folder on your MAC/PC, find the zip file, unzip it and select to open up the installation screen. Click the ‘Lets Go’ button to start the installation.

• The installation process will take a few minutes- enough time to take a few sips of your masala chai and savor it.

• Once the installation is done, you’ll see a screen that prompts you to ‘Create a New Site’.

• Give the new site a name based on your client. Since I’m starting off a new site development for a University, I’m calling mine Camden University.

• Clicking on the ‘Advanced Options’ link will give you additional information about your local site setup. Note down the entry in the ‘Local site Domain’ field. This is the URL you will use to view your site in the browser. Note that Local appends ‘.local’ to your site name which makes it easy to scan the browser tab and see if you are on the local or the live site. Click ‘Continue’ to go to the next screen.

• By default, Local will setup the Nginx web server, PHP 7.29, and MySQL. If for any reason you want to vary the environment, you have to click the ‘Custom’ option. But for now, we will select the ‘Preferred’ option and click ‘Continue’.

• Create a username/password and provide a valid email address. Make sure you take note of this username and password as you will be using this to login to your new local site’s WordPress admin as you start the development. Click ‘Add a site’.

• This will take a few minutes. Once it’s done, you now have a local version of the WordPress development up and running. It’s that easy! The best part of Local is that it not only does the WordPress installation, it also completes the database setup which is a huge time saver.

Using Local:

• To make sure your website is running, use the toggle button in the upper right-hand corner that will START And STOP the site.
• View the site by clicking on the ‘View Site’ button. This will open a new browser tab with the URL of your local WordPress site (the one you noted in Step 9).

• The address bar gives the local URL for the site- in this case, ‘http://camden-university.local/’
• To go to the WordPress dashboard, click the ‘Admin’ button, and enter the username and password from Step 11 in the setup instructions.
• To find out where the website files are actually stored on your machine, go to the Local app’s window. under Local Sites- find your local website name. Right-click and select ‘Reveal in Finder’ on Mac. It will open up your finder window and point to the location where the files are located on your machine. It’s usually your user accounts home directory /Local Sites. The actual WordPress files are under the app/public inside your site name folder.