Shopware im Docker-Container auf Windows

Shopware im Docker-Container auf Windows

5. September 2021 0 Von Roger Gerecke

Eine deutsche Anleitung zur Nutzung von Shopware in einem Docker Container. Dazu nutzen wir das fertige Docker Image Namens Dockware. Wir verzichten auf die Nutzung der bind mount Möglichkeit von Docker da diese auf Windows langsam ist außer man richtet eine WSL2 ein, aber das finde ich auch nicht so schön darum nutzen wir PhpStorm mit SFTP Autoupload.

Wie ist das mit Docker?  Also Shopware ist in einem Virtuellen Docker-Container installiert die Dateien von dem Shopware System liegen auch im Container.  Wir erstellen uns ein Projekt in PhpStorm und Kopieren uns die Dateien in unser Projekt, wenn wir was an den Dateien ändern, werden diese per SFTP Automatisch wieder in den Docker-Container hochgeladen.  In dem Docker-Container wartet ein File-Watcher der Veränderung an den Dateien bemerkt und augenblicklich neu lädt so ist im Browser immer die Updates Live zu sehen.

Voraussetzung

Wir haben Docker und PhpStorm installiert und verfügen über kleine Grundkenntnisse im Umgang.

Struktur

  • PhpStorm Projekt anlegen
  • Docker Starten
  • Dateien ins Projekt runterladen
  • Docker File Watcher starten
  • TIP: twig.yaml

PhpStorm Projekt anlegen

In PhpStorm ein neues leeres PHP-Projekt anlegen.  In dem Projekt Ordner gleiche ein neues Verzeichnis anlegen mit den Namen src

Docker Compose File erstellen

Im Anschulss nachdem wir in PhpStorm ein neues Projekt angelegt haben erstellen wir dort eine neues docker-compose.yml

version: '3'
services:
  shop:
    container_name: shop
    image: dockware/dev:latest
    ports:
      - "22:22"     # ssh
      - "80:80"     # apache2
      - "443:443"   # apache2 https
      - "8888:8888" # watch admin
      - "9998:9998" # watch storefront proxy
      - "9999:9999" # watch storefront
      - "3306:3306" # mysql port
    # keep in mind we use SFTP dont mix it with bind mount bnid mount ist shit on windows
    #volumes:
    #  - "./src:/var/www/html"
    #  - "./src:/var/www/html/custom/plugins"
    networks:
      - web
    environment:
      - XDEBUG_ENABLED=1
## ***********************************************************************
##  NETWORKS
## ***********************************************************************
networks:
  web:
    external: false

dadurch kommen wir in die komfortable Situation direkt aus PhpStorm heraus den Docker-Container zu erstellen.

Docker Starten

Dadurch das wir im vorherigen schritt ein docker-compose.yml Datei erstellt haben brauchen wir diese Datei nur in PhpStorm öffnen und sozusagen nur auf den Playbutton zu drücken dieser führt automatisch den Befehl docker-compose up mit dieser Datei aus.  Nachdem alle Dateien heruntergeladen wurde und der Container gestartet ist wird einem das im PhpStorm Terminal Fenster angezeigt.

SFTP Verbindung einstellen in PhpStorm

Unter Einstellung in PhpStorm File | Settings | Build, Execution, Deployment | Deployment legen wir eine neue SFTP Verbindung an mit folgenden Login Daten:

Type: SFTP

Host: localhost

Port: 22

User: dockware

Password: dockware

Root paht: /var/www/html

Mappings:

Local path: C:\Users\winuser\PhpstormProjects\yourprojektname\src

Außerdem sollten wir oben im Menu auf den kleinen Hacken klicken um dieser Verbindung als unsere Standardverbindung zu definieren.

Danach sollten wir unbedingt das Automatische hochladen für unseren Standard SFTP Server einstellen. Unter File | Settings | Build, Execution, Deployment | Deployment | Options

Dateien ins Projekt runterladen

Wir können die Shopware Dateien jetzt herunterladen über SFTP in unser angelegtes scr Verzeichnis in unseren PHP-Projekt Ordner.

Docker File Watcher starten

Um den File Watcher zu starten, brauchen wir uns nur in den Docker-Container einloggen und dort im Hauptverzeichnis das make file zu nutzen.

Also unten in PhpStorm ein Terminal Fenster öffnen und mit dem Befehl in den Docker-Container einloggen:

Docker exec -it shop bash

Dann eine Verzeichnis ebene tiefer wechseln:

cd ..

Mit dem make Befehl kann man sich nun die Optionen aus dem makefile anzeigen lassen:

C:\Users\fart>docker exec -it shop bash
www-data@7425ff5bdc8d:~/html$ cd ..
www-data@7425ff5bdc8d:~$ ls
CHANGELOG.md  html  makefile  pimpmylog  scripts
www-data@7425ff5bdc8d:~$ make
status                         status infos
xdebug-on                      enables xdebug
xdebug-off                     disables xdebug
permission-repair              repairs the general file permissions
watch-storefront               starts watcher for storefront at http://localhost
stop-watch-storefront          Reverts everything back to normal operation
watch-admin                    starts watcher for Shopware 6.4.3.1 Admin at http://localhost:8888
build-admin                    builds the admin
www-data@7425ff5bdc8d:~$

Jetzt können wir den File Watcher starten mit dem make watch-storefront Befehl:

watch-storefront               starts watcher for storefront at http://localhost
stop-watch-storefront          Reverts everything back to normal operation
watch-admin                    starts watcher for Shopware 6.4.3.1 Admin at http://localhost:8888
build-admin                    builds the admin
www-data@7425ff5bdc8d:~$ make watch-storefront
.
.

Ab jetzt ist die Storefront mit dem File Watcher verbunden und ist über folgende URL mit dem Port abrufbar. Das Stylesheet wird jetzt nachgeladen. http://localhost:9998/

Admin http://localhost/admin

User: admin

Password: shopware

TIP: twig.yaml

Für bessere Theme Development den Twig cache deaktivieren in der twig.yaml

cache: false

Quellen:

https://docs.dockware.io/use-dockware/default-credentials

https://dockware.io/

https://www.shopware.com/de/changelog/