Formation Jekyll et Jamstack

Formation Jekyll & Jamstack

[Jour 1 – Matin]

Introduction à Jekyll et à la philosophie Jamstack

• Comprendre Jamstack : JavaScript, APIs, Markup
• Découvrir Jekyll (Ruby) et ses usages
• Avantages : performance, sécurité, scalabilité
• Panorama écosystème et cas d’usage
• Comparaison vs CMS traditionnels
• Atelier pratique : Installation locale et génération d’un premier site.

[Jour 1 – Après-midi]

Structurer un projet Jekyll

• Base Jekyll : répertoires, fichier de configuration et standards à respecter
• Templates Liquid, layouts et partials
• Gestion des collections et du contenu
• Front matter, variables et filtres
• Organisation du routing et des permalinks
• Atelier pratique : Construire un blog avec pages et articles.

Personnalisation et thèmes

• Installer et adapter des thèmes Jekyll
• Intégrer CSS et frameworks
• Gestion des assets
• Optimisation : minification, bundling, lazy loading
• Design responsive et accessibilité
• Atelier pratique : Créer un thème personnalisé.

[Jour 2 – Matin]

Intégrer des données et des APIs

• Données YAML/JSON/CSV
• Consommer des APIs externes
• Combiner Jekyll avec un Headless CMS
• Cas d’usage : blog, doc, e-commerce statique
• Approche hybride : statique + contenu dynamique
• Atelier pratique : Injecter une API dans un site Jekyll.

[Jour 2 – Après-midi]

Déploiement et hébergement Jamstack

• Déploiement GitHub Pages, alternatives Netlify, Vercel, Cloudflare Pages
• Automatisation CI/CD (build, test, preview)
• Gestion des environnements (staging, prod)
• Variables d’environnement et secrets
• Stratégies de mise en ligne
• Atelier pratique : Pipeline CI pour déployer sur Netlify.

SEO et optimisation

• Bonnes pratiques SEO (balises, titres, maillage)
• Sitemaps, robots.txt, données structurées
• Core Web Vitals et performance
• Plugins SEO pour Jekyll
• Audit d’accessibilité
• Atelier pratique : Optimiser le SEO d’un site existant.

[Jour 3 – Matin]

Jamstack : outils complémentaires

• Panorama des Headless CMS
• Commerce headless (Snipcart, Shopify headless)
• Fonctions serverless pour le dynamique
• Gestion du contenu multilingue
• Architectures Jamstack en entreprise
• Atelier pratique : Mini-site Jamstack Jekyll + API headless.

[Jour 3 – Après-midi]

Sécurité et maintenance

• Durcissement d’un site statique
• Gestion des dépendances Ruby/Gem
• Mises à jour & régression
• Backups et versioning Git
• Surveillance des performances & erreurs
• Atelier pratique : Audit sécurité et performance.

Cas pratiques et industrialisation

• Études de cas Jekyll
• Choisir entre Jekyll, Hugo, Gatsby, Next.js
• Workflow d’équipe et revues
• Stratégies d’évolution et migration
• Checklist de mise en production
• Atelier pratique : Projet final Jamstack (site + API + déploiement).