Einrichten einer lokalen Umgebung mit Virtual Box

Einleitung

Dieser Artikel zeigt Dir, wie Du eine virtuelle Maschine für eine lokale Shopware 6-Umgebung im Entwicklungsmodus einrichten kannst. Einige von Euch sind vielleicht über die Einschränkungen von Shopware gestolpert, wenn es um Windows als Betriebssystem geht. Jeder, der vielleicht schon einmal versucht hat, Shopware unter Windows zum Laufen zu bringen, weiß, dass es eher zum Scheitern als zum Erfolg führt. Es ist wichtig, ein Unix-basiertes System (wie Linux oder MacOS) als Umgebung für ein lokales Setup zu verwenden. Sicherlich ist aber nicht jeder so vertraut mit Linux oder hat ein Apple-Produkt, mit dem er arbeiten kann. Diese Anleitung wird Dir helfen, eine virtuelle Linux-Maschine auf Deinem lokalen Betriebssystem einzurichten, unabhängig davon, welches Betriebssystem Du gerade verwendest.

Als erstes benötigst Du eine lokale Installation von Virtual Box von Oracle. Lade diese einfach von https://www.oracle.com/de/index.html herunter und starte den Installationsvorgang. Der Hauptgrund für ein Virtual Box-Image ist, dass Du es unabhängig auf jedem von Dir genutzten Betriebssystem verwenden kannst - auch wenn Du in Zukunft z. B. von Windows zu MacOS wechselst. Da die Einstellungen innerhalb des virtuellen Images gespeichert werden, bleibt bei einer Neuinstallation Deines Laptops die Konfiguration erhalten und Du bist in wenigen Schritten nach der Installation der virtuellen Box einsatzbereit.

Ubuntu herunterladen

Diese Anleitung wird sich auf Ubuntu konzentrieren und es als Grundlage für die Einrichtung verwenden. Ubuntu ist eine verbreitete und gut dokumentierte Linux-Distribution und ist vielleicht die beste Wahl für Anfänger. Da wir nicht die gesamte Desktop-Manager-Version von Ubuntu benötigen, kannst Du einfach das Netzwerk-Installations-Image von der Ubuntu-Website herunterladen: https://ubuntu.com/download/alternative-downloads

Warte einfach, bis der Download beendet ist, und beginne dann in den nächsten Schritten mit der Konfiguration der virtuellen Box.

Anlegen eines Virtual Box Images

Als erstes msst Du Deine neu installierte Virtual Box starten. Erstelle einfach eine neue virtuelle Maschine, indem Du die Schaltfläche "Neu" auf der rechten Seite des neuen Menüs verwenden oder das obere Menü verwenden (Maschine -> Neu).

Weiter musst Du festlegen, welches Betriebssystem Du virtualisieren möchtest und wählst "Typ: Linux" und "Version: Ubuntu" im Untermenü. Den Namen für das neu erstellte Virtual Box-Image kannst Du frei wählen.
Bestätige Deine Auswahl mit "Weiter".Das nächste Kontextmenü fragt Dich nach der bevorzugten Speichergröße, wir empfehlen 2GB oder mehr für Deine Umgebung, aber das hängt stark von den verfügbaren Ressourcen auf Deinem Computer ab (wenn Du z.B. nur 4gb RAM hast, kannst Du nicht mehr als 2GB zur virtuellen Maschine hinzufügen). In unserem Fall werden wir "2048MB" als Auswahl verwenden. Bestätige, um zum nächsten Schritt zu gelangen.
Nun musst Du Deine Festplatte für die virtuelle Maschine definieren - lasse die Auswahl einfach auf "Festplatte erzeugen" stehen und bestätige dies mit dem "Erzeugen"-Button.

Innerhalb des sich neu öffnenden Fensters kannst Du die Auswahl bei "VDI (VirtualBox Disk Image") belassen und mit "Weiter" fortfahren. Das neue Image sollte in unserem Fall "Dynamisch alloziert" sein und 15-20GB sollten für die lokale Umgebung ausreichen. Die Schritte zeigen Dir umfassend, was zu tun ist. Nachdem Du die Konfiguration Deiner VM abgeschlossen hast, befindest Du Dich wieder auf dem Startbildschirm von oben.

