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

El autor seleccionó el Fondo de Diversidad en Tecnología para recibir una donación como parte del programa Write for DOnations.

Introducción

DDEV es una herramienta de código abierto que utiliza Docker para crear entornos de desarrollo locales para muchos frameworks PHP diferentes. Al utilizar el poder de la contenedorización, DDEV puede simplificar enormemente la forma en que trabaja en varios proyectos que utilizan múltiples pilas de tecnología y servidores en la nube. DDEV incluye plantillas para WordPress, Laravel, Magento, TYPO3, Drupal y más.

Drupal 9 se lanzó el 3 de junio de 2020 para el CMS Drupal. Drupal, conocido por su facilidad de uso y una enorme biblioteca de módulos y temas, es un popular marco PHP para crear y mantener diversos sitios web y aplicaciones de todos los tamaños.

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

Prerrequisitos

Para completar este tutorial, necesitarás:

• Una máquina local que ejecute Linux o macOS

• Para macOS : el administrador de paquetes Homebrew, que utilizará para instalar DDEV. Para instalar Homebrew en su máquina local, siga el Paso 3: Instalación y configuración de Homebrew en este tutorial de Ruby.

• Docker y Docker Compose instalados en su máquina local.

  • Para Linux : puedes instalar Docker y Docker Compose siguiendo estos dos tutoriales: Cómo instalar y usar Docker y Cómo instalar Docker Compose. Elige tu distribución de Linux de la lista y sigue las instrucciones incluidas.
  • Para macOS : Docker Compose estaba disponible anteriormente como parte de Docker Toolbox, pero ahora Docker Toolbox es una solución heredada. Hoy, Docker recomienda oficialmente que instales Docker Desktop, que incluye Docker Compose, Docker Engine y más. Sigue la guía oficial de Docker para instalar Docker Desktop en macOS. Para obtener más información, puedes leer la guía oficial de inicio de Docker Desktop. Si anteriormente usaste Docker Toolbox para instalar varias herramientas de Docker, puedes leer este artículo oficial sobre las diferencias entre Docker Toolbox y Docker Desktop y cómo pueden coexistir.

Nota: Es posible desarrollar Drupal 9 usando DDEV en un servidor remoto, pero necesitará una solución para acceder localhosta través de un navegador web. El comando DDEV ddev sharefunciona con ngrok, que crea un túnel seguro hacia su servidor para que usted y otras partes interesadas puedan ver su sitio de desarrollo. Para uso personal, también puede instalar una GUI en su servidor remoto y acceder a su sitio de desarrollo a través de un navegador web dentro de esa interfaz. Para ello, puede seguir nuestra guía sobre cómo instalar y configurar VNC en Ubuntu 20.04. Para una solución GUI aún más rápida, puede seguir nuestra guía sobre cómo configurar un escritorio remoto con X2Go en Ubuntu 20.04.

Paso 1: Instalación de DDEV

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

Opción 1: Instalación de DDEV en macOS

DDEV recomienda a los usuarios de macOS que instalen su herramienta mediante el administrador de paquetes Homebrew. Utilice el siguiente brewcomando para instalar la versión estable más reciente:

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

Si prefieres la versión más nueva, puedes usar brewpara 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 brewpara actualizar su instalación:

ddev poweroff
brew upgrade ddev

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

ddev version

Verás un resultado como este:

OutputDDEV-Local versionv1.15.0commit            v1.15.0db                drud/ddev-dbserver-mariadb-10.2:v1.15.0dba               phpmyadmin/phpmyadmin:5ddev-ssh-agent    drud/ddev-ssh-agent:v1.15.0docker            19.03.8docker-compose    1.25.5os                darwinrouter            drud/ddev-router:v1.15.0web               drud/ddev-webserver:v1.15.0

DDEV incluye una potente CLI o interfaz de línea de comandos. Ejecútela ddevpara conocer algunos comandos comunes:

ddev

Verá el siguiente resultado:

OutputCreate and maintain a local web development environment.Docs: https://ddev.readthedocs.ioSupport: https://ddev.readthedocs.io/en/stable/#supportUsage:  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 versionsFlags:  -h, --help          help for ddev  -j, --json-output   If true, user-oriented output will be in JSON format.  -v, --version       version for ddevUse "ddev [command] --help" for more information about a command.

Para obtener más información sobre el uso de la CLI de DDEV, visita la documentación oficial de DDEV.

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

Opción 2: Instalación de DDEV en Linux

En un sistema operativo Linux, puede instalar DDEV utilizando Homebrew para Linux o utilizando el script de instalación oficial. En Ubuntu, comience actualizando su lista de paquetes en el aptadministrador de paquetes (puede utilizarlo apten Debian; de lo contrario, utilice el administrador de paquetes equivalente asociado con su distribución Linux):

sudo apt update

Ahora instale algunos paquetes necesarios 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 el script de instalación de DDEV desde su repositorio oficial de GitHub.

Ahora descarga el script:

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

Antes de ejecutar el script, ábralo en nanosu editor de texto preferido e inspeccione su contenido:

