Entwickeln einer Drupal 9-Website auf einem lokalen Rechner mit Docker und DDEV

Der Autor hat den Diversity in Tech Fund dazu ausgewählt, eine Spende im Rahmen des Programms Write for DOnations zu erhalten.

Einführung

DDEV ist ein Open-Source-Tool, das Docker verwendet, um für viele verschiedene PHP-Frameworks lokale Entwicklungsumgebungen zu erstellen. Durch Verwendung der Vorteile von Containerisierung kann DDEV die Arbeit an mehreren Projekten, bei denen verschiedene Tech-Stacks und Cloud-Server zum Einsatz kommen, erheblich vereinfachen. DDEV enthält Vorlagen für WordPress, Laravel, Magento, TYPO3, Drupal und mehr.

Drupal 9 wurde am 3. Juni 2020 für das Drupal CMS veröffentlicht. Drupal ist bekannt für seine hohe Benutzerfreundlichkeit und eine enorme Bibliothek an Modulen und Themen. Als PHP-Framework ist es beliebt für die Entwicklung und Pflege verschiedener Websites und Anwendungen aller Größen.

In diesem Tutorial werden Sie mit DDEV auf Ihrem lokalen Rechner eine Drupal 9-Website erstellen. Damit können Sie zunächst Ihre Website einrichten und Ihr Projekt dann später, wenn Sie bereit sind, auf einem Produktionsserver bereitstellen.

Voraussetzungen

Um diesem Tutorial zu folgen, benötigen Sie:

• Einen lokalen Rechner mit Linux oder macOS

• Für macOS: den Homebrew-Paketmanager, den Sie zur Installation von DDEV verwenden werden. Um Homebrew auf Ihrem lokalen Rechner zu installieren, folgen Sie Schritt 3 — Installieren und Einrichten von Homebrew in diesem Ruby-Tutorial.

• Docker und Docker Compose, auf Ihrem lokalen Rechner installiert.

  • Für Linux: Sie können Docker und Docker Compose anhand der folgenden Tutorials installieren: Installieren und Verwenden von Docker und Installieren von Docker Compose. Wählen Sie Ihre Linux-Distribution aus der Liste aus und folgen Sie den enthaltenen Anweisungen.
  • Für macOS: Docker Compose war früher als Teil von Docker Toolbox verfügbar; Docker Toolbox ist inzwischen jedoch eine Legacy-Lösung. Heute empfiehlt Docker offiziell die Installation von Docker Desktop, zu dem Docker Compose, Docker Engine und mehr gehören. Folgen Sie dem offiziellen Leitfaden von Docker, um Docker Desktop unter macOS zu installieren. Weitere Informationen finden Sie im Leitfaden zu ersten Schritten mit Docker Desktop. Wenn Sie zuvor Docker Toolbox zum Installieren verschiedener Docker-Tools verwendet haben, können Sie diesen offiziellen Artikel über die Unterschiede zwischen Docker Toolbox und Docker Desktop und über Möglichkeiten zur Koexistenz lesen.

Schritt 1 — Installieren von DDEV

In diesem Schritt installieren Sie DDEV auf Ihrem lokalen Rechner. Option 1 enthält Anweisungen für macOS, während Option 2 Anweisungen für Linux beinhaltet. Dieses Tutorial wurde mit DDEV Version 1.15.0 getestet.

Option 1 — Installieren von DDEV unter macOS

DDEV empfiehlt macOS-Benutzern, das Tool mit dem Homebrew-Paketmanager zu installieren. Verwenden Sie folgenden brew-Befehl zum Installieren der neuesten stabilen Version:

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

Wenn Sie die absolut neueste Version bevorzugen, können Sie brew zum Installieren von ddev-edge verwenden:

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

Wenn Sie bereits eine Version von DDEV installiert haben oder Ihre Version aktualisieren möchten, schließen Sie DDEV und verwenden brew zum Aktualisieren Ihrer Installation:

ddev poweroff
brew upgrade ddev

Sobald Sie DDEV installiert oder aktualisiert haben, führen Sie ddev version aus, um Ihre Software zu überprüfen:

ddev version

Sie werden eine Ausgabe wie diese sehen:

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 enthält eine leistungsstarke CLI oder Befehlszeilenschnittstelle. Führen Sie ddev aus, um sich über einige gängige Befehle zu informieren:

ddev

Sie sehen die folgende Ausgabe:

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.

Weitere Informationen zur Verwendung der DDEV-CLI finden Sie in der offiziellen DDEV-Dokumentation.

Nachdem DDEV auf Ihrem lokalen Rechner installiert wurde, sind Sie nun bereit, Drupal 9 zu installieren und mit der Entwicklung einer Website zu beginnen.

Option 2 — Installieren von DDEV unter Linux

