Een lokale Magento 2 ontwikkelomgeving opzetten met Docker en de Hypernode container

In deze blog leggen we je uit hoe je een lokale Magento 2 ontwikkelomgeving kunt opzetten. Een lokale ontwikkelomgeving heeft de voorkeur over een ontwikkelomgeving op de server. De reden hiervan is simpel, je webshop kan flink last hebben van deze ontwikkelomgeving op dezelfde server. Daarom leggen we je uit hoe je zo’n ontwikkelomgeving lokaal opzet met Docker en de Hypernode container.

Heb je na het lezen van de titel al hoofdpijn? Dan is deze blog eerder iets voor jou.

Stappenplan: lokale Magento 2 ontwikkelomgeving opzetten

Het opzetten van een lokale Magento 2 ontwikkelomgeving met de Hypernode Docker Container gebeurt in 3 stappen, met een optionele vierde stap:

  1. Docker container opzetten en configureren
  2. Extra Hypernode configuratie
  3. Magento 2 installeren op de Hypernode
  4. Optioneel: PHPmyAdmin op de Hypernode

via GIPHY

1. Docker container opzetten en configureren

Om deze onwikkelomgeving duidelijk op te kunnen zetten moeten er een mappenstructuur opgezet worden met daarbij een Dockerfile. Een Dockerfile is een bestand waarin je instructies kunt zetten, op basis waarvan vervolgens een image opgebouwd wordt. Deze image is wat we daadwerkelijk gaan opstarten en deze bevat dan ook de complete Hypernode server. We koppelen de Magento 2 map van de container aan de LOCAL map zodat je ook zonder SSH of SFTP met de bestandsverkenner van linux bij de Magento 2 bestanden kunt.

Voorgestelde structuur

De voorgestelde structuur is precies wat de naam al zegt: voorgesteld. Het is niet verplicht deze aan te houden. Doe je het liever anders? Doe dat dan gerust. Deze voorgestelde structuur is hoe we bij Webwijs het liefste werken, voor het doel van dit artikel houden we de volgende structuur aan:

PROJECTMAP (map)
------ LOCAL (map)
------ Dockerfile (bestand)

Dit komt neer op een mappenstructuur als volgt:

Webwijs
------ LOCAL
------ Dockerfile

Inhoud Dockerfile

In de Dockerfile staan dus de instructies waarmee de image wordt opgebouwd. Onze Dockerfile heeft de volgende inhoud:

FROM docker.hypernode.com/byteinternet/hypernode-docker:latest
MAINTAINER Mark Postema <mark@webwijs.nu>
RUN echo "app ALL = (ALL) NOPASSWD: ALL" >> /etc/sudoers
RUN apt-get update && apt-get install -y php-xdebug

De regel met “MAINTAINER Mark Postema <mark@webwijs.nu>” is naar wens in te vullen, hier kun je jouw eigen gegevens invullen als beheerder van de image. Bekijk hier de Dockerfile.

Image building

Dat was het voorwerk alweer! Nu is het tijd voor het ‘builden’ van de image. Dit doe je in de terminal vanuit de projectmap waar je ook het Dockerfile hebt staan. In mijn geval is de project map ~/Dockers/Webwijs. De image is als volgt aan te maken:

docker build -t localhypernode .

Hierboven geven we de image de naam “localhypernode”, maar dit mag ook een andere naam zijn. De naam van je image heeft effect op de volgende stappen.

Na het klaarzetten van de image kun je deze gebruiken om de Docker container op te zetten. Dit doe je met het volgende commando:

docker run -v ~/.cache/composer:/data/web/.composer/cache -v ~/.composer/auth.json:/data/web/.composer/auth.json -v ~/Dockers/Webwijs/LOCAL:/data/web/magento2 --name webwijs -d localhypernode

Bij bovenstaande commando zijn 3 dingen belangrijk:

  • Het pad naar de LOCAL map;
    De LOCAL map is dezelfde map die we hebben aangegeven in de mappenstructuur. Deze map is waar je via de bestandsverkenner bij de magento installatie kunt. Dit is niet verplicht, maar kan handig zijn.
  • De naam die we aan de docker container zelf geven;
    Dit is hier “webwijs”, deze mag ook naar wens aangepast worden.
  • De image name;
    Hier gebruiken we “localhypernode”. Heb je je image hierboven anders genoemd, dan moet je die hier ook aanpassen.

Container toewijzen

Het enige dat nu nog gedaan moet worden is de /data/web map van de “webwijs” docker container toewijzen aan de app user. Dit doe je als volgt:

docker exec webwijs chown -R app:app /data/web/

Om via SSH te kunnen verbinden met je vers opgestarte Docker container moet je natuurlijk wel het correcte IP adres hebben, deze kun je als volgt vinden:

docker inspect webwijs | grep IPAddress

Met het IP adres wat je nu weet kun je inloggen in je Docker container, in mijn geval is het IP 172.17.0.2:

ssh app@172.17.0.2

Het wachtwoord van je Hypernode container: insecure_docker_ssh_password

2. Extra Hypernode configuratie

Op dit moment wordt de Hypernode Docker container standaard met PHP 7.1 aangeleverd. Op zich prima, wanneer je een oudere versie van Magento 2 hebt. Maar dit gaat bij nieuwere Magento 2 versies problemen geven met inloggen. Gelukkig is het een eitje om de PHP versie van de Hypernode Docker naar 7.2 te zetten.

PHP versie aanpassen

Je kunt met het volgende commando zien welke PHP versie je Docker container draait:

php -v

Zie je hier PHP 7.1 of lager staan? Dan is het verstandig om de versie aan te passen. Hieronder lopen we de stappen met je door om dit te doen.

