Cómo trabajar WordPress con Docker en localhost

2 Mar 2021

7 min.

En este post vamos a crear, paso a paso, un entorno de desarrollo local con Docker optimizado para WordPress y así poder trabajar cualquier proyecto de WordPress con el sistema de contenedores que nos proporciona Docker.

¡Vamos al lío!

Lo primero, quiero definir el stack de tecnologías que vamos a usar para orquestar el proyecto con docker-compose, usaremos una por contenedor:

La ventaja de trabajar con docker-compose es que podemos distribuir el stack del proyecto por servicios y tener un control más preciso por cada contenedor. Una vez teniendo claras las tecnologías necesarias, vamos declarar un servicio por cada una de ellas en nuestro docker-compose:

mkdir dockerwp 
cd dockerwp 
touch docker-compose.yml

Servicio para Nginx

version: '3.5'
 
services:
  dockerwp_nginx:
   build: ./nginx/
   container_name: dockerwp_nginx
   volumes:
     - "./www:/var/www/html/"
   ports:
     - "8000:80"

El primer servicio que definimos es el de nginx para que actúe como servidor web, fíjate que el nombre del servicio es dockerwp_nginx y todos sus parámetros van indentados bajo él, y a su vez, todo el bloque va indentado bajo services.

Es muy importante que mantengas una correcta indentación en la estructura de tu archivo ya que de lo contrario es muy probable que tengas fallos al levantar el proyecto. También dependiendo de la versión de docker-compose que declares deberás seguir una sintaxis u otra.

Voy a ir definiendo para qué sirve cada parámetro del bloque de servicio:

Para ello, en la raíz del proyecto crea una carpeta llamada nginx y a continuación crea un fichero dentro llamado Dockerfile con la siguiente información:

FROM nginx:latest

Lo que hacemos con el parámetro build es indicarle el Dockerfile que tiene que usar para descargar la imagen.

Siempre soy partidario de mantener la integridad en los nombres de los servicios y contenedores, y por ello nombro el contenedor con el mismo nombre que el servicio. Ahora en cuanto acabemos de definir este primer servicio veremos cómo optimizar esto de los nombres

Los volúmenes nos sirven para que los datos que se guardan en ellos no se borren cuando bajemos o borremos los contenedores.

En este caso definimos un volumen para almacenar los datos de nuestra instalación de WordPress y que no se pierdan cuando el contenedor se elimine.

Archivo .env

Antes hemos comentado la importancia de mantener una integridad con los nombres de servicios y contenedores, bien, para hacer esto más llevadero y seguro, utilizaremos el archivo .env para definir variables de entorno que podremos utilizar en el archivo docker-compose.

Creamos el archivo en la raíz de nuestro proyecto:

touch .env

Y declaramos las variables que queremos utilizar:

# Project
PROJECT_NAME=dockerwp

# Nginx
NGINX_HTTP_PORT=8000

# MariaDB
DB_DATABASE=default
DB_USER=default
DB_PASSWORD=default
DB_PORT=8001

# Phpmyadmin
MYADMIN_PORT=8002

Date cuenta que he metido en el archivo todas las variables que voy a utilizar en el proyecto separadas por servicios. Bien, ahora vamos a utilizar las variables PROJECT_NAME y NGINX_HTTP_PORT para reemplazarlas por los valores correspondientes en el docker-compose, quedando así el servicio de nginx:

dockerwp_nginx:
   build: ./nginx/
   container_name: ${PROJECT_NAME}_nginx
   volumes:
     - "./www:/var/www/html/"
   ports:
     - "${NGINX_HTTP_PORT}:80"

Una vez hecho esto, vamos a probar nuestro contenedor de nginx, para ello ejecuta:

docker-compose up --build

El parámetro –build es para que se compilen las imágenes antes de iniciar los contenedores

Y accede en tu navegador a http://localhost:8000, si todo ha ido bien, deberías estar viendo la Start Page de Nginx:

Servicio para PHP

Seguimos definiendo servicios en nuestro docker-compose, vamos con el contenedor de PHP:

dockerwp_php:
   build: ./php/
   container_name: ${PROJECT_NAME}_php
   volumes:
     - "./www:/var/www/html/"

Tal y como hemos hecho para la compilación de imagen el servicio de nginx, creamos una carpeta llamada php con un fichero Dockerfile que tenga la siguiente información:

FROM php:7.3-fpm
 
RUN docker-php-ext-install mysqli

En este caso vamos a instalar una imagen de PHP-FMP en su versión 7.3, y a parte instalamos la extensión mysqli de Docker para que esté disponible en el momento de crearse el contenedor de PHP.

Bien, con estos dos servicios creados ya tendríamos un servidor web capaz de interpretar php, pero aún nos falta decirle a nginx qué contenedor va a ser el encargado de procesar php. Esto lo conseguimos con un archivo de configuración para Nginx, crea una carpeta llamada conf en la carpeta nginx que has creado antes.

Dentro de conf, crea el archivo default.conf con este contenido:

server {
   listen 80 default_server;
   listen [::]:80 default_server;
   server_name 127.0.0.1;
 
   index index.html index.htm index.php;
 
   error_log  /var/log/nginx/dockerwp_php_error.log;
   access_log /var/log/nginx/dockerwp_php_access.log;
  
   root /var/www/html;
 
   location / {
           try_files $uri $uri/ /index.php?$args;
   }
 
   location ~ \.php$ {
       try_files $uri =404;
      
       fastcgi_split_path_info ^(.+\.php)(/.+)$;
       fastcgi_pass dockerwp_php:9000;
       fastcgi_index index.php;
       include fastcgi_params;
       fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
       fastcgi_param PATH_INFO $fastcgi_path_info;
   }
 
   location ~ /\.ht {
       deny all;
   }
  
}

No quiero profundizar en la confección del archivo de configuración para nginx ya que puede variar dependiendo de las necesidades del proyecto, pero sí que quiero que te fijes en el parámetro fastcgi_pass que apunta a dockerwp_php por el puerto 9000, así es cómo estamos estableciendo la comunicación entre estos dos contenedores.

Ahora sólo nos queda mapear en la sección de volúmenes del servicio de nginx el archivo de configuración para que esté disponible cuando arranque el contenedor, quedando el servicio de la siguiente forma:

dockerwp_nginx:
   build: ./nginx/
   container_name: ${PROJECT_NAME}_nginx
   volumes:
     - "./nginx/conf:/etc/nginx/conf.d"
     - "./www:/var/www/html/"
   ports:
     - "$NGINX_HTTP_PORT:80"
   depends_on:
         - dockerwp_php

Ok, seguro que te has dado cuenta y dirás: Ey! ¿Qué demonios es eso de depends_on? Con esta directiva hacemos este servicio dependiente de otros, es decir, si esos servicios de los que depende no están definidos, el proyecto dará error.

Muy bien, llegados a este punto, nuestro docker-compose debe verse así:

version: '3.5'
 
services:
  dockerwp_nginx:
   build: ./nginx/
   container_name: ${PROJECT_NAME}_nginx
   volumes:
     - "./nginx/conf:/etc/nginx/conf.d"
     - "./www:/var/www/html/"
   ports:
     - "$NGINX_HTTP_PORT:80"
   depends_on:
         - dockerwp_php
 
 dockerwp_php:
   build: ./php/
   container_name: ${PROJECT_NAME}_php
   volumes:
     - "./www:/var/www/html/"

Para ver los contenedores en acción haz lo siguiente:

<?php phpinfo();

docker-compose down
docker-compose up --build

Ahora deberías estar viendo la página de información de tu php que está sirviendo este contenedor:

Servicio para MariaDB

Es el momento de añadir el sistema de base de datos para poder instalar nuestro WordPress:

dockerwp_db:
   image: mariadb:latest
   container_name: ${PROJECT_NAME}_db
   environment:
     - MYSQL_DATABASE=${DB_DATABASE}
     - MYSQL_ROOT_PASSWORD=${DB_PASSWORD}
     - MYSQL_USER=${DB_USER}
     - MYSQL_PASSWORD=${DB_PASSWORD}
   ports:
       - "${DB_PORT}:3306"
   volumes:
       - "./db:/var/lib/mysql"

En este servicio vas a ver un par de secciones que no hemos visto en los anteriores, y son:

Fíjate que este servicio crea un volumen llamado db, ahí es donde persiste la base de datos para no perderla cuando se borren los contenedores.

Servicio para PHP Myadmin

Este servicio no es necesario para que funcione el proyecto pero lo añadimos por si tenemos que hacer algún cambio en Base de datos y no hacerlo desde la consola.

dockerwp_myadmin:
   image: phpmyadmin/phpmyadmin
   container_name: ${PROJECT_NAME}_myadmin
   ports:
       - "$MYADMIN_PORT:80"
   environment:
       - PMA_HOST=dockerwp_db
   depends_on:
       - dockerwp_db

Date cuenta que le pasamos una variable de entorno con el nombre del servicio de la base de datos: dockerwp_db.

Vuelve a detener y borrar los contenedores que estén corriendo y levanta el stack de nuevo con docker-compose up –build, pero ahora accede a localhost con el puerto 8002 (es el que hay definido en el .env):

Estamos en la página de phpMyAdmin, donde podemos ver el nombre del servidor Mariadb y la base de datos que utilizaremos.

Como sabes, estos datos son necesarios para la instalación de WordPress, donde el servidor de bases de datos es el servicio que hemos definido en el docker-compose y el nombre de base de datos lo definimos en el .env y lo pasamos como variable de entorno.

Instalando WordPress

Ya tenemos el entorno listo para trabajar WordPress, así que consigue un zip con la última versión de WordPress y lo descomprimes en la carpeta www/ de la raíz del proyecto, acto seguido accede a http://localhost:8000:

Los datos que introducimos en esta parte de la instalación para que WordPress pueda conectar con la base de datos los cogemos de:

Completa la instalación con los datos necesarios y ya lo tienes:

Conslusión

Como has visto, es muy fácil crear proyectos de WordPress con Docker, y una de las ventajas que tiene trabajar de esta manera es que tenemos un entorno para este proyecto aislado de otros proyectos.

Podemos montar un stack de tecnologías según las necesidades (en este caso de WordPress) sin depender de un servidor que sirve a otros proyectos, por lo tanto es más fácil instalar dependencias y cambiar versiones que en un servidor web convencional.

Código realizado en el post

Te dejo un enlace al repositorio con el código completo:

https://github.com/estokari/dockerwp

Siguiente Añade WP-CLI a tu proyecto WordPress con Docker

Añade tu comentario