In einem Linux-Betriebssystem können Sie DDEV mit Homebrew für Linux installieren oder das offizielle Installationsskript verwenden. Beginnen Sie unter Ubuntu mit dem Aktualisieren Ihrer Liste mit Paketen im apt-Paketmanager (Sie können apt in Debian bzw. den äquivalenten Paketmanager, der mit Ihrer Linux-Distribution verknüpft ist, verwenden):

sudo apt update

Installieren Sie nun einige Voraussetzungspakete aus dem offiziellen Repository von Ubuntu:

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

Mit diesen Paketen können Sie das DDEV-Installationsskript aus dem offiziellen GitHub-Repository herunterladen.

Laden Sie das Skript jetzt herunter:

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

Öffnen Sie es vor dem Ausführen des Skripts in nano oder Ihrem bevorzugten Texteditor und inspizieren Sie den Inhalt:

nano install_ddev.sh

Sobald Sie die Inhalte des Skripts geprüft haben und damit zufrieden sind, speichern und schließen Sie die Datei. Jetzt sind Sie bereit, das Installationsskript auszuführen.

Verwenden Sie den Befehl chmod, um das Skript ausführbar zu machen:

chmod +x install_ddev.sh

Führen Sie das Skript jetzt aus:

./install_ddev.sh

Im Installationsprozess werden Sie ggf. dazu aufgefordert, einige Einstellungen zu bestätigen oder Ihr sudo-Passwort einzugeben. Nach Abschluss der Installation wird DDEV in Ihrem Linux-Betriebssystem verfügbar sein.

Führen Sie ddev version aus, um Ihre Software zu überprüfen:

ddev version

Sie werden eine Ausgabe wie diese sehen:

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 ist eine leistungsstarke CLI oder Befehlszeilenschnittstelle. Führen Sie ddev ohne etwas anderes aus, um sich über einige gängige Befehle zu informieren:

ddev

Sie sehen die folgende Ausgabe:

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.

Weitere Informationen zur Verwendung der DDEV-CLI finden Sie in der offiziellen DDEV-Dokumentation.

Nachdem DDEV auf Ihrem lokalen Rechner installiert ist, sind Sie nun bereit, Drupal 9 bereitzustellen und mit der Entwicklung einer Website zu beginnen.

Schritt 2 — Bereitstellen einer neuen Drupal 9-Site mit DDEV

Mit ausgeführtem DDEV werden Sie nun ein Drupal-spezifisches Dateisystem erstellen, Drupal 9 installieren und dann ein standardmäßiges Websiteprojekt initiieren.

Zuerst erstellen Sie ein root-Verzeichnis für das Projekt und öffnen es. Von hier aus führen Sie alle verbleibenden Befehle aus. In diesem Tutorial wird d9test verwendet; Sie können Ihr Verzeichnis jedoch auch anders nennen. Beachten Sie jedoch, dass DDEV nicht gut mit Bindestrichen in Namen umgehen kann. Es gilt als bewährtes Verfahren, Verzeichnisnamen wie my-project oder drupal-site-1 zu vermeiden.

Erstellen Sie das root-Verzeichnis für Ihr Projekt und navigieren Sie dort hin:

mkdir d9test
cd d9test

DDEV eignet sich hervorragend zum Erstellen von Verzeichnisstrukturen, die mit bestimmten CMS-Plattformen übereinstimmen. Verwenden Sie den Befehl ddev config zum Einrichten einer Verzeichnisstruktur, die für Drupal 9 spezifisch ist:

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

Sie werden eine Ausgabe wie diese sehen:

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'.

Da Sie --project-type=drupal9 an Ihren Befehl ddev config übergeben haben, hat DDEV mehrere Unterverzeichnisse und Dateien erstellt, die die Standardorganisation für eine Drupal-Website darstellen. Die Verzeichnisstruktur Ihres Projekts wird nun wie folgt aussehen:

.
├── .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/ wird der Hauptordner für die ddev-Konfiguration sein. web/ ist der docroot für Ihr neues Projekt; er enthält mehrere spezifische Dateien mit Einstellungen (settings). Sie verfügen nun über das Grundgerüst für Ihr neues Drupal-Projekt.

Der nächste Schritt besteht darin, Ihre Plattform zu initialisieren, wodurch die erforderlichen Container und Networking-Konfigurationen erstellt werden. DDEV bindet sich an Ports 80 und 443. Wenn Sie also einen Webserver wie Apache auf Ihrem Rechner ausführen oder etwas anderes verwenden, das diese Ports nutzt, halten Sie diese Dienste vor dem Fortfahren an.

Verwenden Sie den Befehl ddev start, um Ihre Plattform zu initialisieren:

ddev start

Dadurch werden alle Docker-basierten Container für Ihr Projekt erstellt, darunter ein Webcontainer, ein Datenbankcontainer und phpmyadmin. Nach Abschluss der Initialisierung sehen Sie eine Ausgabe wie diese (Ihre Portnummer kann sich davon unterscheiden):

