Comment lancer rapidement un site vitrine flexible pour 0$ sans expérience en développement web : un compromis entre flexibilité et simplicité

L'histoire d'un match parfait : pourquoi j'ai choisi le duo Astro et Cloudflare Pages pour mes applications

App Screenshot

L’origine de l’idée et les exigences initiales

Je suis développeur d’applications mobiles. Mes connaissances en développement web sont exclusivement superficielles et je n’ai aucune pratique à mon actif. Lorsque l’idée persistante de sortir enfin mes applications mobiles sur Google Play est apparue, j’ai immédiatement réfléchi à la création de mon site vitrine, où figureraient les informations sur tous mes projets. En même temps, je ne voulais pas consacrer un temps important à la création ou au support, que ce soit au début ou à l’avenir, et les exigences pour le site n’étaient pas des plus triviales. Dès le départ, je comprenais exactement ce dont j’avais besoin. Je ne cherchais pas à créer quelque chose de lourd : j’étais prêt à écrire moi-même diverses abstractions pour simplifier la publication d’articles, par exemple, mais je ne voulais pas m’encombrer de la configuration d’un système aussi massif que des CMS classiques avec modules et solutions similaires.

Voici donc les critères que j’ai définis et pourquoi je les ai formulés ainsi :

  • Minimum d’efforts de développement et de support avec une personnalisation flexible : au départ, je voulais des modèles, mais dans lesquels je pourrais « mettre les mains dans le cambouis » si nécessaire pour réaliser ce dont j’avais besoin, et non ce que le système permettait ;
  • Configuration optimisée pour le SEO (référencement) : on veut toujours que le site joue le rôle de vecteur de trafic vers mes applications mobiles ;
  • Support du Markdown : car je savais qu’il me faudrait la possibilité de créer un modèle permettant d’habiller mes pensées, alors que tout coder de zéro (même avec du copier-coller pour chaque page) est une véritable corvée ;
  • Gestion facile du multilinguisme : ici encore, comme au point précédent, c’est une question de trafic. Pourquoi ne pas couvrir des requêtes dans d’autres langues qui pourraient théoriquement être moins concurrentielles ?
  • Plus le coût est bas, mieux c’est : ce n’était pas un critère absolu, mais c’est toujours un bonus appréciable, surtout pour les développeurs indépendants (indie).

Étude des options et choix d’Astro et Cloudflare Pages

Je serai bref et je ne mentionnerai pas spécifiquement tout ce que j’ai essayé : différents sites de cartes de visite et générateurs de templates. Les forfaits gratuits se sont avérés très limités : soit la gestion du SEO manquait, soit on comprenait vite que sans forfait payant, on n’irait nulle part. Mais la raison principale de l’abandon des générateurs de templates est que la mécanique de création ne m’a pas satisfait. Dans certaines options testées, il n’était même pas évident de créer une simple page de base. Peut-être n’étais-je pas d’humeur ou manquais-je de motivation pour creuser à fond, mais inconsciemment, une idée me trottait dans la tête : « Même si je ne suis pas développeur web et que je connais peu ce domaine, et si je m’armais d’un assistant IA pour essayer de créer des abstractions pratiques pour une structure de modèles adaptée à mes besoins ? » Je craignais de m’enliser dans l’aspect technique et de voir mon idée échouer à cause d’incertitudes trop longues à résoudre, ce qui m’aurait fait perdre ma motivation (je pense que beaucoup connaissent cette peur de perdre la motivation).

Et c’est ainsi qu’au cours d’une soirée de discussion sur les différentes options avec une IA, on m’a suggéré le duo Astro et Cloudflare Pages.

Mon expérience avec le duo Astro et Cloudflare Pages

En échangeant avec l’IA, j’ai réalisé que cette combinaison répondait parfaitement à mes critères, et même plus. Les avantages majeurs qui sont venus en bonus :

  1. Aucune manipulation de Docker, de build de projet ou de déploiement : vous donnez à Cloudflare Pages l’accès au dépôt Git, vous faites un push sur la branche master, et Cloudflare Pages s’occupe du build et du déploiement. Autrement dit, après le push sur master, il n’y a absolument rien à faire, pas même cliquer sur un bouton supplémentaire ;
  2. Vérification locale : tester ce que vous avez fait localement se fait littéralement en une commande. On vérifie, on teste, on repousse sur Git.

Le résultat de mon test de cette combinaison est que mes exigences et mes objectifs ont été respectés ; je peux continuer à avancer dans cette direction. Le brouillon de mon site avec sa première structure a été réalisé en une seule soirée.

Astro et mes critères

Je ne vais pas répéter les éloges sur ce framework que l’on trouve facilement sur Google, je vais seulement décrire comment Astro a résolu mes problèmes personnels :

  • Minimum d’efforts et personnalisation flexible : un brouillon de site, bien que perfectible et fait à la hâte, a été généré en une soirée.
  • Configuration SEO : avec Astro, toute la page est par défaut du HTML pur, par conséquent, tout le SEO est entre mes mains.
  • Support Markdown : Astro le gère parfaitement et va même plus loin. On peut créer une structure avec une page web modèle, définir séparément les conditions minimales pour l’affichage du contenu qui sera tiré de fichiers md ou mdx. Pour créer une nouvelle page par la suite, il suffit de créer un fichier md ou mdx. Plus besoin de copier-coller du HTML.
  • Multilinguisme : implémenté dans Astro via le mécanisme i18n. Il suffit de bien structurer les dossiers du projet. J’ai choisi de stocker les chaînes de caractères de chaque page dans un tableau au format JSON. Les traductions des fichiers Markdown sont également supportées. Il suffit de mettre en place la structure.
  • Coût : Cloudflare Pages s’est avéré être un outil aux limites généreuses avec son forfait gratuit (jusqu’à 500 builds de projet par mois). Au final, je n’ai payé que le nom de domaine.

Compte tenu de la vitesse à laquelle le développement web évolue, Astro et Cloudflare Pages ne sont certainement pas les seules solutions de ce type. Pour ma part, j’ai eu un « match » parfait en une soirée, mes demandes ont été satisfaites et c’est tout ce dont j’avais besoin. Si vos objectifs sont similaires, je recommande vivement cette combinaison.

Conseils

Voici quelques points que je regrette ou que je n’ai pas pris en compte tout de suite (réflexions pour ceux qui débutent en web) :

  1. Anticipez la structure : avant même de commencer à coder un brouillon, il est préférable de le dessiner dans un éditeur pour comprendre la hiérarchie et organiser vos exigences.
  2. Unification des composants : réfléchissez à l’avance aux composants qui seront répétitifs (en-tête, pied de page, boutons). Pensez en format “design system” pour éviter de multiplier les styles et de perdre du temps plus tard à refactoriser pour extraire les styles communs.
  3. Multilinguisme : comprenez ce que sont les pages canoniques (canonical tags) pour que les robots de recherche ne soient pas désorientés par les pages traduites.

Conclusion

À mon avis, même sans expérience spécifique en développement web, le duo Astro et Cloudflare Pages permet de créer des sites flexibles et puissants dans la limite du raisonnable. En s’appuyant sur les outils d’IA, la plupart des problèmes sont aujourd’hui tout à fait solubles. Et point important pour beaucoup : tout cela sera gratuit (si l’on ne compte pas le nom de domaine que j’ai acheté sur Cloudflare, ce qui n’est pas obligatoire mais vivement conseillé).