Stop wasting time setting up your local environment and start developing.
Today I want to share with you how I set up my local WordPress with Docker-Compose. Hopefully you can get some use out of it.
As the first step of the Modern WordPress Project We are going to start setting up our local WordPress Multisite environment with Docker and Docker-Compose. This will allow us to start our WordPress locally in a few steps.
Download Docker on your Mac or PC: https://www.docker.com/products/docker-desktop
Once you have downloaded and installed the Docker desktop let’s jump to Step 2 :
Create a new folder for Modern WordPress Project anywhere in your hard drive. For example mine is in:
now please create a new file in this folder called: docker-compose.yml
Step 3: Copy this code into your docker-compose.yml file:
version: '3.3' services: # Database db: image: mysql:5.7 container_name: mysqldb volumes: - db_data:/var/lib/mysql restart: always environment: DB_HOST: localhost MYSQL_ROOT_PASSWORD: password MYSQL_DATABASE: wordpress MYSQL_USER: wordpress MYSQL_PASSWORD: wordpress networks: - wpsite ports: - "3306:3306" # phpmyadmin phpmyadmin: depends_on: - db image: phpmyadmin/phpmyadmin container_name: phpmyadmin restart: always ports: - '8080:80' environment: PMA_HOST: db MYSQL_ROOT_PASSWORD: password networks: - wpsite # Wordpress wordpress: depends_on: - db image: wordpress:latest ports: - '80:80' restart: always container_name: modern_wordpress volumes: ['./public/:/var/www/html'] environment: WORDPRESS_DB_HOST: db:3306 WORDPRESS_DB_USER: wordpress WORDPRESS_DB_PASSWORD: wordpress WORDPRESS_CONFIG_EXTRA: define('WP_ALLOW_MULTISITE', true ); hostname: modernwordpress.com.local labels: com.theimpossiblecode.expose.domain: "modernwordpress.com.local" com.theimpossiblecode.expose.domainIsHost: "true" com.theimpossiblecode.expose.subdomainHosts: "de at it" networks: wpsite: aliases: - modernwordpress.com.local networks: wpsite: volumes: db_data:
Let me explain a few things about this file ^
As you can see at line 50 there is a hostname. That means we will have a local domain for our project also with subdomains (modernwordpress.de.local, modernwordpress.at.local). Later on we will have to add this domain to your host file.
There is a service called phpmyadmin. Once we start this setup you are able to login to phpmyadmin using the port 8080. This makes things much easier if we need to do any changes to the database.
Open up your terminal and navigate to the folder where you created docker-compose.yml and run this command:
docker-compose up -d
It will take a minute to create all the containers and volumes.
Once it is ready you will see a folder called ‘public’ created in the root folder. This is where the WordPress code lives.
Ok now I’m tired of all the steps. Let’s test this:
Open your browser and navigate to http://localhost:8080/
You should see the phpMyAdmin login screen. You can login to the database using username: wordpress and password: wordpress.
And now the magic: If you navigate to http://localhost/ you will see the WordPress installation screen. But wait a minute. Earlier we said we are going to use a custom local domain for this. Yes, let’s complete the setup.
Open the terminal and open your hosts file using vi /etc/hosts. (If you are on a Mac)
Add these domains to your host file:
127.0.0.1 modernwordpress.com.local 127.0.0.1 modernwordpress.de.local 127.0.0.1 modernwordpress.at.local 127.0.0.1 modernwordpress.it.local
After you’ve done this, let’s try to navigate to the main domain: http://modernwordpress.com.local/ 🎉
Congratulations! You successfully set up WordPress using Docker-Compose.
You can download the full code in github. https://github.com/malithmcr/wordpress-docker-multisite
Modern WordPress Project: Learn to build full stack websites using headless WordPress and Next.JS.
Thank you everyone for reading. Feel free to leave a comment if you have any feedback.