...
[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 hat Ihre Container erfolgreich erstellt und eine Ausgabe mit zwei URLs geliefert. Zwar steht in dieser Ausgabe, dass Ihr Projekt „unter http://d9test.ddev.site und http://127.0.0.1:32773 erreichbar ist“, doch wenn Sie diese URLs besuchen, wird ein Fehler ausgelöst. Ab Drupal 8 funktionieren der Drupal Core und die contrib-Module wie Abhängigkeiten. Deshalb müssen Sie Drupal zunächst mit Composer, dem Paketmanager für PHP-Projekte, installieren, bevor Sie etwas in Ihrem Webbrowser laden können.

Eine der nützlichsten und elegantesten Funktionen von DDEV ist, dass Sie Composer-Befehle über die DDEV-CLI in Ihre containerisierte Umgebung übergeben können. Das bedeutet, dass Sie die spezifische Konfiguration Ihres Computers von Ihrer Entwicklungsumgebung trennen können. So müssen Sie die verschiedenen Probleme mit Dateipfaden, Abhängigkeiten und Versionen, die eine lokale PHP-Entwicklung im Allgemeinen begleiten, nicht mehr verwalten. Außerdem können Sie rasch und mit minimalem Aufwand zwischen verschiedenen Frameworks und Tech-Stacks wechseln.

Verwenden Sie den Befehl ddev composer zum Herunterladen von drupal/recommended-project. Dadurch wird Drupal core mit seinen Bibliotheken und anderen verwandten Ressourcen heruntergeladen und ein Standardprojekt erstellt:

ddev composer create "drupal/recommended-project"

Laden Sie nun eine abschließende Komponente namens Drush oder Drupal Shell herunter. In diesem Tutorial werden wir nur einen drush-Befehl nutzen. Das Tutorial bietet eine Alternative, doch ist drush eine leistungsstarke CLI für die Drupal-Entwicklung, die für zusätzliche Effizienz sorgt.

Verwenden Sie ddev composer zum Installieren von drush:

ddev composer require "drush/drush"

Sie haben nun ein standardmäßiges Drupal 9-Projekt erstellt und drush installiert. Jetzt werden Sie Ihr Projekt in einem Browser anzeigen und die Einstellungen Ihrer Website konfigurieren.

Schritt 3 — Konfigurieren des Drupal-9-Projekts

Nachdem Sie Drupal 9 installiert haben, können Sie Ihr neues Projekt nun in Ihrem Browser öffnen. Dazu können Sie ddev start erneut ausführen und eine der beiden ausgegebenen URLs kopieren. Alternativ können Sie folgenden Befehl verwenden, um Ihre Website in einem neuen Browserfenster automatisch zu starten:

ddev launch

Der standardmäßige Drupal-Installationsassistent wird angezeigt.

Hier haben Sie zwei Optionen. Sie können diese Benutzeroberfläche verwenden und dem Assistenten durch die Installation folgen oder zu Ihrem Terminal zurückkehren und über ddev einen drush-Befehl übergeben. Die letztere Option automatisiert den Installationsprozess und setzt admin sowohl als Ihren Benutzernamen als auch als Passwort.

Option 1 — Verwenden des Assistenten

Kehren Sie zum Assistenten in Ihrem Browser zurück. Wählen Sie unter Sprache auswählen eine Sprache aus dem Drop-down-Menü aus und klicken Sie auf Speichern und fortfahren. Wählen Sie nun ein Installationsprofil aus. Sie können zwischen Standard, Minimal und Demo wählen. Treffen Sie Ihre Wahl und klicken Sie dann auf Speichern und fortfahren. Drupal überprüft automatisch Ihre Anforderungen, erstellt eine Datenbank und installiert Ihre Site. Ihr letzter Schritt besteht darin, einige Konfigurationen anzupassen. Fügen Sie für die Site einen Namen und eine E-Mail-Adresse, die auf Ihre Domäne endet, hinzu. Wählen Sie dann einen Benutzernamen und ein Passwort. Wählen Sie ein starkes Passwort aus und bewahren Sie Ihre Anmeldedaten an einem sicheren Ort auf. Fügen Sie schließlich eine private E-Mail-Adresse hinzu, die Sie regelmäßig überprüfen, füllen Sie die regionalen Einstellungen aus und klicken Sie auf Speichern und fortfahren.

Ihre neue Site wird mit einer Willkommensnachricht geladen.

Option 2 — Verwenden der Befehlszeile

Führen Sie im root-Verzeichnis Ihres Projekts den Befehl ddev exec aus, um mit drush eine standardmäßige Drupal-Site zu installieren:

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

Dadurch wird Ihre Website wie beim Assistenten erstellt, jedoch mit verschiedenen Standardkonfigurationen. Ihr Benutzername und Passwort werden admin lauten.

Starten Sie nun die Site, um sie in Ihrem Browser anzuzeigen:

ddev launch

Sie sind nun bereit, mit dem Erstellen Ihrer Website zu beginnen. Es gilt jedoch als bewährte Methode zu überprüfen, ob Ihre Berechtigungen für das Verzeichnis /sites/web/default korrekt sind. Solange Sie lokal arbeiten, ist das kein großes Problem; wenn Sie diese Berechtigungen jedoch an einen Produktionsserver übertragen, stellen sie ein Sicherheitsrisiko dar.

Schritt 4 — Überprüfen Ihrer Berechtigungen

Während der Installation mit dem Assistenten oder dem ersten Laden Ihrer Willkommensseite sehen Sie ggf. eine Warnung zu den Berechtigungseinstellungen in Ihrem Verzeichnis /sites/web/default und eine Datei in diesem Verzeichnis: settings.php.

Nach Ausführung des Installationsskripts wird Drupal versuchen, die Berechtigungen für das Verzeichnis web/sites/default festzulegen, um für alle Gruppen zu lesen und auszuführen: Dies ist eine 555-Berechtigungseinstellung. Außerdem wird es versuchen, Berechtigungen für default/settings.php auf schreibgeschützt oder 444 festzulegen. Wenn Sie auf diese Warnung stoßen, führen Sie im root-Verzeichnis Ihres Projekts diese zwei chmod-Befehle aus. Wenn Sie das nicht tun, besteht ein Sicherheitsrisiko:

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

Um zu überprüfen, ob Sie die richtigen Berechtigungen haben, führen Sie diesen ls-Befehl mit den Switches a, l, h und d aus:

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

Überprüfen Sie, ob Ihre Berechtigungen mit der folgenden Ausgabe übereinstimmen:

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

Sie sind nun bereit, auf Ihrem lokalen Rechner eine Drupal 9-Website zu erstellen.

Schritt 5 — Erstellen des ersten Beitrags in Drupal

Um einige Funktionen von Drupal zu testen, erstellen Sie nun mit der Web-Benutzeroberfläche einen Beitrag.

Klicken Sie auf der ersten Seite Ihrer Website auf die Schaltfläche Inhalt am linken Rand des oberen Menüs. Klicken Sie nun auf die Schaltfläche Inhalt hinzufügen. Eine neue Seite wird angezeigt. Klicken Sie auf Artikel, und eine weitere Seite wird angezeigt.

Fügen Sie einen beliebigen Titel und Content hinzu. Sie können auch ein Bild wie eines der Hintergrundbilder von DigitalOcean hinzufügen. Klicken Sie dann auf die blaue Schaltfläche Speichern.

Ihr erster Beitrag wird auf der Website angezeigt.

Sie entwickeln nun eine Drupal 9-Website auf Ihrem lokalen Rechner, ohne jemals mit einem Server zu interagieren (dank Docker und DDEV). Im folgenden Schritt verwalten Sie den DDEV-Container, der Ihren Workflow aufnehmen wird.

Schritt 6 — Verwalten des DDEV-Containers

Wenn Sie Ihr Projekt abgeschlossen haben oder eine Pause machen möchten, können Sie Ihren DDEV-Container anhalten, ohne sich Gedanken über Datenverluste machen zu müssen. DDEV kann zwischen vielen Projekten schnelle Kontextwechsel verwalten; dies ist eine der nützlichsten Funktionen. Ihr Code und Ihre Daten werden stets in Ihrem Projektverzeichnis gespeichert, auch wenn Sie den DDEV-Container angehalten oder gelöscht haben.

Um Ressourcen freizugeben, können Sie DDEV jederzeit anhalten. Führen Sie im root-Verzeichnis Ihres Projekts folgenden Befehl aus:

ddev stop

DDEV ist global verfügbar, sodass Sie ddev-Befehle von überall her ausführen können, solange Sie das DDEV-Projekt angeben:

ddev stop d9test

Außerdem können Sie mit ddev list alle Ihre Projekte auf einmal anzeigen:

ddev list

DDEV umfasst viele andere nützliche Befehle.

Sie können DDEV neu starten und jederzeit lokal weiterentwickeln.

Zusammenfassung

In diesem Tutorial haben Sie Docker und die Vorteile von Containerisierung verwendet, um mit Hilfe von DDEV lokal eine Drupal-Site zu erstellen. DDEV lässt sich in zahlreiche IDEs einbinden und bietet natives PHP-Debugging für Atom, PHPStorm und Visual Studio Code (vscode). Nun können Sie mehr über das Erstellen von Entwicklungsumgebungen für Drupal mit DDEV oder das Entwickeln anderer PHP-Frameworks wie Wordpress erfahren.