In questo tutorial vedremo come ottenere un ambiente di sviluppo WordPress in locale in modo completamente gratuito e in meno di 5 minuti.

Leggilo tutto fino in fondo perché, se sei uno sviluppatore WordPress, potrebbe essere uno degli articoli più utili che hai mai letto! 🤯

Introduzione

Nella tua carriera da Web Designer, probabilmente ti sarà capitato di dover affrontare progetti in cui hai avuto la necessità di avere un ambiente di test. O anche solo un ambiente dove fare prove e/o studi di fattibilità per un progetto.

Beh, con Docker è possibile! Vediamo subito come 😉

Disclaimer: questo NON è un tutorial su Docker, ma un semplice quickstart su come ottenere in modo rapido ed efficace un ambiente locale di sviluppo. Non sono un devops, e mi scuso in anticipo per eventuali imprecisioni.

Cos'è Docker

Docker è un tool open source, nato nel marzo 2013, con l'obiettivo di automatizzare il deployment e di permettere l’esecuzione di un applicativo in un ambiente isolato.

Puoi immaginarlo come una sorta di Virtual Machine che simula solo la parte software e non hardware di un sistema. Può pacchettizzare un’applicazione e le sue dipendenze in un container virtuale che può essere eseguito su qualsiasi server Linux.

In questo modo è possibile replicare qualsiasi ambiente applicativo.

Primi passi con Docker

Scaricare e installare Docker

Per prima cosa dovrai scaricare e installare Docker Desktop, e lo potrai fare da qui: https://www.docker.com/get-started.

Per verificare che tutto sia stato fatto correttamente, al termine dell'installazione esegui il comando "docker -v" dal tuo terminale.

Eseguendo il comando "docker ps", potrai invece visualizzare i container attivi al momento. Se hai installato Docker per la prima volta, non ce ne sarà nemmeno uno attivo e il risultato del comando si presenterà così:

Docker Hub

Docker lavora utilizzando i container, i quali eseguono immagini immutabili. Un'immagine include tutto il necessario per eseguire un'applicativo: il codice o il binario, le dipendenze e qualsiasi altro oggetto del file system richiesto.

Il più grande repository di immagini al mondo è Docker Hub, dove potrai trovare qualsiasi tipo di immagine Docker, ufficiale o realizzata da altri sviluppatori.

Il docker-compose file

Che cos'è un docker-compose file

Il file compose fornisce un modo per documentare e configurare tutte le dipendenze di un'applicazione (database, web server ecc.). È possibile creare e avviare uno o più container con un singolo comando:

 docker-compose up -d

Il file compose dovrà chiamarsi docker-compose.yml e dovrà contenere i vari servizi (quindi le immagini) necessari per eseguire l'applicativo che vogliamo creare. In questo caso, i servizi necessari per creare un'ambiente WordPress sono essenzialmente 2:

• mysql
• WordPress

Potrai trovare un file già pronto direttamente sulla documentazione ufficiale di Docker: https://docs.docker.com/compose/wordpress/.

Altrimenti, a questo link, troverai un altro file compose realizzato da me, in cui aggiungo anche il phpmyadmin ai servizi, per avere un maggior controllo sul database.

Eseguire il file

Come scritto in precedenza, per eseguire il nostro file e avviare i container basterà eseguire il comando qui sotto:

docker-compose up -d

Una volta eseguito attendi qualche minuto che vengano scaricate le immagini. Al termine, esegui "docker ps" e il risultato dovrà essere come quello nell'immagine sottostante.

Questo procedimento avrà creato 3 container in esecuzione. Potrai trovare i vari servizi a:

• localhost:8000 👉 WordPress
• localhost:8080 👉 phpmyadmin

Questo perché, come possiamo vedere, il container di WordPress espone sulla porta 8000, mentre il container phpmyadmin espone sulla porta 8080.

Risolvere problemi (v. 3.0.0)

Se hai installato la versione 3.0.0 di Docker Desktop potresti aver riscontrato questi errori durante la creazione dei 3 container:

ERROR: for ...  Cannot start service ...: Mounts denied: approving /Users/test/...: file does not exist

