Create a local WordPress Development Environment

local WordPress development environmentDifferent environments are important to allow phased release, testing, and rollback in case problems arise. Create a local WordPress development environment on your computer to allow you to quickly and easily keep the environments separate. The most common headache with setting up a WordPress local environment is configuring all the sub-systems that are needed to actually RUN the website.

To simplify it, you’ll need Apache, MySQL, PHP, WordPress install, a powerful IDE to manage your code, and local version control. I’ll show you how to easily set up a simple working environment in one lazy afternoon.

 

Step 1 – Install Bitnami WordPress Stack

Bitnami is an application that quickly and easily installs server software where you need it. They also offer cloud hosting if you need to migrate your project online. I love using Bitnami because they can save you so much time and have some great admin tools.

Bitnami WordPress StackDownload the latest Bitnami WordPress stack. A ‘stack’ is a one-click install bundle that installs and configures the group of software for you. It ensures that the primary application is installed with the needed support applications as well. In our case, we are installing Apache, MySQL, PHP, AND WordPress with a single install dialog. You can’t really get any more simpler that that!

Navigate through the dialog and you’ll be greeted with your WordPress ‘Welcome’ page. Congrats, you now have installed WordPress on your machine and you’re on your way to create a local WordPress development environment.

Bitnami WordPress Installed

Now lets get you something to develop against it.

 

Step 2 – Install NetBeans

NetBeans is an open source IDE that has a lot of powerful features. Primarily a Java IDE, NetBeans also offers tools for developing PHP. It’s 100% free and can be used to tackle almost any project your can throw at it. Head over to their website to download the latest NetBeans IDE.

NetBeans IDE

Install the IDE by going through the dialog prompts. Once you’ve installed NetBeans, open the IDE and lets create our first WordPress project.

 

Step 3 – Add your WordPress site to NetBeans

After you’ve opened NetBeams, we’re going to point it to the location that you’ve installed WordPress. If you’ve reached this far, you should have some familiarity of the files that are installed with WordPress.

If you have installed BitNami with a default C:\ drive install, your WordPress files will be located here:

C:\Bitnami\wordpress-4.4.1-0\apps\wordpress

My version of the Bitnami Stack is 4.4.1 and yours might differ slightly.

In BitNami, select File > New Project. Chose the second option within the PHP category to open an existing source. Click Next.

NetBeans_NewProject_existing

Browse to the location of your BitNami install to the root WordPress location. We’re going to be grabbing Everything!

Name your project whatever you want. You can click Finish or continue to the next screen to run custom configuration.

NetBeans_NewProject_existing_1

When you have added your files, you will see the full source list in your project tree. Everything that you do within this project will be applied to your WordPress site. So go ahead and create your theme, plugin, or anything else you’d like.

Looks like my project already has a few problems…..

NetBeans_NewProject_existing_2

After your project is successfully added, we need to add some version control to your work.

 

Step 4 – Configure Version Control

Version Control is important to your work and a Development Environment. It helps you create a ‘bookmark’ to where you are and allows you to try new things from different points in your project. Its always a good idea to branch and merge after successfully implementing different components rather than waiting until your entire project is completed. You never know when you may need to roll something back…

GitHub Remote Version ControlNetBeans has pretty good documentation on how you use Git in the NetBeans IDE. Now, if you want to be all fancy and whatnot, you can also use GitHub as your remote repository. NetBeans allows you to do remote Push and Pull requests of your code with a few extra steps.

Right click on your Project Name to initialize a repository.

NetBeans_GIT_1

Right Click > Versioning >Initialize Git repository…

You will be promoted to select a location to house the repository. Save the repo in a location that is secure and can be restored if your computer crashes or data become compromised.

NetBeans_GIT

To save a file or directory to the repo, Right Click > Git > Commit…  This adds the file or directory to your repository directory. explain what you’re looking at.
NetBeans_GIT_2

On the prompt that displays, select the files that have been modified to commit them to the repo. Add a quick comment to help make sense of your code.

And that’s about it! Your new local WordPress development environment is set up to knock out an awesome WordPress theme, plugin, or vanilla PHP site.

What type of development do you do with WordPress or PHP? What tools do you use? Leave me a comment below!

 

References

 

 

One thought on “Create a local WordPress Development Environment

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.