Faire du debug PHP (Symfony) avec Visual Studio Code sur MacOS

Sébastien Timoner
6 min readAug 27, 2018

--

Je vais tester l’écriture d’un petit tut directement sur ma page LinkedIn. N’hésitez pas à me faire tous vos commentaires, aussi bien positifs que négatifs. Cela permettra de faire avancer le chmilibilik :). Ce petit tut est destiné aux utilisateurs de Mac, mais il pourra être facilement interprété pour Windows ou Linux.

Lorsque je fais du développement Symfony (et donc PHP), j’utilise PHPStorm. Toutes les personnes qui me connaissent, savent tout le bien que je pense de cet environnement de développement. J’entends de plus en plus parler de Visual Studio Code depuis un petit moment. Etant curieux de nature, j’ai décidé de faire un petit tour d’horizon de cet éditeur de code.

Un bon environnement de développement doit être performant (on va évite les grosses usines très lentes) tout en faisant pas mal de choses (debug, historiques, coloration syntaxique, gestion de repo, complétion du code, analyse du code, ….). Pour faire simple, l’environnement de développement doit me faire gagner du temps.

Je vais commencer par tester le débogage car c’est un point qui peut faire gagner beaucoup de temps en cas de problème. J’entends par débogage : gestion des points d’arrêt (basiques + sur conditions), pas à pas, analyse des variables et possibilité d’exécuter du code sur point d’arrêt. Je m’intéresserai dans cet article seulement au debug PHP.

Comment faire du débogage en PHP ?

PHP a besoin de l’extension xdebug. MacOs intègre par défaut une version de PHP qui évolue au fur et à mesure des mises à jour de l’OS. Si vous souhaitez connaitre votre version de PHP, rien de plus simple, au terminal (cmd + espace > terminal.app) tapez :

php -v

La capture d’écran vous montre la dernière version présente sur mon Mac. Cette version est intéressante, mais elle n’intègre pas xdebug. On pourrait installer la lib et la configurer. Mais j’ai bien peur qu’elle disparaisse à la prochaine mise à jour de MacOS. On va donc installer une version à côté de la version courante.

Installation de php 7.2

Tant qu’à installer une version de php, autant installer une version plus récente. La version courante est la 7.2.

Vous pourriez vous même compiler votre version de PHP mais le site https://php-osx.liip.ch/ propose les versions de PHP compilées et packagées. Pour installer PHP 7.2, rien de plus simple qu’une petite commande au terminal :

curl -s https://php-osx.liip.ch/install.sh | bash -s 7.2

Une fois l’installation terminée, les fichiers de PHP se trouvent ici : /usr/local/php5/. Attention, il s’agit d’un lien symbolique qui pointe vers /usr/local/php5–7.2.9–20180821–074958/. Il ne faut donc pas croire qu’on est en présence d’une version de php5. Je vous conseille de vérifier la version que vous venez d’installer :

/usr/local/php5/bin/php -v

Voici ce que vous devez voir :

Vous remarquerez que Xdebug est présent en version 2.6.1. Par défaut, il n’est pas démarré, mais il est présent et configuré. En terme de perf, n’étant pas démarré, il n’aura pas d’impact significatif si vous décidez d’utiliser cette version de PHP.

Comment utiliser PHP ?

Si vous souhaitez utiliser la version fournie par votre Mac, au terminal vous utiliserez simplement php et si vous souhaitez utiliser la version 7.2, vous devrez mettre le path complet : /usr/local/php5/bin/php.

Vous pouvez remplacer la version du Mac par celle que vous venez d’installer. Je vous invite à faire quelques recherches sur internet car ici, je préfère ne pas changer la configuration du Mac.

Création d’un projet Symfony 4

Développer un projet avec PHP c’est bien, mais le développer en utilisant le framework SF4 c’est nettement mieux.

Sur mon Mac, je mets les fichiers de mes projets dans un dossier Projects situé dans mon espace perso. Pour créer le dossier, vous pouvez taper la commande suivante au terminal :

cd ; mkdir Projects ; cd Projects

Vous avez besoin de “Composer” pour créer un projet SF4. Nous allons télécharger “Composer” directement dans la directory Projects que nous venons de créer.

