Cómo desarrollar un sitio web Drupal 9 en su equipo local usando Docker y DDEV

El autor seleccionó la organización Diversity in Tech Fund para que reciba una donación como parte del programa Write for DOnations.

Introducción

DDEV es un herramienta de código abierto que utiliza Docker para crear entornos de desarrollo locales para muchos marcos PHP diferentes. Con el poder de la creación de contenedores, DDEV puede simplificar de forma significativa la forma en que trabaja en múltiples proyectos que utilizan múltiples pilas tecnológicas y múltiples servidores en la nube. DDEV incluye plantillas para WordPress, Laravel, Magento, TYPO3, Drupal y mucho más.

Drupal 9 fue lanzado el 3 de junio del 2020 para la CMS Drupal. Conocido por su facilidad de uso y una enorme biblioteca de módulos y temas, Drupal es un marco PHP popular para crear y mantener varios sitios web y aplicaciones de todos los tamaños.

En este tutorial, comenzará a desarrollar un sitio web Drupal 9 en su equipo local usando DDEV. Esto le permitirá crear su sitio web primero y, más tarde, cuando esté listo, implementar su proyecto en un servidor de producción.

Requisitos previos

Para completar este tutorial, necesitará lo siguiente:

• Un equipo local con Linux o macOS

• Para macOS: el administrador de paquetes Homebrew que utilizará para instalar DDEV. Para instalar Homebrew en su equipo local, siga el Paso 3: Instalar y configurar Homebrew en este tutorial de Ruby.

• Docker y Docker Compose instalados en su equipo local.

  • Para Linux: puede instalar Docker y Docker Compose siguiendo estos dos tutoriales: Cómo instalar y usar Docker y Cómo instalar Docker Compose. Seleccione su distribución Linux de la lista y siga las instrucciones incluidas.
  • Para macOS: Docker Compose estaba previamente disponible como parte de Docker Toolbox, pero Docker Toolbox es ahora una solución obsoleta. Actualmente, Docker recomienda oficialmente que instale Docker Desktop, que incluye Docker Compose, Docker Engine y mucho más. Siga la guía oficial de Docker para instalar Docker Desktop en macOS. Para obtener más información puede leer la guía oficial para empezar a usar Docker Desktop. Si ha utilizado previamente Docker Toolbox para instalar varias herramientas Docker, puede leer este artículo oficial sobre las diferencias entre Docker Toolbox y Docker Desktop y cómo pueden coexistir.

Paso 1: Instalar DDEV

En este paso instalará DDEV en su equipo local. La Opción 1 incluye instrucciones para macOS mientras que la Opción 2 proporciona instrucciones para Linux. Este tutorial se probó en DDEV versión 1.15.0.

Opción 1: Instalar DDEV en macOS

DDEV aconseja que los usuarios de macOS instalen su herramienta usando el administrador de paquetes Homebrew. Utilice el siguiente comando brew para instalar la versión estable más reciente:

brew tap drud/ddev && brew install drud/ddev/ddev

Si prefiere la versión absolutamente más reciente, puede usar brew para instalar ddev-edge:

brew tap drud/ddev-edge && brew install drud/ddev-edge/ddev

Si ya tiene una versión de DDEV instalada, o si alguna vez desea actualizar su versión, cierre DDEV y utilice brew para actualizar su instalación:

ddev poweroff
brew upgrade ddev

Una vez que haya instalado o actualizado DDEV, ejecute ddev version para verificar su software:

ddev version

Verá un resultado similar a este:

Output
DDEV-Local version	v1.15.0
commit            	v1.15.0
db                	drud/ddev-dbserver-mariadb-10.2:v1.15.0
dba               	phpmyadmin/phpmyadmin:5
ddev-ssh-agent    	drud/ddev-ssh-agent:v1.15.0
docker            	19.03.8
docker-compose    	1.25.5
os                	darwin
router            	drud/ddev-router:v1.15.0
web               	drud/ddev-webserver:v1.15.0

DDEV incluye una potente CLI o interfaz de línea de comandos. Ejecute ddev para obtener más información sobre algunos comandos comunes:

ddev

Verá lo siguiente:

Output
Create and maintain a local web development environment.
Docs: https://ddev.readthedocs.io
Support: https://ddev.readthedocs.io/en/stable/#support