nano install_ddev.sh

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

Utilice el chmodcomando para hacer que el script sea ejecutable:

chmod +x install_ddev.sh

Ahora ejecute el script:

./install_ddev.sh

Es posible que durante el proceso de instalación se le solicite que confirme algunas configuraciones o que ingrese su sudocontraseña. Una vez que se complete la instalación, tendrá DDEV disponible en su sistema operativo Linux.

Ejecute ddev versionpara verificar su software:

ddev version

Verás un resultado como este:

OutputDDEV-Local versionv1.15.0commit            v1.15.0db                drud/ddev-dbserver-mariadb-10.2:v1.15.0dba               phpmyadmin/phpmyadmin:5ddev-ssh-agent    drud/ddev-ssh-agent:v1.15.0docker            19.03.8docker-compose    1.25.5os                linuxrouter            drud/ddev-router:v1.15.0web               drud/ddev-webserver:v1.15.0

DDEV es una potente CLI o interfaz de línea de comandos. Ejecútela ddevsin necesidad de nada más para aprender algunos comandos comunes:

ddev

Verá el siguiente resultado:

OutputCreate and maintain a local web development environment.Docs: https://ddev.readthedocs.ioSupport: https://ddev.readthedocs.io/en/stable/#supportUsage:  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 versionsFlags:  -h, --help          help for ddev  -j, --json-output   If true, user-oriented output will be in JSON format.  -v, --version       version for ddevUse "ddev [command] --help" for more information about a command.

Para obtener más información sobre el uso de la CLI de DDEV, puede visitar la documentación oficial de DDEV.

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

Paso 2: Implementación de un nuevo sitio Drupal 9 mediante DDEV

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

Primero, creará un directorio raíz del proyecto y luego se moverá dentro de él. Ejecutará todos los comandos restantes desde esta ubicación. Este tutorial utilizará d9test, pero usted es libre de nombrar su directorio de otra manera. Sin embargo, tenga en cuenta que DDEV no maneja bien los nombres con guiones. Se considera una buena práctica evitar nombres de directorio como my-projecto drupal-site-1.

Crea el directorio raíz de tu proyecto y navega dentro:

mkdir d9test
cd d9test

DDEV se destaca en la creación de árboles de directorios que se adaptan a plataformas CMS específicas. Utilice el ddev configcomando para crear una estructura de directorios específica para Drupal 9:

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

Verás un resultado como este:

OutputCreating 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.yamlCreated docroot at /Users/sammy/d9test/webYou have specified a project type of drupal9 but no project of that type is found in /Users/sammy/d9test/webEnsuring write permissions for d9newNo settings.php file exists, creating oneExisting settings.php file includes settings.ddev.phpConfiguration complete. You may now run 'ddev start'.

Debido a que pasó su comando, DDEV creó varios subdirectorios y archivos que representan la organización predeterminada para un sitio web de Drupal. El árbol de directorios de su proyecto ahora se verá así:--project-type=drupal9ddev config

Un árbol de directorios de Drupal 9

.├── .ddev│ ├── .gitignore│ ├── config.yaml│ ├── db-build│ │ └── Dockerfile.example│ └── web-build│     └── Dockerfile.example└── web    └── sites        └── default            ├── .gitignore            ├── settings.ddev.php            └── settings.php6 directories, 7 files

.ddev/será la carpeta principal para la configuración de ddev. web/será la raíz de documentación para su nuevo proyecto; contendrá varios settings.archivos específicos. Ahora tiene la estructura inicial para su nuevo proyecto Drupal.

El siguiente paso es inicializar la plataforma, que creará los contenedores y las configuraciones de red necesarios. DDEV se vincula a los puertos 80y 443, por lo que si está ejecutando un servidor web como Apache en su máquina, o cualquier otra cosa que use esos puertos, detenga esos servicios antes de continuar.

Utilice el ddev startcomando para inicializar su plataforma:

ddev start

Esto creará todos los contenedores basados ​​en Docker para su proyecto, que incluyen un contenedor web, un contenedor de base de datos y phpmyadmin. Cuando se complete la inicialización, verá un resultado como este (su número de puerto puede ser diferente):

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

Nota: Recuerda que DDEV está iniciando contenedores Docker en segundo plano. Si quieres ver esos contenedores o verificar que se estén ejecutando, siempre puedes usar el docker pscomando:

docker ps

Además de cualquier otro contenedor que esté ejecutando actualmente, encontrará cuatro contenedores nuevos, cada uno de los cuales ejecuta una imagen diferente: php-myadmin, ddev-webserver, ddev-routery ddev-dbserver-mariadb.

ddev startha creado correctamente sus contenedores y le ha proporcionado un resultado con dos URL. Si bien este resultado indica que su proyecto "puede ser alcanzado en y ", visitar estas URL ahora mismo arrojará un error. A partir de Drupal 8, el núcleo de Drupal y los módulos de contribuciones funcionan como dependencias. Por lo tanto, primero deberá terminar de instalar Drupal usando Composer, el administrador de paquetes para proyectos PHP, antes de que algo se cargue en su navegador web.http://d9test.ddev.sitehttp://127.0.0.1:32773