Bevor wir unsere neu erstellte virtuelle Box starten, müssen wir einige zusätzliche Konfigurationen vornehmen. Wähle einfach die neu erstellte VM aus und öffne das Menü "Einstellungen". Wechsel in die "Netzwerk"-Konfiguration und öffne die versteckte "Erweiterte" Konfiguration. In diesem Abschnitt findest Du die "Portweiterleitung" - klicke einfach auf diese Schaltfläche und es öffnet sich folgendes Untermenü:

Füge die Konfiguration aus dem Screenshot hinzu, um Deine VM von Deinem lokalen Computer auf localhost verfügbar zu machen. Wenn Du diese Ports ändern musst, behalte diese Änderungen bitte im Hinterkopf, da wir sie später noch benötigen. Oft sind auf dem lokalen Rechner bereits Dienste vorhanden, die auf Port 22 und 80 lauschen, daher haben wir die Host-Ports auf unbenutzte Ports geändert. Bestätige Deine Auswahl und schließe die Untermenüs.

Umgebung einrichten

Ubuntu einrichten

Starte einfach Deine neu erstellte virtuelle Maschine im Hauptmenü der Virtual Box. Da die virtuelle Umgebung vorerst leer ist, musst Du Deine heruntergeladene iso-Datei von Ubuntu in das Menü einfügen. Wähle diese einfach von Deiner Festplatte aus und drücke die Start-Taste.
Das System bootet von Deiner Ubuntu-ISO und zeigt den Bootloader mit einigen Auswahlmöglichkeiten an. Starte in diesem Fall die Standardinstallation.
Der Ubuntu-Installer wird gestartet und Du wirst nach Deiner bevorzugten Sprache und Region gefragt. Nachdem Du Deine Auswahl bestätigt hast, versucht das System, Deine Tastaturbelegung zu fest zu legen, dies kann automatisch oder durch Auswahl der richtigen erfolgen. Stell in jedem Fall sicher, dass Du das richtige Layout auswählst. Nachdem diese grundlegende Systemkonfiguration abgeschlossen ist, stellt der Installer eine Verbindung zu den Ubuntu-Servern her, um die benötigten Pakete für die Installation herunterzuladen. Du wirst aufgefordert, einen Hostnamen (Du kannst einen beliebigen wählen) und einen Mirror (wähle einfach den vordefinierten) anzugeben. Wenn Du einen Proxy für Deine Internetverbindung verwendest, kannst Du diesen ebenfalls konfigurieren, aber in den meisten Fällen musst Du hier nichts tun.
Der nächste Schritt ist die Einrichtung des Benutzernamens und des Passworts. In unserem Fall wählen wir als Benutzernamen "shopware" und als Passwort "shopware", Du kannst aber auch ein anderes festlegen - achte aber bitte darauf, dass Du es Dir merken kannst. Die Zeitzone wird anschließend erkannt, Du musst diese nur ändern, wenn sie wirklich von Deiner aktuellen Zeitzone abweicht.
Wähle einfach im nächsten Menü die geführte Aufteilung der Festplatte und fahre mit der Installation fort und schreibe Deine Änderungen auf die Platte. Die Grundinstallation der Software wird nun durchgeführt. Da die meisten Pakete von den Ubuntu-Servern heruntergeladen werden, wird dies je nach Internetverbindung eine Weile dauern. Wenn Du möchtest, kanns Du im nächsten Schritt Sicherheitsupdates installieren. Im weiteren Verlauf werden wir nach zusätzlicher Software gefragt, die eventuell installiert werden muss. Wähle aus diesem neuen Menü "LAMP-Server" (Apache, MySQL, PHP) und "OpenSSH-Server" (die Auswahl kann durch Drücken der Leertaste erfolgen). Der Prozess installiert die neu gewählte Software und den Bootloader (eventuell musst Du dies noch bestätigen). Beende die Installation und wir sind bereit, einige zusätzliche Konfigurationen des Systems vorzunehmen.
 

Ubuntu Konfiguration