Usage:
  ddev [command]

Available Commands:
  auth             A collection of authentication commands
  composer         Executes a composer command within the web container
  config           Create or modify a ddev project configuration in the current directory
  debug            A collection of debugging commands
  delete           Remove all project information (including database) for an existing project
  describe         Get a detailed description of a running ddev project.
  exec             Execute a shell command in the container for a service. Uses the web service by default.
  export-db        Dump a database to a file or to stdout
  help             Help about any command
  hostname         Manage your hostfile entries.
  import-db        Import a sql file into the project.
  import-files     Pull the uploaded files directory of an existing project to the default public upload directory of your project.
  list             List projects
  logs             Get the logs from your running services.
  pause            uses 'docker stop' to pause/stop the containers belonging to a project.
  poweroff         Completely stop all projects and containers
  pull             Pull files and database using a configured provider plugin.
  restart          Restart a project or several projects.
  restore-snapshot Restore a project's database to the provided snapshot version.
  sequelpro        This command is not available since sequel pro.app is not installed
  share            Share project on the internet via ngrok.
  snapshot         Create a database snapshot for one or more projects.
  ssh              Starts a shell session in the container for a service. Uses web service by default.
  start            Start a ddev project.
  stop             Stop and remove the containers of a project. Does not lose or harm anything unless you add --remove-data.
  version          print ddev version and component versions

Flags:
  -h, --help          help for ddev
  -j, --json-output   If true, user-oriented output will be in JSON format.
  -v, --version       version for ddev

Use "ddev [command] --help" for more information about a command.

Para obtener más información sobre cómo usar la CLI de DDEV, visite la documentación oficial de DDEV.

Con DDEV instalado en su equipo local, ahora está listo para instalar Drupal 9 y comenzar a desarrollar un sitio web.

Opción 2: Instalar DDEV en Linux

En un sistema operativo Linux, puede instalar DDEV usando Homebrew para Linux o usando la secuencia de comandos de instalación oficial. En Ubuntu, comience actualizando su lista de paquetes en el administrador de paquetes apt (puede usar apt en Debian, de lo contrario utilice el administrador de paquetes equivalente asociado con su distribución Linux):

sudo apt update

Ahora instale algunos paquetes previos desde el repositorio oficial de Ubuntu:

sudo apt install build-essential apt-transport-https ca-certificates software-properties-common curl

Estos paquetes le permitirán descargar la secuencia de comandos de instalación de DDEV desde su repositorio oficial GitHub.

Ahora descargue la secuencia de comandos:

curl -O https://raw.githubusercontent.com/drud/ddev/master/scripts/install_ddev.sh

Antes de ejecutar la secuencia de comandos, ábrala en nano o en su editor de texto preferido e inspeccione su contenido:

nano install_ddev.sh

Una vez que haya revisado el contenido de la secuencia de comandos y esté satisfecho, guarde y cierre el archivo. Ahora está listo para ejecutar la secuencia de comandos de instalación.

Utilice el comando chmod para hacer que la secuencia de comandos sea ejecutable:

chmod +x install_ddev.sh

Ahora ejecute la secuencia de comandos:

./install_ddev.sh

Es posible que el proceso de instalación le pida que confirme algunos ajustes o que introduzca su contraseña sudo. Una vez completada la instalación, tendrá DDEV disponible en su sistema operativo Linux.

Ejecute ddev version para verificar su software:

ddev version

Verá un resultado similar a este:

Output
DDEV-Local version	v1.15.0
commit            	v1.15.0
db                	drud/ddev-dbserver-mariadb-10.2:v1.15.0
dba               	phpmyadmin/phpmyadmin:5
ddev-ssh-agent    	drud/ddev-ssh-agent:v1.15.0
docker            	19.03.8
docker-compose    	1.25.5
os                	linux
router            	drud/ddev-router:v1.15.0
web               	drud/ddev-webserver:v1.15.0

DDEV incluye una potente CLI o interfaz de línea de comandos. Ejecute ddev sin nada más para aprender sobre estos comandos comunes:

ddev

Verá lo siguiente:

Output
Create and maintain a local web development environment.
Docs: https://ddev.readthedocs.io
Support: https://ddev.readthedocs.io/en/stable/#support

