Pourquoi ce site existe-t-il ?
Un problème récurrent lorsqu’on apprend une nouvelle technologie, c’est que la plupart de la documentation et des exemples que l’on trouve sur internet ou via les IA sont si triviaux qu’ils ne donnent aucune idée de la capacité de la technologie (ou de votre implémentation) à tenir face à une charge réelle et complexe. Un exemple typique : les innombrables exemples de listes de tâches.
J’ai un projet SaaS prévu, fondé sur plusieurs hypothèses technologiques qu’il faut tester avant même d’essayer de construire le vrai projet, et un site de profil personnel comme celui-ci, piloté par un backend CMS complet, est juste assez complexe pour mériter une véritable mise en production, et assez simple pour ne pas prendre trop de temps à assembler ; avec en plus l’avantage que, si tout se passe bien, j’obtiens un site de profil performant qui servira de bon banc d’essai pour d’autres expérimentations plus techniques.
Cloudflare comme cible de déploiement
Cloudflare Workers https://workers.cloudflare.com/ semblent, à première vue, être un moyen extrêmement bon marché de déployer une application complexe. Le développement back-end paraît simple et robuste, et le package OpenNext https://opennext.js.org/ semble offrir un moyen efficace de développer votre front-end en Next.js https://nextjs.org/ et de déployer sur Cloudflare.
Je doute que ce site attire beaucoup de trafic humain ; cependant, je vais tenter d’y pousser autant de trafic provenant des moteurs de recherche et des crawlers d’IA que possible. De cette façon, je devrais pouvoir déterminer le coût réel d’exploitation d’un site très fréquenté sur la plateforme de Cloudflare.
Rendre ce site plus compliqué qu’il ne devrait l’être
Backend de gestion de contenu (CMS)
En toute honnêteté, ce site, dans son état actuel, pourrait être bricolé en quelques heures avec un agent de code ; cependant, un système sérieux ne devrait pas nécessiter un déploiement pour modifier du contenu de base. Par conséquent, ce site utilise un CMS complet basé sur Payload CMS (https://payloadcms.com/) déployé en tant que Cloudflare Worker distinct.
Payload lui-même utilise une base de données SQL, qui doit à son tour être déployée sous forme d’instance de base de données SQLite CloudFlare D1 https://developers.cloudflare.com/d1/, et correctement gérée via des migrations de base de données pour accompagner le cycle de vie du développement.
Traductions automatisées
Ce site prend en charge 20 langues. Étant donné que le site web n’est qu’une ossature simple pour le contenu du CMS, la partie i18n est gérée avec un agent de code (Co-pilot et Claude Opus 4.5) pendant le développement.
Il reste donc tout le contenu actuel et futur du CMS à traduire automatiquement dès qu’un contenu en anglais est modifié.
Worker basé sur une file d’attente et un cron
L’exigence de traduction impose un processus assez compliqué qui :
- Se déclenchera via un minuteur Cron.
- Identifiera tout contenu nécessitant une nouvelle traduction.
- Exécutera une traduction de manière fiable.
- Récupérera de manière fiable après un échec.
Par conséquent, une autre instance CloudFlare D1 est utilisée pour suivre le travail de traduction, et les files d’attente Cloudflare (https://developers.cloudflare.com/queues/) sont utilisées avec un schéma producteur-consommateur basé sur cron pour gérer et mettre à l’échelle les tâches. L’API gpt-5.2 d’OpenAI est appelée pour effectuer les traductions et AI.SDK https://ai-sdk.dev/ assemble le tout.
Pour ce site, c’est excessif, mais tout système de production, quelle que soit son échelle, a besoin d’un schéma robuste pour orchestrer les traitements en arrière-plan.
Versions précédentes de ce site
J’ai déjà réalisé ce site deux fois comme outil pour apprendre de nouvelles technologies :
2013 - Apprendre Ruby et AWS
- Ruby on Rails v4.0.0.
- Mise en forme Bootstrap v3.
- CoffeeScript pour l’interface utilisateur.
- Pattern front-end VMC Backbone Marionette.
- Déployé sur un hôte AWS.
2017 - Apprendre React
- React v16.0.0 pour l’interface utilisateur.
- Redux et Thunk pour les opérations asynchrones.
- Semantic UI pour la mise en forme.
Et ensuite
Le site est correctement configuré pour le SEO, et une cadence régulière de nouveau contenu est nécessaire pour stimuler le trafic des crawlers. Je publierai des articles plus détaillés sur les différentes technologies et solutions utilisées.