Local development setup for WordPress using Docker && Docker Compose with Nginx - PHP-FPM - MySql - PHP MyAdmin - Mailhog - Self-Signed SSL Certificates
We should set our enviornment variables and generate our self-signed ssl certificates. If you don't want to enable ssl certificates please comment or remove the follwoing code to avoid errors. docker-compose.yml
lines: 13 and 18 - etc/config/nginx.conf
lines: 83 to the end of file
We adjust the variables in .env to suite our project the default ports are:
- Ngnix Http: 80
- Ngnix Https: 443
- PHP-FPM: 9001
- NodeJS: 3000
- MySql: 3306
- PHP MyAdmin: 8080
- Mailhog Server: 1025
- Mailhog UI: 8025
- Portainer: 8000
# Clone the repository
git clone git@github.com:samk-dev/docker-wp.git
# Navigate to docker-wp
cd docker-wp
# Rename .env-example to .env
mv .env-example .env
## Generate Self-Signed SSL Certificate ##
## This is not required if you don't need https and you did comment/remove the ssl settings ##
# Give excution permissions to the script
chmod u+x chmod u+x etc/scripts/self-signed-init.sh
# Execute the script
./etc/scripts/self-signed-init.sh localhost
from the project root run docker-compose up -d
this will build and run the containers. Prepare yourself a ☕️ because it will take some time
From any web browser access:
- Webserver HTTP - http://localhost:${PORT_NGINX}
- Webserver HTTPS - https://localhost:${PORT_NGINX} - you may get a broswer alert of an insecure content, just press proceed anyway. On chrome sometimes you may not see the proceed button anyway, you can find a fix here: Bypass invalid certificate in chrome - NET::ERR_CERT_INVALID error
- PHP MyAdmin - http://localhost:${PORT_PHP_MYADMIN}
- Mailhog - http://localhost:${PORT_MAILHOG_UI}
- Portainer - http://localhost:${PORT_MAILHOG_UI}
The variables refrenced in the examples are the values you set in .env @ project root
When running docker-compose up
the first install will already fill the db credentials for you, so if you want to modify change the wp-config settings
When installing WordPress set the email as: dev@mailhog.local
/** MySQL settings - You can get this info from your web host **/
/** The name of the database for WordPress */
define( 'DB_NAME', $MYSQL_DATABASE );
/** MySQL database username */
define( 'DB_USER', $MYSQL_ROOT_USER );
/** MySQL database password */
define( 'DB_PASSWORD', $MYSQL_ROOT_PASSWORD );
/** MySQL hostname */
define( 'DB_HOST', '<container_name>:<container_port>' );
/** Database Charset to use in creating database tables. */
define( 'DB_CHARSET', 'utf8' );
/** The Database Collate type. Don't change this if in doubt. */
define( 'DB_COLLATE', '' );
- Server: mysql:${PORT_MYSQL}
- Username: ${MYSQL_ROOT_USER}
- Password: ${MYSQL_ROOT_PASSWORD}
- Host: 127.0.0.1
- Port: ${PORT_MYSQL}
- Database: ${MYSQL_DATABASE}
- User: ${MYSQL_ROOT_USER}
- Password: ${MYSQL_ROOT_PASSWORD}
You can access any container shell by using the command docker exec -it ${CONTAINER_NAME} sh
and exit
to exit
Example by installing Sage 10 Starter Theme by the guys @ root.io:
# Access WP container
docker exec -it docker-wp-dev sh
# Navigate to wp-content/themes
cd wp-content/themes
# Install Sage
composer create-project roots/sage your-theme-name dev-master
# Navigate to your-theme-name
cd your-theme-name
# Install all the necessary dependencies to run the build process
yarn
# OR
npm install
- Install WordPress Mail SMTP Plugin
- Navigate to WP Mail SMTP > Settings and Select PHP as mailer option
- Navigate to WP Mail SMTP > Tools > Email Test
in Send To set the address to
dev@mailhog.local
as a result you'de see a warning, ignore it and check mailhog to see the email
- Inside
etc/config/wordpress.ini
changexdebug.remote_host
to your local machine ip address - Restart appserver container
docker restart appserver
if you changed the service name make sure to refrence it instead of appserver - From php/wp container shell run
php -i | grep Xdebug
you should see xdebug version ++ more information