Una de las características más útiles y elegantes de DDEV es que puedes pasar comandos de Composer a través de la CLI de DDEV y a tu entorno contenedorizado. Esto significa que puedes separar la configuración específica de tu máquina de tu entorno de desarrollo. Ya no tienes que gestionar los diversos problemas de rutas de archivos, dependencias y versiones que suelen acompañar al desarrollo PHP local. Además, puedes cambiar rápidamente de contexto entre varios proyectos utilizando diferentes marcos y pilas de tecnología con un mínimo esfuerzo.

Utilice el ddev composercomando 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 drushcomando y ofrece una alternativa, pero drushes una CLI poderosa para el desarrollo de Drupal que puede mejorar su eficiencia.

Utilice ddev composerpara instalar drush:

ddev composer require "drush/drush"

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

Paso 3: Configuración de su proyecto Drupal 9

Ahora que ha instalado Drupal 9, puede visitar su nuevo proyecto en su navegador. Para ello, puede volver a ejecutar ddev starty copiar una de las dos URL que muestra, o puede utilizar el siguiente comando, que iniciará automáticamente su sitio en una nueva ventana del navegador:

ddev launch

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

Aquí tienes dos opciones. Puedes usar esta interfaz de usuario y seguir el asistente durante la instalación, o puedes volver a tu terminal y pasar un drushcomando a través de ddev. La última opción automatizará el proceso de instalación y establecerá admintu nombre de usuario y contraseña.

Opción 1: Utilizar el asistente

Regrese al asistente en su navegador. En Elegir idioma, seleccione un idioma del menú desplegable y haga clic en Guardar y continuar . Ahora seleccione un perfil de instalación. Puede elegir entre Estándar , Mínimo y Demo . Elija su opción y luego haga clic en Guardar y continuar . Drupal verificará automáticamente sus requisitos, configurará una base de datos e instalará su sitio. El último paso es personalizar algunas configuraciones. Agregue un nombre de sitio y una dirección de correo electrónico del sitio que termine en su dominio. Luego, elija un nombre de usuario y una contraseña. Elija una contraseña segura y guarde sus credenciales en un lugar seguro. Por último, agregue una dirección de correo electrónico privada que revise regularmente, complete la configuración regional y presione Guardar y continuar .

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

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

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

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

Esto creará su sitio tal como lo haría el asistente, pero con algunas configuraciones estándar. Su nombre de usuario y contraseña serán admin.

Ahora inicie 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 verificar que sus permisos sean correctos para el /sites/web/defaultdirectorio. Mientras esté trabajando localmente, esto no es una preocupación importante, pero si transfiere estos permisos a un servidor de producción, representarán un riesgo de seguridad.

Paso 4: Comprobación de los permisos

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

Después de que se ejecute el script de instalación, Drupal intentará establecer los web/sites/defaultpermisos de directorio para ready executepara todos los grupos: esta es una 555configuración de permisos. También intentará establecer permisos para default/settings.phppara read-onlyo 444. Si encuentra esta advertencia, ejecute estos dos chmodcomandos desde el directorio raíz de su proyecto. Si no lo hace, representa 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 lscomando con los amodificadores l, h, y d:

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

Compruebe que sus permisos coincidan con el siguiente resultado:

Outputdr-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 máquina local.

Paso 5: Crea tu primera publicación en Drupal

Para probar algunas de las funcionalidades de Drupal, ahora creará una publicación utilizando la interfaz web.

Desde la página inicial de su sitio, haga clic en el botón Contenido en el borde izquierdo del menú superior. Ahora haga clic en el botón azul Agregar contenido . Aparecerá una nueva página. Haga clic en Artículo y aparecerá otra página.

Añade el título y el contenido que quieras. También puedes añadir una imagen, como uno de los fondos de pantalla de DigitalOcean. Cuando estés listo, haz clic en el botón azul para guardar .

Tu primera publicación aparecerá en tu sitio web.

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

Paso 6: Gestión del contenedor DDEV

Cuando haya terminado de desarrollar su proyecto o cuando desee tomarse un descanso, puede detener su contenedor DDEV sin preocuparse por la pérdida de datos. DDEV puede gestionar cambios rápidos de contexto entre muchos proyectos; esta es una de sus características más útiles. Su código y sus datos siempre se conservan en el directorio de su proyecto, incluso después de detener o eliminar el contenedor 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, por lo que puede ejecutar ddevcomandos desde cualquier lugar, siempre que especifique el proyecto DDEV:

ddev stop d9test

También puedes ver todos tus 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, utilizaste Docker y el poder de la contenedorización para desarrollar un sitio Drupal localmente, con la ayuda de DDEV. DDEV también se integra bien con numerosos IDE y proporciona depuración PHP integrada para Atom, PHPStorm y Visual Studio Code (vscode). Desde aquí, también puedes aprender más sobre la creación de entornos de desarrollo para Drupal con DDEV o el desarrollo de otros marcos PHP como WordPress.