Skip to content

Configure a local WordPress development using Docker

One of the most popular articles on my website is “Configure a local WordPress development on macOS from scratch”. I have recently used Docker a lot so I decided to tackle the same subject again but this time using containers.

Wordpress and Docker websites

This is not a Docker tutorial although by following along you learn how helpful this tool can be. I highly encourage you to familiarize yourself with few basic concepts like: images, containers, networks and volumes. Having a Docker app installed makes a lot of sense too. Regular readers know that I am a great friend with Homebrew. Yes, you can use it to download Docker too.

brew cask install docker

Wordpress + MySQL + phpMyAdmin #

To comfortably work with WordPress in a bare-bones local environment two components are required, although a third one is nice to have in some circumstances.

  1. WordPress
  2. MySQL or MariaDB database
  3. Database GUI like phpMyAdmin (optional)

Wordpress + MySQL + phpMyAdmin

Docker compose is a tool for creating multi-container Docker applications defined using single docker-compose.yml file (.yml and .yaml extension works just fine). Sounds like a fantastic method to connect our three building blocks together. I will do my best to provide helpful descriptions and comments to each of the core building blocks. Start by making a new directory for your website, create a docker-compose.yml in there and let’s finally get into the meat of this article.

mkdir wp && cd $_ && touch docker-compose.yml
# Version of the Compose file format
# Version 3 is the most current and recommended one
version: "3"

# Top building block that defines
# All containers used for this service
services:

  # Container 1
  # https://hub.docker.com/_/mysql
  db:
    # Image name (optinally version)
    # https://docs.docker.com/compose/compose-file/#image
    image: mysql:5.7
    # Define restart policy
    # https://docs.docker.com/compose/compose-file/#restart
    restart: always
    # Volumes definition
    # Named volume, allows persisted data but without caring where locally it is stored
    # https://nickjanetakis.com/blog/docker-tip-28-named-volumes-vs-path-based-volumes
    volumes:
      - db_data:/var/lib/mysql
    # Add environment variables
    # https://docs.docker.com/compose/compose-file/#environment
    environment:
      MYSQL_ROOT_PASSWORD: password
      MYSQL_DATABASE: wordpress
      MYSQL_USER: wordpress
      MYSQL_PASSWORD: wordpress
    # List of networks to join
    networks:
      - wp

  # Container 2
  # https://hub.docker.com/_/wordpress
  wordpress:
    # List of dependencies
    depends_on:
      - db
    # Image name (optinally version)
    # https://docs.docker.com/compose/compose-file/#image
    # Feel free to add a version of WordPress
    # I.e. wordpress:5.2.0
    image: wordpress
    # Define restart policy
    # https://docs.docker.com/compose/compose-file/#restart
    restart: always
    # Volumes definition
    # https://docs.docker.com/compose/compose-file/#volumes
    # Maps your local folder, to path in a container
    # Useful for file edits
    # I like to map only wp-content
    # We should not care about WP core files
    volumes: ["./:/var/www/html/wp-content"]
    # Add environment variables
    # https://docs.docker.com/compose/compose-file/#environment
    environment:
      WORDPRESS_DB_HOST: db:3306
      WORDPRESS_DB_USER: wordpress
      WORDPRESS_DB_PASSWORD: wordpress
    # Ports mapping
    ports:
      - 80:80
      - 443:443
    # List of networks to join
    networks:
      - wp

  # Container 3
  # https://hub.docker.com/r/phpmyadmin/phpmyadmin
  # This one is optional
  phpmyadmin:
    # List of dependencies
    depends_on:
      - db
    # Image name (optinally version)
    # https://docs.docker.com/compose/compose-file/#image
    image: phpmyadmin/phpmyadmin
    # Define restart policy
    # https://docs.docker.com/compose/compose-file/#restart
    restart: always
    # Ports mapping
    ports:
      - 8080:80
    # Add environment variables
    # https://docs.docker.com/compose/compose-file/#environment
    environment:
      PMA_HOST: db
      MYSQL_ROOT_PASSWORD: password
    # List of networks to join
    networks:
      - wp

# Top building block that defines
# All networks used for this service
networks:
  wp:

# Top building block that defines
# All volumes used for this service
volumes:
  db_data:

That’s it — time to build our stack! Bear in mind that when you run it for a first time it is going to download all necessary stack images. Every subsequent invocation is going to be almost instant.

docker-compose up -d 

Run docker-compose command to spin up a WordPress website

Voilà! #

Hopefully you found this helpful. This simple setup helps me a lot to spin up a new WordPress from scratch in absolutely no time.

Ps. For simple websites like this one don’t use Wordpress. Use Hugo instead :)

Comments

  • G
    Gaurav Kakkar

    Hey - Thanks for the nice write, its been helpful. I was windows for a long time and using wamp for my wordpress sites and thinking to switch over to docker now. Wanted to know your experience with the docker in comparison to standalone php-apache-mysql setup. Which one do you use? and does each of your wordpress site have a separate docker-compose file? or there is only one docker-compose file you use and have all your sites inside it.

    👆 you can use Markdown here

    Your comment is awaiting moderation. Thanks!
    • Pawel Grzybek
      Pawel Grzybek

      Docker all the things :)

      For each project I create new Docker compose file.
      Hopefully that helps.
      Have great day 🥑

      👆 you can use Markdown here

      Your comment is awaiting moderation. Thanks!
  • M
    Mohammad Faizyab

    On the screen where we have to put database details, what hostname should I put for mysql?

    👆 you can use Markdown here

    Your comment is awaiting moderation. Thanks!
    • Pawel Grzybek
      Pawel Grzybek

      That should come preconfigured when you set it up like I did. The piece of config that decides about it is this:

      WORDPRESS_DB_HOST: db:3306
      WORDPRESS_DB_USER: wordpress
      WORDPRESS_DB_PASSWORD: wordpress

      👆 you can use Markdown here

      Your comment is awaiting moderation. Thanks!
      • M
        Mohammad Faizyab

        Thanks for reply, I am asking about this screen. What information should I put here... https://uploads.disquscdn.c...

        👆 you can use Markdown here

        Your comment is awaiting moderation. Thanks!
  • F
    Francesca Haselden

    What do I do if the ports are already in use? I attempted to kill the ports used but was not able to, so I tried changing them in the config file but still couldn't get this to run.

    👆 you can use Markdown here

    Your comment is awaiting moderation. Thanks!
  • k
    kam1ll0

    Hi Pawel! Thanks for nice starting point to create WordPress in seconds but I have question.. I'm using PhpStorm and when it only showing all from `wp-content` directory PhpStorm does not hint the core functions because there are not in project. Do you know how to configure it to use the function hints?

    👆 you can use Markdown here

    Your comment is awaiting moderation. Thanks!
    • Pawel Grzybek
      Pawel Grzybek

      Hi.

      I see what is going on. I am affraid that in this case you have to expose a project root level in your volume ["./:/var/www/html"] to make PhpStorm correctly infer WP core methods. I am not a PhpStorm user and potentially there is a much better way. Sorry for being not too helpful.

      Have a great day 🥑

      👆 you can use Markdown here

      Your comment is awaiting moderation. Thanks!
  • J
    João Colucas

    Hi Pawel! Nice tutorial, thanks! Question though - how would you mount php.ini ? I'm using Ubuntu on WSL.

    👆 you can use Markdown here

    Your comment is awaiting moderation. Thanks!
  • D
    Dusan Stojanovic

    Great tutorial. However, I also need .htaccess file on my wp folder because some plugins and also WP itself is changing it. How to do that?

    👆 you can use Markdown here

    Your comment is awaiting moderation. Thanks!
  • A
    Adam Nielsen

    Hi Pawel, thanks a lot for this tutorial. I followed your steps, but I cant edit the files of the volume. They all have user `www-data` while my user is adam. File permission is 644, so I can't even edit them, if I add `www-data` group to `adam`. Any advice how to fix it? Also asked this here: https://stackoverflow.com/q...

    👆 you can use Markdown here

    Your comment is awaiting moderation. Thanks!
  • S
    Stas

    I recommend to try Codelobster IDE for Wordpress development - http://www.codelobster.com/wordpress.html

    👆 you can use Markdown here

    Your comment is awaiting moderation. Thanks!

What'ya think?

👆 you can use Markdown here

Your comment is awaiting moderation. Thanks!