ERROR: for ...  Cannot start service ...: Mounts denied: approving /Users/test/...: file does not exist
ERROR: Encountered errors while bringing up the project.

Per risolvere questo problema basterà aprire Docker, cliccare in alto a destra sulla rotella delle impostazione e, alla sezione "Experimental Features", disabilitare la voce "Use gRPC FUSE for file sharing", come mostrato nell'immagine sotto.

Ora tutto dovrebbe funzionare correttamente. ✅

Installare WordPress

Arrivati a questo punto, navigando a localhost:8000, potrai accedere alla classica installazione di WordPress.

Configuralo e installalo come hai sempre fatto.

Un vantaggio aggiuntivo che avrai, dato dalla gestione dei volumi di Docker, è che potrai gestire i tuoi file direttamente dalla cartella in cui hai eseguito il comando "docker-compose up -d".

Utilizzando un editor, avrai accesso direttamente a tutti i file. Io uso VSCode, ma va bene anche un qualsiasi altro editor. Sarà come avere direttamente un accesso FTP ai tuoi file in locale.

Ngrok + Docker

Durante lo sviluppo del tuo sito Web, probabilmente vorrai anche mostrare i tuo progressi al cliente o ad un collega. Per raggiungere questo obiettivo, useremo ngrok.

Che cos'è ngrok

Per esporre il tuo progetto all'esterno potrai usare ngrok. Ngrok è un'applicazione multipiattaforma che consente agli sviluppatori di esporre un server di sviluppo locale sul web con il minimo sforzo.

Questo strumento creerà un tunnel tra il tuo ambiente locale e l'esterno, facendo sembrare che il tuo server web ospitato localmente sia ospitato in un sottodominio di ngrok.com.

Come utilizzare ngrok

Step 1

Scarica ngrok da questo link seguendo i vari passi. Una volta fatto, posiziona l'eseguibile sul vostro desktop.

Step 2

Modifica il file wp-config.php, aggiungendo queste due righe:

define('WP_SITEURL', 'http://' . $_SERVER['HTTP_HOST']);
define('WP_HOME', 'http://' . $_SERVER['HTTP_HOST']);

In questo modo, queste due variabili seguiranno gli url assegnati da ngrok.

Step 3

Scarica e installa il plugin Relative Url da WordPress. Questo servirà a cambiare i path relativi della tua installazione, in modo che tutte le chiamate network funzionino correttamente e nessuna generi un errore 404.

Attenzione: una volta portato il sito in produzione, ricordati di eliminare questo plugin e di ripristinare il file wp-config.php. Non ne avrai più bisogno, e quelle modifiche potrebbero corrompere qualcosa.

Step 4

Da terminale, spostati sul desktop ed esegui il comando

./ngrok http 8000

Il risultato dovrebbe presentarsi così:

A questo punto, è tutto pronto! 😉

Se tutto è andato a buon fine, il tuo ambiente WordPress locale sarà esposto all'esterno attraverso un link (anche con certificato https), che potrai condividere con chiunque vorrai.

Shutdown

Se vorrai fare pulizia,

Il comando docker-compose down rimuove i contenitori e la rete predefinita, ma preserva il database di WordPress.

Il comando docker-compose down --volumes rimuove i contenitori, la rete predefinita e il database di WordPress.

--remove-orphans per rimuovere container non definiti all'interno del compose file. Sia alla up che alla down.

Il mio consiglio 👉 crea una cartella per ogni progetto, ognuna con il suo file compose. Quando vorrai cambiare progetto esegui il comando docker-compose down, per poi cambiare cartella e lanciare il comando docker-compose up -d.

Conclusione

In pochissimo tempo, abbiamo ottenuto un ambiente WordPress locale perfettamente funzionante e, soprattutto, completamente gratis. Hai imparato anche a gestire più progetti simultaneamente in locale, spostandoti da un ambiente WordPress all'altro in pochissimo tempo.

Personalmente, in molti casi utilizzo questo approccio per sviluppare progetti e mostrare in tutta sicurezza il lavoro al cliente.

Spero ti sia stato utile, buon divertimento!! 💪🏻