Plugin Stars

·

·

Plugin Stars

lI y a quelques années, j’avais développé un premier plugin WordPress : un CAPTCHA basé sur un système de questions-réponses. Je l’ai d’ailleurs repris et amélioré l’année dernière. Cette première expérience m’a donné envie d’aller plus loin.

Pour mon site de randonnée, je recherchais un plugin de notation par étoiles. Après en avoir testé plusieurs, je n’en ai trouvé aucun qui réponde exactement à mes besoins. Plutôt que d’adapter un plugin existant, j’ai donc décidé de développer le mien : Plugin Stars.

Ce projet est rapidement devenu un excellent exercice pour approfondir PHP, JavaScript, AJAX, la manipulation du DOM, le débogage avec la console du navigateur, ainsi que l’utilisation de GitLab pour le suivi du développement.

Dans cet article, je retrace les principales étapes de la réalisation de cette première version, les difficultés rencontrées et les solutions mises en place.

1. Pourquoi développer un nouveau plugin ?

Pour mon site de randonnée, je souhaitais permettre aux visiteurs de noter une randonnée et de laisser un commentaire. Après avoir testé plusieurs plugins, je n’en ai trouvé aucun qui corresponde réellement à mes attentes. J’ai donc choisi de développer mon propre plugin.

Plugin en cours de développement (environnement local)

Plugin intégré sur le site Crêtes et Vallées

Avant d’ajouter les fonctionnalités (notation, commentaires et modération), il a fallu mettre en place les fondations du plugin.

2. Premières étapes

Le développement a commencé par la création de l’arborescence du plugin et du fichier principal permettant à WordPress de reconnaître le plugin. J’ai ensuite mis en place un shortcode afin de pouvoir l’intégrer facilement dans les pages et les articles.

Une fois cette structure en place, j’ai travaillé sur l’affichage des étoiles et des informations associées (moyenne et nombre de votes). L’objectif était de disposer rapidement d’une première version fonctionnelle avant d’ajouter progressivement les fonctionnalités plus avancées.

3. La base de données

Pour gérer les commentaires, il a fallu réfléchir au stockage des données. WordPress dispose déjà de plusieurs tables, notamment pour les articles et les commentaires. Cependant, j’ai choisi de créer une table spécifique pour ce plugin.

Cette solution m’a permis de maîtriser entièrement la structure des données et de préparer les évolutions futures du plugin.

Au cours du développement, j’ai également utilisé phpMyAdmin pour vérifier les enregistrements, effectuer des tests et comprendre le fonctionnement des requêtes SQL. Cette étape a été très utile pour le débogage.

Pour publier un commentaire, il suffit de modifier son statut dans phpMyAdmin en remplaçant « pending » par « approved »

4. Déboguer et apprendre à comprendre son code

Une grande partie du temps a été consacrée au débogage. Les outils du navigateur (console JavaScript, inspecteur HTML et réseau) sont rapidement devenus indispensables pour comprendre le comportement du plugin.

Les erreurs affichées dans la console permettaient d’identifier précisément les erreurs JavaScript, les problèmes AJAX ou les réponses renvoyées par PHP. Au fil du projet, j’ai pris l’habitude d’utiliser systématiquement ces outils avant de modifier le code.

Cette méthode de travail m’a fait gagner beaucoup de temps et m’a permis de mieux comprendre le fonctionnement de JavaScript et des échanges entre le navigateur et WordPress.

5. Développer avec l’aide de l’IA (Vibe Coding)

Ce plugin est également le fruit d’une nouvelle manière de programmer : le Vibe Coding. L’objectif n’est pas de laisser l’intelligence artificielle écrire seule le programme, mais de travailler avec elle comme avec un partenaire.

L’IA m’a aidé à comprendre certaines notions, à proposer des pistes de solution et à expliquer les erreurs rencontrées. Chaque fonctionnalité a été testée, modifiée et intégrée progressivement. Les nombreuses captures d’écran et les échanges ont permis d’avancer étape par étape sans perdre la maîtrise du projet.

Cette approche m’a permis d’apprendre beaucoup plus rapidement tout en restant acteur du développement et en conservant une compréhension du code produit.

« L’IA propose, le développeur comprend, teste et décide« 

Bilan

Je n’avais pas développé un projet de cette ampleur depuis longtemps. La réalisation de ce plugin m’a permis de reprendre des automatismes, mais aussi d’approfondir de nombreuses notions en PHP, JavaScript, AJAX, manipulation du DOM et bases de données.

Au fil du développement, je me suis fixé une règle simple : chaque fonction que j’écris doit être comprise. Je dois être capable d’expliquer ce qu’elle fait, pourquoi elle est là et comment elle fonctionne. Cette exigence m’a parfois obligé à ralentir, à relire le code ou à effectuer de nombreux tests, mais elle a été essentielle pour progresser.

Le développement n’a pas toujours été facile. Certaines séances ont été plus compliquées, notamment à cause de la fatigue ou de la chaleur estivale. Malgré cela, chaque problème résolu apportait une réelle satisfaction et renforçait ma compréhension du projet.

Au final, cette première version est bien plus qu’un simple plugin de notation : c’est un projet qui m’a permis de retrouver le plaisir de développer, d’apprendre de nouvelles technologies et de découvrir une nouvelle manière de programmer en collaboration avec l’intelligence artificielle.

Aujourd’hui, cette V1 constitue une base solide et me donne surtout envie d’aller plus loin. Les idées ne manquent pas pour une V2, qui sera l’occasion d’améliorer le plugin tout en poursuivant cet apprentissage.


Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Aller au contenu principal