Le bloc « Boucle de requête » de WordPress permet de récupérer facilement les contenus internes (articles, pages, CPT), mais qu’en est-il des données externes ?

Comment afficher vos projets GitHub, vos articles Dev.to, ou toute autre source de données tierce directement sur votre site WordPress ?

Dans cet atelier pratique, nous allons créer un bloc Gutenberg connecté à l’API publique de GitHub pour afficher la liste de vos repositories publics sur votre portfolio ou votre site personnel, tout ça en partant de zéro.

Nous verrons ensemble :

La structure d’un bloc Gutenberg dynamique avec connexion API
L’utilisation de fetch pour récupérer des données externes
La gestion des états : loading, succès, erreurs (user not found, rate limit)
Les composants d’interface : controls pour paramétrer le username, nombre de repos, tri
Les bonnes pratiques : UX (loading states, fallbacks), performance (cache), sécurité Vous repartirez de cet atelier avec un bloc fonctionnel et réutilisable, et les compétences pour connecter Gutenberg à n’importe quelle API REST publique.

Si vous le souhaitez, vous pouvez suivre cet atelier sur votre ordinateur en même temps que moi. Quelques pré-requis sont à prendre en compte :

Compétences :
Bases PHP et JavaScript/React
Utilisation de npm et du terminal
Technique :
Une instance de WordPress installée en local sur son ordinateur
Node.js 20.x ou supérieur (LTS) + npm

Presentation Slides »