Catégorie : Journal

Ça fait deux semaines que j’utilise Windsurf pour développer un plugin WordPress.
Le principe ? Ajouter des options sur les blocs Gutenberg natifs (en React/JSX), et gérer des Custom Post Types proprement.

Rien de dingue sur le papier.
Mais en vrai, c’est le genre de projet où tu te retrouves vite avec du code front mélangé au code métier, des fichiers qui grossissent, et un moment où tu te demandes « mais pourquoi j’ai foutu ça là ? ».

Avant, j’aurais passé une journée entière à refactoriser pour que ce soit propre.
Là, j’ai tenté de faire équipe avec l’IA.

Spoiler : c’est ni parfait, ni magique. Mais franchement, c’est troublant.

Le moment où j’ai compris que c’était différent

Au début, je lui ai juste balancé :

« J’ai du code pour étendre des blocs Gutenberg. Aide-moi à séparer proprement le front-end de la logique métier. »

Windsurf ne m’a pas juste craché trois suggestions de fonctions.
Il a réorganisé des fichiers.
Il a créé des dossiers, proposé une archi, déplacé du code React d’un côté, les enregistrements de CPT de l’autre.

Pas parfait, hein. Mais cohérent.

Et moi, pendant ce temps, je ne codais presque pas.
Je lisais, je validais, je virais ce qui ne me plaisait pas.

C’est là que j’ai senti le truc : je n’étais plus vraiment en train de « coder ».
J’étais en train de piloter.

Font Awesome sur les boutons : ou comment j’ai réécrit mes prompts 15 fois

Le truc qui m’a le plus pris la tête, c’est l’ajout d’icônes Font Awesome sur les blocs core/button.

Sur le papier, c’est simple :
tu rajoutes un control dans le panneau Gutenberg, tu laisses l’utilisateur choisir une icône, tu l’affiches côté front avec la bonne classe Font Awesome.

Dans la réalité ?
Windsurf m’a sorti :

• Des contrôles Gutenberg qui ne compilaient pas.
• Des attributs qui disparaissaient au save/reload.
• Du JSX bancal avec des icônes qui se dupliquaient ou qui partaient dans le mauvais sens.
• Une fois, il m’a même proposé d’importer tout Font Awesome en JS côté éditeur (merci, mais non).

Le problème, c’est que je lui demandais des trucs trop vagues.
Genre :

« Ajoute une option pour choisir une icône Font Awesome. »

Résultat : il partait dans tous les sens.

J’ai dû affiner. Beaucoup.
Jusqu’à arriver à des prompts du style :

« Ajoute un SelectControl dans InspectorControls pour choisir parmi 5 icônes Font Awesome.
L’attribut doit s’appeler faIcon, de type string.
L’icône doit s’afficher avant le texte du bouton, côté front uniquement, avec la classe fa-solid fa-{nomIcone}. »

Là, ça commençait à tourner.

Mais j’ai quand même dû tout recommencer à zéro une fois, parce qu’il m’avait généré une logique tellement tordue que je ne m’y retrouvais plus.

Ce que j’ai appris : parler à une IA, c’est un métier

Ce qui m’a le plus marqué, c’est à quel point la façon dont tu poses la question change tout.

Si tu dis :
« Fais-moi un truc pour gérer des icônes »,
tu obtiens du code générique, verbeux, à moitié cassé.

Si tu dis :
« Crée un attribut faIcon de type string, ajoute un SelectControl avec 5 options fixes, affiche l’icône en <i> avec la classe correspondante dans le RichText »,
là, ça roule.

Et ça, pour moi, c’est nouveau.
Avant, coder, c’était : je sais ce que je veux, je le tape.
Maintenant, c’est : je sais ce que je veux, j’apprends à le formuler pour qu’une IA le fasse.

C’est presque un exercice de specs en temps réel.
Et franchement, ça m’a forcé à être plus clair dans ma tête sur ce que je voulais vraiment.

La structure du plugin : là où l’IA m’a vraiment aidé

Ce qui est cool, c’est que Windsurf m’a aidé à mettre en place une archi propre dès le début.

Avant, j’aurais fait un gros index.php, un dossier assets, et je me serais dit « je rangerai plus tard ».
Jamais fait, évidemment.

Là, il m’a proposé direct :

• Un dossier src/blocks pour tout le code React/JSX qui étend les blocs Gutenberg.
• Un dossier includes pour les CPT et la logique métier.
• Un build propre avec webpack (enfin… plus ou moins propre, j’ai dû ajuster).
• Une séparation claire entre ce qui tourne côté éditeur et ce qui se charge côté front.

C’est pas révolutionnaire.
Mais c’est exactement ce que j’aurais dû faire depuis le début, et que je faisais jamais par flemme.

L’IA m’a forcé à être structuré dès le départ, parce qu’elle avait besoin de comprendre où mettre les fichiers.

Et résultat : mon code est plus maintenable. Plus facile à relire. Moins bordélique.

Les moments de frustration (parce qu’il y en a)

Je ne vais pas mentir : il y a eu des phases où j’ai eu envie de tout fermer et de retourner coder comme avant.

Genre :

• Quand l’IA me modifiait 4 fichiers alors que je lui avais demandé d’en toucher qu’un.
• Quand elle « corrigeait » du JSX qui marchait très bien, merci.
• Quand elle m’inventait des hooks React qui n’existent pas, et que je perdais 20 minutes à comprendre pourquoi ça plantait.

Il y a aussi ce moment bizarre où tu te rends compte que tu lis plus de code que tu n’en écris.
Et parfois, ça frustre.
Parce que coder, c’est pas juste produire du code. C’est aussi réfléchir, tâtonner, trouver des solutions.

Avec l’IA, tu sautes une partie de ce process.
Des fois c’est génial.
Des fois, tu te sens un peu… spectateur.

Ce que je retiens après deux semaines

Windsurf, c’est un outil de structure avant tout.
Il te force à penser ton projet proprement, parce qu’il a besoin de comprendre où il met les pieds.

C’est aussi un amplificateur de clarté mentale.
Si tu ne sais pas vraiment ce que tu veux, il va partir en vrille.
Si tu es clair, il va vite.

Mais ça reste un assistant, pas un dev.
Tu ne peux pas lui laisser la main sur tout.
Surtout si tu fais du React/JSX un peu poussé, ou si tu touches à des trucs sensibles (attributs Gutenberg, save/edit, etc.).

Le truc à retenir ?
L’IA produit le squelette. Toi, tu mets la chair.

Et franchement, pour l’instant, ça me va bien comme ça.

Et toi, t’en es où ?

Je suis curieux de savoir si d’autres devs WordPress ont testé ce genre d’outils sur des projets Gutenberg.
Parce que franchement, entre le JSX, les attributs, le save vs edit, et tout le bordel de la compilation… c’est pas toujours évident de savoir ce qu’on peut déléguer à l’IA et ce qu’il vaut mieux garder sous contrôle.

Si t’as des retours d’expérience, des prompts qui marchent bien (ou qui partent complètement en couille), ou juste une opinion tranchée sur le fait de coder avec une IA, balance-moi ça.

Parce qu’au fond, on est tous un peu en train d’apprendre ensemble comment bosser avec ces trucs-là.
Et autant partager les galères, non ?