I'm Not A Web Dev...So Claude Designed A Website For Me!
L’intervenant montre comment il a utilisé Claude (un grand modèle de langage) pour créer un thème Hugo personnalisé à partir de zéro, en partant de documents Emacs org, en quelques minutes, là où un développement manuel lui aurait pris des semaines.
SYNTHÈSE STRUCTURÉE
Contexte : pourquoi Hugo et org mode ?
L’intervenant utilise Emacs org mode pour toute sa rédaction et souhaitait un site de type blog capable de publier directement ces fichiers org. Hugo supporte nativement le format org, ce qui en fait un choix naturel. Il explique : « I live in Emacs and I write all of my documents typically in org format. » Cependant, il a été déçu par les thèmes Hugo publics, qu’il juge peu adaptés à ses besoins.
La décision de construire un thème sur mesure avec Claude
Plutôt que de forcer un thème existant à correspondre à ses attentes, l’intervenant a demandé à Claude de créer un thème Hugo depuis zéro. Il précise : « Let’s just start from scratch with Claude. » Claude a répondu positivement et a immédiatement produit un thème fonctionnel, incluant un exemple de post (« Hello org ») et une page « À propos ».
Rapidité d’exécution impressionnante
La première itération complète du site (thème, layout, exemple de contenu) a été générée en environ cinq minutes. L’intervenant souligne : « The very first iteration of this site took Claude all of, I don’t know, maybe 5 minutes. » Ce gain de temps est central dans son propos.
Itérations et personnalisations progressives
Plutôt que de tout spécifier d’un coup, l’intervenant a procédé par petites demandes successives : ajustement des espacements, passage à un layout en cartes (card-style), ajout du support des images, puis recadrage automatique des images pour les entêtes de posts. Il explique sa méthode : « I didn’t want to throw a bunch of it initially. I let him create the theme, and then we tweaked it one at a time. »
Fonctionnalités ajoutées par Claude
Claude a intégré plusieurs fonctionnalités utiles sans que l’intervenant ait à les coder lui-même :
- Table des matières cliquable dans les documents org
- Navigation par tags (tags Hugo)
- Support des images dans les posts
- Recadrage automatique des images pour les vignettes
L’intervenant précise : « I’m not a web developer, but it would take me weeks, if not months, to actually do some of this stuff. »
Polyvalence de Claude au-delà de Hugo
L’intervenant témoigne avoir utilisé Claude pour de nombreux autres projets : scripts Python financiers, applications Rust, extensions Emacs Lisp. Il affirme : « Claude’s really good with Python, Rust, and Emacs Lisp. » Il suggère que Claude peut aussi créer des plugins WordPress ou des fonctionnalités dynamiques.
Vision future : intégration de deux sites
L’intervenant prévoit de fusionner son site Hugo (blog en org) avec un site Flask existant qui génère des graphiques de trading dynamiques. Il imagine demander à Claude d’intégrer ces graphiques dans les articles de blog, en gérant le fait que les graphiques changent quotidiennement (via cron) tandis que le texte reste statique. Il conclut : « I bet Claude is going to pull that off fantastically. »
CONCEPTS CLÉS
- Hugo : générateur de site statique écrit en Go, supportant nativement les fichiers Markdown et org.
- Emacs org mode : format de fichier texte structuré utilisé pour la prise de notes, la rédaction et la gestion de projets dans l’éditeur Emacs.
- Thème Hugo : ensemble de templates et de fichiers CSS/JS qui définissent l’apparence et la mise en page d’un site Hugo.
- Large Language Model (LLM) : modèle d’IA comme Claude ou ChatGPT, capable de générer du code, du texte et des configurations à partir d’instructions en langage naturel.
CONCLUSION
Le message principal est que les grands modèles de langage comme Claude permettent à un non-développeur de créer rapidement un site web sur mesure, avec des fonctionnalités avancées, en quelques minutes d’échanges itératifs. L’intervenant insiste sur le rapport temps/argent : pour 20 $ par mois, Claude lui évite des semaines de travail manuel. Cette approche change la donne pour les administrateurs système et les créateurs de contenu qui veulent maîtriser leur outil sans être experts en développement web.