Articles de la série : Créer des composants Docusaurus
Composants sur mesure, hooks, mises en page et interface réutilisable pour votre site Docusaurus.
📄 Voir cette série en Markdown brutSuivre la série « Créer des composants Docusaurus »
Ils arrivent tout seuls dans votre lecteur de flux — sans compte, sans adresse e-mail, sans rien à résilier. Collez cette URL dans votre lecteur :
https://www.avonture.be/fr/series/creating-docusaurus-components/rss.xmlVous lisez aussi l'anglais ? Le flux dans la langue d'origine suit l'intégralité du blog :
https://www.avonture.be/series/creating-docusaurus-components/rss.xmlPas encore de lecteur de flux ? Commencez ici — ça prend deux minutes.
Laissez vos lecteurs signaler les problèmes — un widget de feedback multi-types pour Docusaurus →
Construisez un widget de feedback lecteur sécurisé et SSR-safe pour votre blog Docusaurus — sélection de texte, 4 types de feedback, API PHP avec nonce HMAC, rate limiting, déduplication, dashboard admin et notifications par email.
29 octobre 2026
Dessiner une carte de mon propre blog →
Construisez une carte interactive de tout votre corpus Docusaurus — chaque article devient une bulle portant la mascotte du site, dimensionnée selon le nombre d'articles qui pointent vers elle, positionnée par un layout force-directed calculé au build dans Node, si bien que le navigateur ne charge jamais d3-force. Inclut le plugin, le composant canvas et le fallback en liste simple qui garde la page utilisable sans JavaScript.
8 octobre 2026
La troisième porte : une bulle de chat flottante, et la fonctionnalité que personne ne trouvait →
Une fonctionnalité que vos visiteurs ne trouvent pas n'existe pas. Cet article ajoute une bulle flottante « Ask my blog » à un site Docusaurus — un troisième point d'entrée vers le même index de questions, et le premier qui ne demande aucune connaissance préalable. Avec l'astuce d'exclusion mutuelle qui empêche deux dialogues flottants indépendants de s'ouvrir en même temps.
5 octobre 2026
Ask My Blog : transformer 259 articles en 2 160 questions cherchables →
Un LLM local lit chaque article du blog et rédige les questions qu'un développeur taperait vraiment dans une barre de recherche, chacune reliée au titre exact qui y répond. Le résultat est un index de questions généré au build et interrogé dans le navigateur avec un simple BM25 — pas d'embeddings, pas de clé d'API, pas de base vectorielle. Pipeline, plugin et composant complets inclus.
28 septembre 2026
Ajouter un bouton « Copy as Markdown » à votre blog Docusaurus →
Créez un bouton « Copy as Markdown » et un lien « View raw » pour les articles de votre blog Docusaurus — un plugin exécuté au build qui écrit un miroir en Markdown pur à côté de chaque article, plus le petit composant React qui le récupère et le copie dans le presse-papiers. Code source complet inclus.
10 septembre 2026
Secouez votre téléphone, surprenez le suricate →
Un neuvième easter egg pour ce blog, pensé pour les lecteurs sur téléphone : secouez-le — dans Chrome ou dans la PWA installée — et la mascotte suricate prend tout l'écran, surprise, pendant environ deux secondes. On y parle du calcul du « jerk » via devicemotion derrière la détection de secousse, de l'animation de l'overlay en trois phases, de la façon de tester le tout depuis une console DevTools sur desktop sans le moindre accéléromètre, et d'un vrai bug découvert en chemin : un générateur d'images IA qui a dessiné le damier censé représenter la transparence sous forme de pixels réellement opaques au lieu d'un vrai canal alpha.
27 août 2026
Votre blog est illisible pour une IA. Voici la solution. →
Une part croissante de vos lecteurs arrive via un assistant IA — et ce qu'ils reçoivent, c'est votre HTML, emballé dans la navigation, des widgets React et des accordéons fermés. Cet article génère un miroir en Markdown pur de chaque article, un index /llms.txt et des bundles full-text par série, en dégradant la source MDX plutôt qu'en convertissant le HTML rendu. Avec la règle de repli qui rend l'export impossible à casser.
24 août 2026
Ajouter des réactions de lecteurs à votre blog Docusaurus →
Construisez un widget « Cet article vous a-t-il été utile ? » entièrement fonctionnel pour votre blog Docusaurus. Guide pas à pas couvrant le backend PHP, le composant React, le module CSS, le swizzle Docusaurus et un tableau de bord d'administration — tout ce qu'il faut pour le reproduire de zéro.
27 juillet 2026
Tooltips de code assistés par l'IA dans Docusaurus — Explique-moi comme à un enfant de cinq ans →
Ajoutez des tooltips au survol sur les lignes de code délicates de votre blog Docusaurus — propulsés par Claude, générés au moment du build, zéro latence côté navigateur. On couvre le plugin remark, le renderer React et le script CLI.
20 juillet 2026
Espiègleries de suricate : semer des easter eggs partout sur mon blog →
Tour d'horizon de huit petits easter eggs à découvrir sur ce blog Docusaurus — un suricate en ASCII art caché dans le source de la page, un sprite lancé par le code Konami, un clin d'œil en console.log, un changement de favicon quand on quitte l'onglet, des messages 404 aléatoires, un commentaire caché dans le sitemap et plus encore — ainsi que les vrais bugs (répétition de touche, incompatibilité clavier AZERTY, mauvais emoji, race condition dans postBuild, favicon flou) débusqués en chemin.
13 juillet 2026
Donnez vie à vos tutoriels CLI avec un terminal machine à écrire →
Ajoutez une animation machine à écrire à votre composant Terminal Docusaurus — les lignes de commande tapées caractère par caractère, les lignes de sortie qui apparaissent l'une après l'autre, avec un curseur clignotant et un clic pour passer l'animation. Trois nouvelles props, aucune rupture de compatibilité.
22 juin 2026
Comment signaler un contenu assisté par IA dans un blog Docusaurus →
Un guide pas à pas pour indiquer qu'un article a été écrit avec l'aide d'une IA comme Google Gemini, en ajoutant une icône et un auteur.
9 mars 2026
Le composant ProjectSetup - Une façon standardisée de partager des structures de projet →
Découvrez comment utiliser le nouveau composant ProjectSetup pour partager facilement des structures de projet dans vos articles de blog Docusaurus, avec des snippets de fichiers interactifs et des scripts d'installation automatisés.
23 février 2026
Automatiser les résumés TL;DR avec Gemini AI →
Améliorez l'expérience de vos lecteurs en générant automatiquement des résumés TL;DR concis pour vos articles de blog avec Gemini AI de Google et Python.
16 février 2026
Gestion des tags dans Docusaurus →
Automatisez la gestion des tags Docusaurus avec ce script Python. Nettoyez les doublons, corrigez la casse et fusionnez les tags en toute sécurité sur des centaines de fichiers Markdown via Docker.
2 février 2026
Quelques vérifications sur les images de votre site Docusaurus →
Un script Python pour vérifier le lazy loading et la taille des images de votre site Docusaurus avec Playwright et BeautifulSoup.
26 janvier 2026
Best Practice - Personnaliser le flux RSS de Docusaurus pour un contenu complet et des images →
Améliorez le fichier RSS de votre blog Docusaurus. Écrivez un plugin pour désactiver le flux de base et inclure le contenu complet des articles, les images et des métadonnées enrichies pour de meilleurs lecteurs.
7 décembre 2025
Injecter de l'ASCII art dans toutes les pages HTML générées par Docusaurus →
Injectez une bannière en ASCII art dans chaque page HTML générée par Docusaurus grâce à un plugin postBuild léger. Elle apparaît dans le code source de la page ou peut être affichée visiblement.
23 novembre 2025
Afficher le changelog de votre article →
Afficher le changelog de votre article
18 novembre 2025
Un composant Docusaurus qui prévient le lecteur que l'article a plus d'un an →
Affiche une bannière d'avertissement quand le contenu de la page a plus d'un an
3 octobre 2025
Un composant pour afficher des snippets de code dans un blog Docusaurus →
Apprenez à créer un composant React personnalisé pour intégrer des snippets de code dynamiques dans votre blog Docusaurus et offrir une expérience de lecture plus interactive.
24 septembre 2025
Créer un plugin de recherche/remplacement pour Docusaurus →
Remplacez automatiquement « markdown » par « Markdown » dans tout votre contenu pour garder des articles cohérents.
18 septembre 2025
Ajouter un bouton « retour en haut » dans les articles Docusaurus →
Découvrez comment ajouter facilement un bouton « retour en haut », souvent accompagné d'une icône animée amusante, à vos articles de blog Docusaurus grâce à un composant React personnalisé et une surcharge de thème.
12 septembre 2025
Organisez votre contenu Docusaurus avec un composant Series personnalisé →
Découvrez comment regrouper des articles de blog Docusaurus liés en une expérience de lecture fluide grâce à un composant Series personnalisé.
9 septembre 2025
Surcharger la génération des balises img avec Docusaurus →
Apprenez à personnaliser le rendu des balises <img> dans Docusaurus pour mieux contrôler la sortie des images.
27 août 2025
Modifier la façon dont Docusaurus génère les balises img →
Personnalisez la manière dont Docusaurus génère les balises <img> pour mieux contrôler le rendu et le comportement des images.
21 août 2025