Express Wordpress theme and plugin development environment

Michał Rączka
4 min readMay 12, 2016

--

Do you need to develop a new Wordpress theme or plugin? Just brew you espresso to warm your mind and let Dockerpresso set your development environment :)

The problem

Right now I’m starting few new Wordpress based projects and I wanted to systematize their development environments. After switching to Docker, I use it for every project, which gives me full isolation between applications and their technological stacks. Before, when I defined application runtime in Vagrantfiles I soon ended with disk full because of virtual disks.

Today I have one Vagrant run VM with Docker installed there and that’s it. Everything else is done at an application level. Thanks to Dockerfile and Docker Compose (and crane previously) I can attach application runtime configuration to the code. There are third-party libraries dependencies in composer.json, bower.json, package.json why not have operating system level configuration dependencies in docker-compose.yml?

The alternative

While seeking for an existing solution for the problem I’ve checked official Wordpress Docker image and project called Wocker marketed as “Docker-based rapid development environment of WordPress”.

The official Wordpress image is basically a configured PHP runtime and includes selected version of Wordpress inside. It comes with a bash script which copies the Wordpress codebase when needed and inserts Docker set environmental values in wp-config.php file and then creates MySQL database when needed. Very nice, very helpful, but all the “seds” and “awks” looks quite complex. What’s worse it uses link environment variables which are deprecated. Except the script there is nothing more to support development process, e.g. migrating data from production environment or seeding database.

The Wocker is presented as a tool which I need. It is Docker-based but it is installed as a Vagrantfile so I would need to have one Vagrant for Wordpress based projects and another Vagrant for every other project. Another point of complication which I would like to avoid.

I think these both tools are very valuable and they are best to use at some specific cases. But I need something else.

The solution

The longer I work as a web developer the more I’m concerned with the aspect of level separation. I would say that any good architecture design should involve level separations based on a contract between different layers of an application. A tool for a “express Wordpress development” it’s not a big thing but for sure a thing which would benefit from a scalable architecture. Wordpress development on Docker which is run on a Vagrant machine involves a lot of different layers. The layer of infrastructure — Vagrant (could be a bare metal machine with Linux), a layer of container, application runtime (could be a Wordpress shared hosting), then the platform layer — the Wordpress, where, on top of that technological pile one can run his or her plugin or theme. I needed a way to separate concerns in this stack.

I decided that the solution should not interfere with the infrastructure layer (as Wocker does). It should run wherever Docker runs. So it should be implemented as a set of Docker images. So far so good, but I need a toolset to manage Wordpress and the workflow I need while developing a new component. I could start creating bash scripts for every procedure in the process, but they won’t create a consistent framework, and instead of focusing on Wordpress development I would focus on bash scripts, it’s not the point.

Especially when there is a fantastic, complete and scalable tool for a Wordpress management — WP-CLI.

I’m there! So I need one main Docker image which will generate a docker-compose.yml for every new Wordpress based project. Then through docker-compose “layer” I can control other elements, two services to run a Wordpress installation and — most importantly — a service for installation management. This service is build on top of WP-CLI and is the main part of the Dockerpresso project. It’s called dockerpresso-cli and allows you to run every WP-CLI command. There is still one more element lacking. Something that the entrypoint script in official Wordpress image does — prepare wp-config.php file to work with environmental variables set for Docker containers. Since it’s done on the platform layer in Wordpress code I decided to implement it using WP-CLI package system. That idea caused wp-cli-environmentalize to be created. This is a simple plugin which makes a Wordpress installation working with environmental variables and is compatible with MySQL/MariaDB official Docker images environmental variables naming (oh, and for Dockerpresso stack I’ve chosen latter).

Tutorial

Let’s say you would like to start new theme called Themepresso! It would take something like this:

$ mkdir -p themepresso/src # all theme files will be put in src subdirectory
$ cd themepresso
$ docker run --rm -v `pwd`:/project michaloo/dockerpresso
$ vim docker-compose.yml # add "- ./src:/var/www/html/wp-content/themes/themepresso" there
$ bash dockerpresso init # it will download new wordpress and "environmentalize" it
$ vim .env # adjust environment settings
$ bash dockerpresso up # start the main services
$ atom src # start your favorite editor and start developing the theme

More info on Dockerpresso Github page.

--

--