Entferne das Ubuntu-ISO aus der VM (durch Klicken auf das kleine CD-ROM-Symbol am unteren Rand des VM-Fensters) und fahre Dein neu erstelltes virtuelles Image herunter. Starte es erneut, während Du die "Shift"-Taste gedrückt hätst. Dadurch wird die VM im Hintergrund gestartet und wir können über SSH auf sie zugreifen. In den meisten Umgebungen ist dies über ein Terminal mit dem Befehl "ssh shopware@127.0.0.1 -p2222" möglich. Bitte achte darauf, dass Du Deinen neu angelegten Benutzer anstelle von "shopware" einträgst, falls dieser abweicht. In Windows-Umgebungen wird für SSH-Verbindungen eine Software wie Putty verwendet, aber Du kannst auch das VM-Fenster verwenden, wenn Du keine zusätzliche Software verwenden möchtest.

Zunächst einmal kannst Du Deine Installation überprüfen. Öffne einfach 127.0.0.1:8080 (beachte, dass Du diesen Port möglicherweise geändert hast) - eine Apache-Testseite sollte in Deinem Browser sichtbar sein. Im Terminal kannst Du die Installation von PHP mit "php -v" überprüfen und es wird Dir die verwendete PHP-Version angezeigt (sie sollte mindestens 7.4 sein).

Wir müssen ein Passwort für MySQL festlegen - dies kannst Du mit den folgenden Befehlen tun:

sudo mysql
ALTER USER 'root'@'localhost' IDENTIFIED WITH mysql_native_password BY 'root';
FLUSH PRIVILEGES;
exit

 

In unserem Fall werden wir das Passwort des Benutzers "root" auf "root" setzen. Möglicherweise möchtest Du dies ändern, aber denk daran, sich dieses Kennwort zu einem späteren Zeitpunkt zu merken.

Installation von Abhängigkeiten

Um Shopware verwenden zu können, musst Du einige zusätzliche Abhängigkeiten auf Deinem lokalen Rechner installieren. Dies kann mit den folgenden Befehlen erfolgen:

sudo apt-get install php-intl php-xml php-zip php-apcu php-mbstring php-json php-gd unzip nodejs openssh-server git php-curl curl npm

Stelle nach der Installation sicher, dass Du eine aktuelle Version von npm verwendest, indem Du diesen Befehl ausführst:

sudo npm install -g npm@latest

Installation der Virtual Box Gasterweiterungen

Für eine reibungslose Integration von Virtual Box auf Deinem Computer empfehlen wir, die Gasterweiterungen zu Deiner virtuellen Maschine hinzuzufügen. Öffne einfach Deine virtuelle Maschine (Schaltfläche "anzeigen" im Hauptmenü der Virtual Box) und füge sie über das Kontextmenü Geräte -> Gasterweiterung einlegen... hinzu. Nachdem das Image eingelegt ist, musst Du es mounten und die Installation starten:

sudo mount /dev/cdrom /mnt
cd /mnt
sudo ./VBoxLinuxAdditions.run
sudo reboot

Möglicherweise musst Du die SSH-Verbindung nach einem Neustart erneut aufbauen.

Konfiguration von Apache

Als erstes musst Du mod-rewrite aktivieren, dies kannst Du tun, indem Du den folgenden Befehl in Deiner virtuellen Maschine ausführst:

sudo a2enmod rewrite

Danach musst Du eine neue vhost-Konfiguration hinzufügen, deaktiviere einfach die bestehende:

sudo a2dissite 000-default.conf

Und zu guter Letzt musst Du eine neue Konfiguration erstellen:

sudo nano /etc/apache2/sites-enabled/sw6.conf

Füge einfach die folgende Konfiguration in den Editor ein:

<VirtualHost *:80>
        <Directory "/var/www/html/sw6/public">
            Options FollowSymLinks
            AllowOverride All

            Order allow,deny
            Allow from all
        </Directory>

        ServerAdmin webmaster@localhost
        DocumentRoot /var/www/html/sw6/public

        ErrorLog ${APACHE_LOG_DIR}/error.log
        CustomLog ${APACHE_LOG_DIR}/access.log combined
</VirtualHost>

Mit STRG + O kannst Du es speichern und mit STRG + X verlässt Du den Editor. Danach musst Du den Webserver neu starten:

sudo service apache2 restart

Da Linux ein System ist, das sehr streng mit der Rechte- und Berechtigungsverwaltung ist, müssen wir den Benutzer "shopware" zur Gruppe "www-data" hinzufügen, um Probleme mit den Berechtigungen zu vermeiden:

sudo usermod -g www-data shopware
sudo chown -R www-data:www-data /var/www/
sudo chmod 0777 -R /var/www/html
sudo reboot

Möglicherweise musst Du die SSH-Verbindung nach dem Neustart der VM neu starten.

Installation von Composer

Beachte, dass sich die Verifizierung des Installers ändern kann, daher musst Du die Befehle von der Composer-Website verwenden, um sicherzugehen, die aktuelle zu nutzen: https://getcomposer.org/download/

For Example:

php -r "copy('https://getcomposer.org/installer', 'composer-setup.php');"
php -r "if (hash_file('sha384', 'composer-setup.php') === '756890a4488ce9024fc62c56153228907f1545c228516cbf63f885e036d37e9a59d27d63f46af1d4d07ee0f76181c7d3') { echo 'Installer verified'; } else { echo 'Installer corrupt'; unlink('composer-setup.php'); } echo PHP_EOL;"
php composer-setup.php
php -r "unlink('composer-setup.php');"

Nachdem Du Composer erfolgreich heruntergeladen hast, musst Du ihn über den Befehl "composer" ausführbar machen, kopiere ihn einfach in den Ordner /bin:

sudo mv composer.phar /bin/composer

Du kannst Deine Installation überprüfen, indem Du "composer" in Deinem Terminal ausführst.

Installation der Shopware 6 Entwicklerumgebung

Shopware 6 gibt es in zwei verschiedenen Versionen. Es gibt ein offizielles Release-Paket für Produktionssysteme, das Dir keine Entwicklungswerkzeuge zur Verfügung stellt (z. B. zum Erstellen von Erweiterungen) und es gibt das GitHub-Repository, das Deine Entwicklungsumgebung sein wird. Wechsel das Verzeichnis in den Web-Ordner und lade Shopware 6 von Github herunter:

cd /var/www/html
git clone https://github.com/shopware/development.git sw6

Um die Installation zu starten, kannst Du einfach die folgenden Befehle ausführen, ein Assistent wird Dich durch die Installation von Shopware führen.

cd sw6
php bin/setup