wget https://getcomposer.org/composer.phar

“Composer” est présent dans votre dossier Projects. Pour le tester avec la version php précédemment installée, rien de plus simple :

/usr/local/php5/bin/php composer.phar -V

On peut maintenant créer son projet SF4. Nous appellerons ce projet tuts01.

/usr/local/php5/bin/php composer.phar create-project symfony/website-skeleton tuts01

“Composer” va créer un projet SF4 vide de type website qui s’appellera tuts01.

Création de notre 1er controller

Nous allons créer notre 1er controller : TutsController. Dans le terminal, à la racine du projet tuts01 :

/usr/local/php5/bin/php bin/console make:controller

A la question “Choose a name for your controller class (e.g. FierceGnomeController):” tapez :

TutsController

Félicitation, vous venez de créer le controller TutsController

Lancer le serveur web et ouvrir la page

PHP intègre un serveur web interne. Pour le lancer, exécuter la commande suivante à la racine du projet tuts01 :

/usr/local/php5/bin/php -S 127.0.0.1:8000 -t public

Vous pouvez maintenant ouvrir la page suivante dans votre navigateur web :

http://localhost:8000/tuts

Vous trouverez le profiler de code de symfony en bas de la page :

Pour arrêter le serveur web de PHP, vous devez taper dans le terminal

CTRL + C

On va pouvoir commencer à travailler sur ce projet avec VSC.

Installation et configuration de Visual Studio Code

Il faut commencer par installer VSC. Pour cela, il faut se rendre sur le site :

Téléchargez en cliquant sur Download for Mac. Vous allez recevoir un fichier nommé VSCode-darwin-stable.zip. Il faut extraire (automatique avec Safari) le fichier Visual Studio Code.app et le déplacer dans Applications.

Lancer Visual Studio Code.app. Au premier lancement, il vous proposera de télécharger la langue française. Il vous proposera également des plugins qui pourront être intéressants par la suite. Vous pouvez les installer mais ce n’est pas obligatoire.

Pour le debug, nous aurons besoin d’une extension de debug php. Dans la zone de recherche des extensions, je vous invite à taper xdebug. Cliquez sur PHP Debug et sur Activer.

Edition du projet tuts01

Maintenant que VSC est installé et configuré, vous pouvez ouvrir votre projet tuts01.

Vous trouverez dans src, le controller TutsController. On peut ajouter un point d’arrêt en cliquant dans la colonne de gauche sur la ligne 15

On doit lancer le serveur web de PHP en activant xdebug :

/usr/local/php5/bin/php -dxdebug.remote_autostart=1 -S 127.0.0.1:8000 -t public

Maintenant, on active le debug dans VSC en cliquant sur “Démarrer le debogage” dans le menu “Déboguer” puis on sélection PHP.

Cliquez ensuite sur “Listen for XDebug”

Ouvrez dans votre navigateur la page suivante :

http://localhost:8000/tuts

En retournant dans VSC, vous serez arrêté sur votre point d’arrêt.

A partir de maintenant, vous pouvez faire du pas à pas, explorer la valeur de vos variables, appeler du code PHP, etc etc. Vous pouvez faire tout ce que l’on attend d’une session de debug. On peut également conditionner le point d’arrêt en faisant un clique à 2 doigts sur le point d’arrêt et en faisant modifier le point d’arrêt.

Conclusion

Le debug PHP sous VSC fonctionne et me semble facile à utiliser. Pour le moment, je reste sur PHPStorm où j’ai mes habitudes mais je vais continuer à explorer cet éditeur qui ne manque pas d’intérêts. Car comme je l’ai dit plus haut dans cet article, l’environnement de développement doit me faire gagner du temps.

Si vous avez trouvé cet article intéressant, n’hésitez pas à mettre un commentaire et à le partager sur votre réseau.

Vous pouvez me suivre sur LinkedIn : https://www.linkedin.com/in/timoner/

--

--

Sébastien Timoner

Je suis le co-fondateur d’offroadLabs, studio de développement informatique et de design de service basé à Aix-en-Provence #symfony #php #reactjs #elasticsearch