Open het bestand “/etc/my_init.d/60_restart_services.sh” middels :

sudo nano /etc/my_init.d/60_restart_services.sh

(als hier gevraagd wordt om een wachtwoord, hier kun je je SSH wachtwoord gebruiken)

Verander vervolgens de PHP versie, in ons geval veranderen we dit:

update-alternatives --set php $(which php7.1)

in

update-alternatives --set php $(which php7.2)

en sla het bestand vervolgens op.

Herstart vervolgens alle Hypernode diensten:

sudo bash /etc/my_init.d/60_restart_services.sh

Hypernode configuratie

Om Magento 2 in development modus te kunnen draaien is de volgende aanpassing nodig. Zonder deze aanpassing worden er geen static symlinks aangemaakt en zal de static content voor elke wijziging opnieuw gedeployed moeten worden. Dat hebben we liever niet dus voeg de volgende regels toe aan /data/web/nginx/server.rewrites:

location /static/ {
    if (!-f $request_filename) {
        rewrite ^/static/(version\d*/)?(.*)$ /static.php?resource=$2 last;
    }
}

Het is mogelijk dat deze stap overbodig wordt bij een update van de Hypernode Docker image, maar bij de huidige versie is dit vereist.

3. Magento installatie

De container is nu opgestart zoals het zou moeten. We moeten nog wel vertellen aan de Hypernode dat we aan de slag gaan met Magento 2:

touch ~/nginx/magento2.flag

Vervolgens is het zaak de “magento2” map aan te maken binnen de container:

mkdir ~/magento2
cd ~/magento2

En om de meest recente versie Magento 2 te downloaden:

wget -qO- https://magento.mirror.hypernode.com/releases/magento2-latest.tar.gz | tar xfz -

De lege “magento2” database maak je als volgt aan:

echo "create database magento2" | mysql

Hier kan ook weer een andere naam gekozen worden dan “magento2”. Dus wees creatief, of juist niet 😉

Om Magento 2 aan te sturen vanuit de terminal zaul je vaak “bin/magento” aanroepen. Om dit goed te kunnen doen zetten we de rechten goed:

chmod 755 bin/magento

Een makkelijke manier om achter de database inloggegevens te komen op een Hypernode container is door het volgende commando uit te voeren:

cat ~/.my.cnf

We zijn toe aan het installeren van Magento 2. Het hieronder staande commando zal nog aangevuld moeten worden met de correcte database gegevens die je hebt opgezocht in de vorige stap met daarbij je gewenste admin credentials en url:

bin/magento setup:install --db-host=[HOSTNAME] --db-name=[DATABASEA_NAME] --db-user=app --db-password=[DATABASE_PASSWORD] --admin-firstname=[FIRSTNAME] --admin-lastname=[LASTNAME] --admin-user=[ADMIN_USERNAME] --admin-password=[ADMIN_PASS] --admin-email=[ADMIN_EMAIL] --base-url=http://[DOCKER_IP_HERE] --language=en_US --timezone=Europe/Amsterdam --currency=EUR --use-rewrites=1

Public map koppelen

Je hebt nu Magento 2 geinstalleerd op je verse container, maar je kunt hier nog niet bij vanuit je browser. Hiervoor moet je de “public” map op de hypernode nog koppelen aan de “pub” map van je Magento 2 installatie:

rm -rf /data/web/public
ln -s ~/magento2/pub ~/public

Om te ontwikkelen voor en in Magento 2 is de “developer” modus het beste, stel deze als volgt in:

bin/magento deploy:mode:set developer

Hiervoor geldt hetzelfde als het configureren van de nginx. Nu is het nodig, maar met een nieuwe update zou deze stap zomaar overbodig kunnen worden. Vooralsnog moeten we “Sign static files” uitzetten zodat Magento 2 vervolgens de static symlinks op de goede plek kan neerzetten:

bin/magento config:set dev/static/sign 0
bin/magento cache:clean

De Docker container opstarten

Dat is het, je hebt nu een docker container draaien met daarin Magento 2! In mijn geval is het IP adres 172.17.0.2, dus ik kan mijn Magento 2 installatie bekijken via: http://172.17.0.2

Je kunt zien welke docker containers er momenteel draaien met het volgende shell commando:

docker ps

Je kunt de docker container als volgt stoppen:

docker stop webwijs

En de docker container opstarten kan als volgt:

docker start webwijs

Elke keer dat je aan de slag wilt met de docker container – terwijl hij nog niet draait – kun je de container weer opstarten met 1 simpel commando: docker start [CONTAINERNAAM]

4. (Optioneel) PHPmyAdmin op de Hypernode

Als je ook bij PHPmyAdmin wilt kunnen via je browser, dan moet je nog een symlink aanmaken in de Magento 2 “pub” map:

ln -s /usr/share/phpmyadmin/ ~/magento2/pub/dbadmin

PHPmyAdmin is nu te bereiken op: http://172.17.0.2/dbadmin, en hier kan je vervolgens inloggen met de inloggegevens van je Magento 2 database. *hint: cat ~/.my.cnf *

You did it!

Yes, je hebt het gewoon geflikt! Een lokale Magento 2 ontwikkelomgeving, met Docker en de Hypernode container. Je hebt nu de ideale situatie om verbeteringen voor je webshop op een veilige manier te testen. Heb je naar aanleiding van deze uitleg nog vragen? Neem dan contact met ons op.
Neem contact op

via GIPHY

Delen?

Meer informatie over dit onderwerp? Mark maakt je volledig webwijs. Keertje afspreken?

Neem contact op

Mogen we jou ook webwijs maken? We zitten vol frisse ideeën waar we jou graag verder mee helpen.

Daag ons uit
Boyd