Usage:
  ddev [command]

Available Commands:
  auth             A collection of authentication commands
  composer         Executes a composer command within the web container
  config           Create or modify a ddev project configuration in the current directory
  debug            A collection of debugging commands
  delete           Remove all project information (including database) for an existing project
  describe         Get a detailed description of a running ddev project.
  exec             Execute a shell command in the container for a service. Uses the web service by default.
  export-db        Dump a database to a file or to stdout
  help             Help about any command
  hostname         Manage your hostfile entries.
  import-db        Import a sql file into the project.
  import-files     Pull the uploaded files directory of an existing project to the default public upload directory of your project.
  list             List projects
  logs             Get the logs from your running services.
  pause            uses 'docker stop' to pause/stop the containers belonging to a project.
  poweroff         Completely stop all projects and containers
  pull             Pull files and database using a configured provider plugin.
  restart          Restart a project or several projects.
  restore-snapshot Restore a project's database to the provided snapshot version.
  sequelpro        This command is not available since sequel pro.app is not installed
  share            Share project on the internet via ngrok.
  snapshot         Create a database snapshot for one or more projects.
  ssh              Starts a shell session in the container for a service. Uses web service by default.
  start            Start a ddev project.
  stop             Stop and remove the containers of a project. Does not lose or harm anything unless you add --remove-data.
  version          print ddev version and component versions

Flags:
  -h, --help          help for ddev
  -j, --json-output   If true, user-oriented output will be in JSON format.
  -v, --version       version for ddev

Use "ddev [command] --help" for more information about a command.

Para obtener más información sobre cómo usar la CLI de DDEV, visite la documentación oficial de DDEV.

Con DDEV instalado en su equipo local, ahora está listo para instalar Drupal 9 y comenzar a desarrollar un sitio web.

Paso 2: Implementar un nuevo sitio Drupal 9 usando DDEV

Con DDEV en ejecución, ahora lo usara para crear un sistema de archivos Drupal específico, instalar Drupal 9 e iniciar un proyecto de sitio web estándar.

Primero, creará un directorio raíz del proyecto y luego entrará en él. Ejecutará todos los comandos restantes desde esta ubicación. Este tutorial usará d9test, pero puede llamar a su directorio de cualquier otra manera. Observe, sin embargo, que DDEV no gestiona bien los nombres con guion. Se considera una buena práctica evitar nombres de directorio como my-project o drupal-site-1.

Cree el directorio raíz de su proyecto y entre en él:

mkdir d9test
cd d9test

DDEV sobresale a la hora de crear árboles de directorio que coinciden con plataformas CMS específicas. Utilice el comando ddev config para crear una estructura de directorio específica para Drupal 9:

ddev config --project-type=drupal9 --docroot=web --create-docroot

Verá un resultado similar a este:

Output
Creating a new ddev project config in the current directory (/Users/sammy/d9test)
Once completed, your configuration will be written to /Users/sammy/d9test/.ddev/config.yaml

Created docroot at /Users/sammy/d9test/web
You have specified a project type of drupal9 but no project of that type is found in /Users/sammy/d9test/web
Ensuring write permissions for d9new
No settings.php file exists, creating one
Existing settings.php file includes settings.ddev.php
Configuration complete. You may now run 'ddev start'.

Debido a que pasó --project-type=drupal9 a su comando ddev config, DDEV creó varios subdirectorios y archivos que representan la organización predeterminada para un sitio web Drupal. El árbol de directorio de su proyecto ahora tendrá este aspecto:

.
├── .ddev
│   ├── .gitignore
│   ├── config.yaml
│   ├── db-build
│   │   └── Dockerfile.example
│   └── web-build
│       └── Dockerfile.example
└── web
    └── sites
        └── default
            ├── .gitignore
            ├── settings.ddev.php
            └── settings.php

6 directories, 7 files

.ddev/ será la carpeta principal para la configuración ddev. web/ será el docroot para su nuevo proyecto; contendrá varios archivos settings. específicos. Ahora tiene el andamio inicial para su nuevo proyecto Drupal.