Du wirst nach Deiner Umgebung (wähle "dev"), Deiner öffentlichen Url (in unserem Fall http://127.0.0.1:8080, der Port kann je nach Deiner Konfiguration abweichen), Deiner Datenbank (behalte localhost, shopware als Datenbankname und root/root als Benutzer/Passwort) gefragt.

Nachdem Du Deine Eingaben bestätigt hast, wird die Installation durchgeführt. Es dauert 37 Schritte, bis diese Installation abgeschlossen ist, daher musst Du möglicherweise ein wenig warten. Die Composer-Abhängigkeiten werden zunächst heruntergeladen. 
Bei der nächsten Installation werden sie aus dem Cache geholt, was die Installation etwas beschleunigt. Wenn die Installation abgeschlossen ist, kannst Du über Deinen Browser auf die Installation in Deiner lokalen Umgebung zugreifen: http://127.0.0.1:8080. Die Administration ist mit /admin und der Benutzer/Passwort-Kombination admin/shopware erreichbar.

Optionale Konfiguration

Installation zurücksetzen

Da der Master-branch von Shopware 6 häufig aktualisiert wird, möchtest Du möglicherweise Deine Installation zurücksetzen. Dies kann einfach durch Löschen des Ordners und erneutes Klonen des Repositorys geschehen. Wenn Du dies per Script realisieren möchtest, haben wir hier ein Beispiel:

nano /sw6.sh

Füge folgenden Inhalt hinzu:
 

#!/bin/bash
sudo mv /var/www/html/sw6/.psh.yaml.override /var/www/html/.psh.yaml.override
sudo rm -R /var/www/html/sw6
cd /var/www/html
git clone -b master https://github.com/shopware/development.git sw6
cp /var/www/html/.psh.yaml.override /var/www/html/sw6/.psh.yaml.override
cd /var/www/html/sw6
composer install
php psh.phar install

Jetzt kannst Du Deine gesamte Installation neu installieren, indem Du einfach das neu erstellte Skript ausführst. Mache es einfach ausführbar und verschiebe es in den Ordner /bin:

sudo chmod +x sw6.sh
sudo mv sw6.sh /bin/sw6

Update den Master branch

In einigen Fällen möchtest Du vielleicht Deine Einstellungen und die Datenbank behalten und nur die neuesten Dateien von Github beziehen. Dies kann mit den folgenden Befehlen innerhalb des Shopware 6-Ordners erreicht werden:

git pull
composer update
php bin/console database:migrate
php bin/console database:migrate --all Storefront
php bin/console cache:clear
php psh.phar storefront:build
php psh.phar administration:build

 
Erstelle Dir gerne auch hierzu ein script, so wie oben. 
 

Installation eines Release-Tag

Da wir bereits eine freigegebene Version von Shopware 6 auf unserer Download-Seite zur Verfügung haben, möchtest Du vielleicht genau diese Version anstelle des aktuellen Master-branches installieren. Dies erreichst Du, indem Du einen spezifischen Parameter hinzufügst, der auf das Tag verweist:
 

git clone --branch v6.0.0+ea1 https://github.com/shopware/development.git

 

PHPStorm Konfiguration

Da Du dieses Setup als Entwicklungsumgebung verwenden kannst, möchstest Du PHPStorm sicherlich entsprechend konfigurieren. Wenn Du ein neues Projekt in PHPStorm erstellst, kannst Du im Untermenü die Option "Create new project from existing files" wählen. Wähle einfach "Web server is on remote host, files are accessible via FTP/SFTP/FTPS".
 
Wenn Du zum nächsten Schritt gehst, musst Du einen Projektnamen und einen lokalen Ordner hinzufügen (Du kannst alles wählen).
Im nächsten Fenster musst Du Deine SSH/SFTP-Konfiguration der virtuellen Umgebung hinzufügen.
 
Beende danach einfach den Assistenten ohne weitere Konfiguration und der Download Deiner Projektdateien wird gestartet. Dies kann eine Weile dauern. Nach dem Download kannst Du diese Verbindung nutzen, um lokal auf z. B. Windows zu entwickeln und Deine Änderungen in die virtuelle Linux-Umgebung hochzuladen.
   

Visual Studio Code Konfiguration

Visual Studio Code könnte eine gute Alternative zu PHPStorm sein, wenn es um die Lizenzkosten geht, da es komplett kostenlos ist. Du kannst auch hier einen Remote-Host hinzufügen, aber dann benötigst Du das "Visual Studio Code Remote Development Extension Pack" aus der Erweiterungsliste. Öffne die Erweiterungsliste auf der linken Seite und suche nach dieser Erweiterung und installiere sie. Eventuell ist ein Neustart erforderlich. Nach dem Neustart erscheint auf der linken Seite des Visual Studio Code-Menüs ein ganz neues Menü.

Erzeuge eine neue ssh Konfiguration:

Host 127.0.0.1
    HostName 127.0.0.1
    User shopware
    Port 2222

Beim ersten Verbindungsversuch kann es vorkommen, dass Du ein neues Eingabefeld für das Passwort erhältst:
Anschließend kannst Du über das Terminal und den Datei-Editor von Visual Studio Code auf Deine Shopware 6-Installation zugreifen und die Entwicklung starten.
 

VM herunterladen 

Wir empfehlen dringend, eine eigene VM zu erstellen, um die Schwierigkeiten und Herausforderungen bei der Verwendung von Linux kennenzulernen. Dennoch bieten wir Dir eine fertige VM, die regelmäßig aktualisiert wird: shopware.ova

Verwende einfach den Importdialog von Virtual Box, alle Einstellungen werden importiert.
Shopware 6:

• Frontend: 127.0.0.1:8080
• Administration; 127.0.0.1:8080/admin
• Admin Username/Password: admin/shopware
   

Virtuelle Machine:

• SSH-Host/Port: 127.0.0.1 / Port 2222
• SSH Username/Password: shopware/shopware
• Datenbank Username/Password: root/root

Bitte beachte, dass in dieser VM bereits eine Installation vorhanden ist. Wenn Du sichergehen willst, dass es sich um den aktuellen Master handelt, führe bitte den Befehl "sw6" innerhalb der VM aus, um die neueste Version auszuchecken.

Als einen Schritt des Installationsprozesses richten wir eine Netzwerkfreigabe ein, auf die Du direkt von Deinem lokalen Computer aus zugreifen kannst, ohne eine SSH/SFTP-Verbindung zu verwenden. Diese ist ebenfalls Teil der VM. In den nächsten Schritten zeigen wir Dir, wie Du es auf Deinem lokalen Computer verwenden kannst.

 

MacOS Netzwerkfreigabe

Öffne den Finder und gehe oben auf das Menü "Gehe zu". Öffne "Mit Server verbinden...". Füge in dem neuen Fenster die Adresse und den Port Deiner Netzwerkfreigabe hinzu:

smb://127.0.0.1:4455/VM

  Um das Einrichten der lokalen Netzwerkfreigabe abzuschließen, klicke auf "Verbinden" in diesem Menü. Der Finder stellt dann eine Verbindung zur Netzwerkfreigabe her und Du kannst diese Dateien als lokalen Ordner verwenden:

Windows Netzwerkfreigabe

Leider ist es unter Windows nicht möglich, ein Netzlaufwerk auf eine Freigabe in der VM unter der IP 127.0.0.1 zu mappen. Hierfür sind einige Anpassungen notwendig

Netzwerk Adapter in Virtual Box
Ändere zunächst im Virtual Box Manager für die Shopware-VM den Netzwerkadapter von NAT auf Netzwerkbrücke.
(Es ist notwendig, dass die VM zu diesem Zeitpunkt ausgeschaltet ist)
Wähle unter Einstellungen > Netzwerk > Adapter 1 > Angeschlossen an: Bridged Adapter

Damit wird der VM über den DHCP-Server im Netzwerk eine neue, eigene IP-Adresse zugewiesen.
(Wenn kein DHCP-Server im Netzwerk verfügbar ist, muss der VM manuell eine IP zugewiesen werden).

Die von DHCP zugewiesene IP herausfinden
Dies ist z. B. über die im Fenster der VM angezeigte Konsole möglich.
Gebe dazu in der Konsole ipconfig ein und die IP-Einstellungen werden aufgelistet.
(Hierfür wird net-tools benötigt. Dieses ist in der vorbereiteten VM enthalten, wenn Du ein eigenes System hast, musst Du es ggf. installieren).

Jetzt ist die Verbindung über SSH über die IP der VM und Port 22 möglich

Einstellungen in Shopware anpassen
Rufe zunächst den Admin über http://IPderVM/admin auf.
Nun ist es notwendig, die URL für den Verkaufskanal "Storefront" im Bereich "Domains" auf http://IPderVM anzupassen.
Nachdem Du die URL-Änderung gespeichert hast, kannst Du über IPderVM direkt das Frontend aufrufen
 
Mapping des Netzlaufwerkes
Es ist nun möglich, das Netzlaufwerk in Windows einzubinden.
Gehe dazu wie folgt vor:

Öffne "Dieser PC" und klicke im Register "Computer" auf "Netzlaufwerk verbinden".

Wähle im neuen Fenster einen Laufwerksbuchstaben und gebe als Ordner "\\IPderVM\VM" ein und setze außerdem ein Häkchen bei "Verbindung mit anderen Anmeldeinformationen herstellen"
Optional kannst Du auch "Verbindung bei Anmeldung wiederherstellen" ankreuzen

Wenn Du auf die Schaltfläche Fertig stellen klickst, wird ein Fenster zur Eingabe der Anmeldedaten angezeigt.
Gebe als Benutzer "ubuntu/shopware" und als Passwort "shopware" ein.
(wenn die Verbindung bei der Anmeldung neu aufgebaut werden soll, empfiehlt es sich, die Anmeldedaten zu speichern).

Nach dem Bestätigen über die Schaltfläche OK ist die Verbindung nun hergestellt und das Netzlaufwerk verbunden.