Su siguiente paso es iniciar su plataforma, que creará los contenedores necesarios y las configuraciones de red. DDEV vincula los puertos 80 y 443, de forma que, si está ejecutando un servidor web como Apache en su equipo, o cualquier otra cosa que utilice esos puertos, detenga esos servicios antes de continuar.

Utilice el comando ddev start para iniciar su plataforma:

ddev start

Esto creará todos los contenedores basados en Docker para su proyecto, lo que incluye un contenedor web, un contenedor de base de datos y phpmyadmin. Cuando la inicialización se complete, verá un resultado similar a este (el número de su puerto podría ser diferente):

...
[secondary_label Output]
Successfully started d9test
Project can be reached at http://d9test.ddev.site http://127.0.0.1:32773

docker ps

ddev start ha creado correctamente sus contenedores y le ha dado un resultado con dos URL. Aunque este resultado dice que "puede llegar a su proyecto en http://d9test.ddev.site y http://127.0.0.1:32773, visitar estas URL ahora provocará un error. Desde Drupal 8, el núcleo de Drupal y las dependencias similares a función de módulos contrib Por tanto, primero deberá terminar de instalar Drupal usando Composer, el administrador de paquetes para proyectos PHP antes de cargar nada en su navegador web.

Una de las funciones más útiles y elegantes de DDEV es que puede pasar comandos Composer a través de la CLI de DDEV y en su entorno en contenedores. Esto significa que puede separar la configuración específica de su equipo de su entorno de desarrollo. Ya no tiene que administrar los diversos problemas de ruta de archivo, dependencia y versión que generalmente acompañan al desarrollo PHP local. Además, puede cambiar de contexto rápidamente entre múltiples proyectos usando diferentes marcos y pilas tecnologías con un esfuerzo mínimo.

Utilice el comando ddev composer para descargar drupal/recommended-project. Esto descargará el núcleo de Drupal, sus bibliotecas y otros recursos relacionados y, luego, creará un proyecto predeterminado:

ddev composer create "drupal/recommended-project"

Ahora descargue un componente final llamado Drush, o Drupal Shell. Este tutorial solo usará un comando drush, y este tutorial proporciona una alternativa, pero drush es una CLI potente para el desarrollo de Drupal que puede mejorar su eficiencia.

Utilice ddev-composer para instalar drush:

ddev composer require "drush/drush"

Ahora ha creado un proyecto Drupal 9 predeterminado y ha instalado drush. Ahora verá su proyecto en un navegador y configurará los ajustes de su sitio web.

Paso 3: Configurar su proyecto Drupal 9

Ahora que instaló Drupal 9 puede visitar su nuevo proyecto en su navegador. Para hacer esto, puede volver a ejecutar ddev start y copiar una de las dos URL que produce, o puede usar el siguiente comando, que abrirá su sitio automáticamente en una nueva ventana del navegador.

ddev launch

Encontrará el asistente estándar de instalación de Drupal.

Aquí tiene dos opciones. Puede usar esta UI y seguir el asistente durante la instalación, o puede volver a su terminal y pasar un comando drush a través de ddev. Esta última opción automatizará el proceso de instalación y establecerá admin como su nombre de usuario y contraseña.

Opción 1: Usar el asistente

Vuelva al asistente en su navegador. Bajo Choose language (Seleccionar idioma), seleccione un idioma en el menú desplegable y haga clic en Save and continue (Guardar y continuar). Ahora seleccione un perfil de instalación. Puede elegir entre Standard (Estándar), Minimal (Mínima) y Demo. Seleccione la opción que desee y haga clic en Save and continue (Guardar y continuar). Drupal verificará automáticamente sus requisitos, configurará una base de datos e instalará su sitio. Su último paso es personalizar algunas configuraciones. Añada un nombre de sitio y una dirección de correo electrónico que termine en su dominio. A continuación, elija un nombre de usuario y una contraseña. Elija una contraseña segura y mantenga sus credenciales en algún lugar seguro. Por último, añada una dirección de correo electrónico privada que compruebe regularmente, complete los ajustes regionales y pulse Save and continue (Guardar y continuar).

Su nuevo sitio se cargará con un mensaje de bienvenida.

Opción 2: Usar la línea de comandos

Desde el directorio raíz de su proyecto, ejecute este comando ddev exec para instalar un sitio de Drupal predeterminado usando drush:

ddev exec drush site:install --account-name=admin --account-pass=admin

Esto creará su sitio de la misma manera que el asistente lo hará pero con algunas configuraciones de texto estándar. Su nombre de usuario y contraseña serán admin.

Ahora abra el sitio para verlo en su navegador:

ddev launch

Ahora está listo para comenzar a crear su sitio web, pero se considera una buena práctica comprobar que sus permisos son correctos para el directorio /sites/web/default. Aunque está trabajando localmente, esto no es un problema significativo, pero si transfiere estos permisos a un servidor de producción, supondrán un riesgo de seguridad.

Paso 4: Comprobar sus permisos

Durante la instalación del asistente, o cuando se cargue por primera vez su página de bienvenida, es posible que vea una advertencia sobre los ajustes de los permisos en su directorio /sites/web/default y un archivo dentro de ese directorio: settings.php.

Tras ejecutarse la secuencia de comandos de instalación, Drupal intentará configurar los permisos del directorio web/sites/default a read (lectura) y execute (ejecutar) para todos los grupos: este es un ajuste de permisos 555. También intentará configurar permisos para default/settings.php a solo lectura o 444. Si aparece esta advertencia, ejecute estos dos comandos chmod desde el directorio raíz de su proyecto. No hacerlo plantea un riesgo de seguridad:

chmod 555 web/sites/default
chmod 444 web/sites/default/settings.php

Para verificar que tiene los permisos correctos, ejecute este comando ls con los conmutadores a, l, h y d:

ls -alhd web/sites/default web/sites/default/settings.php

Compruebe que sus permisos coinciden con el siguiente resultado:

Output
dr-xr-xr-x 8 sammy staff 256 Jul 21 12:56 web/sites/default
-r--r--r-- 1 sammy staff 249 Jul 21 12:12 web/sites/default/settings.php

Ahora está listo para desarrollar un sitio web Drupal 9 en su equipo local.

Paso 5: Crear su primera publicación en Drupal

Para probar algunas de las funciones de Drupal, creará una publicación usando la IU de la web.

Desde la página inicial de su sitio, haga clic en el botón Contenido en la parte izquierda del menú superior. Ahora haga clic en el botón azul add content (añadir contenido). Aparecerá una nueva página. Haga clic en Article (Artículo) y aparecerá otra página.

Añada el título y el contenido que desee. Puede añadir una imagen también, como uno de los fondos de pantalla de DigitalOcean. Cuando esté listo, haga clic en el botón save (guardar) azul.

Su primera publicación aparecerá en su sitio web.

Ahora está desarrollando un sitio web Drupal 9 en su equipo local sin interactuar con un servidor gracias a Docker y DDEV. En el siguiente paso, administrará el contenedor DDEV para acomodar su flujo de trabajo.

Paso 6: Administrar el contenedor de DDEV

Cuando haya terminado de desarrollar su proyecto o cuando desee tomarse un descanso, puede detener su contenedor DDEV sin preocuparse sobre la pérdida de datos. DDEV puede administrar el cambio rápido de contexto entre muchos proyectos, y esta es una de sus funciones más útiles. Su código y datos siempre se conservan en el directorio de su proyecto, incluso tras detener o eliminar el contenedor de DDEV.

Para liberar recursos, puede detener DDEV en cualquier momento. Desde el directorio raíz de su proyecto, ejecute el siguiente comando:

ddev stop

DDEV está disponible globalmente, de forma que puede ejecutar comandos ddev desde cualquier lugar, siempre que especifique el proyecto DDEV:

ddev stop d9test

También puede ver todos sus proyectos a la vez usando ddev list:

ddev list

DDEV incluye muchos otros comandos útiles.

Puede reiniciar DDEV y continuar desarrollando localmente en cualquier momento.

Conclusión

En este tutorial, utilizó Docker y el poder de la creación de contenedores para desarrollar un sitio Drupal localmente con la ayuda de DDEV. DDEV también se integra bien con numerosos IDE, y ofrece depuración PHP integrada para Atom, PHPStorm y Visual Studio Code (vscode). Desde aquí, puede aprender más sobre crear entornos de desarrollo para Drupal con DDEV o desarrollar otros marcos PHP como Wordpress.