Formation : Vibecoding avec Bolt

Module 1 — Découvrir Bolt.new, builder full-stack dans le navigateur

• Comprendre que Bolt.new (StackBlitz) est un agent de développement web qui permet de décrire, exécuter, éditer et déployer une application full-stack dans le navigateur.
• Identifier la technologie clé : les WebContainers, qui exécutent le projet directement dans le navigateur, sans installation locale.
• Repérer la stack générée par défaut : React + Tailwind pour le front, avec câblage du back et de la base de données.
• Comprendre le principe du vibecoding : décrire en langage naturel ce que l'on veut, l'IA génère l'ossature de l'app.
• Cadrer les cas d'usage : prototypes, sites et petites applications web générés rapidement.

Module 2 — Décrire et générer une application

• Rédiger un prompt clair décrivant l'objectif, les écrans et les fonctionnalités attendues.
• Laisser l'agent échafauder (scaffold) le front, le back et le câblage de la base en quelques instants.
• Affiner la demande de façon itérative pour préciser structure et comportement.
• Comprendre que la génération produit un vrai projet éditable, pas une simple maquette.
• Garder des demandes ciblées pour obtenir un code lisible et maîtrisable.

Module 3 — Aperçu immédiat et édition du code

• Bénéficier d'un aperçu en temps réel de l'application grâce à l'exécution dans le navigateur.
• Inspecter et éditer le code généré directement dans l'environnement in-browser.
• Installer et exécuter des outils npm (Vite, serveurs Node.js) sans configuration locale.
• Modifier l'UI front-end, ajuster le style, ajouter ou retirer des fonctionnalités.
• Tester en direct chaque changement pour valider le comportement avant d'aller plus loin.

Module 4 — Intégrer des services et une base de données

• Connecter des services externes et câbler une base de données à l'application.
• Ajouter la logique métier et faire évoluer le back-end selon les besoins.
• Gérer les variables d'environnement et les clés nécessaires aux intégrations.
• Vérifier le bon fonctionnement des intégrations via l'aperçu avant déploiement.
• Structurer le projet pour rester maintenable au fil des itérations.

Module 5 — Déployer l'application

• Déployer directement depuis le navigateur : Bolt Cloud est devenu l'hébergement par défaut des nouveaux projets.
• Choisir une alternative comme Netlify selon les besoins du projet.
• Comprendre le passage du prototype à une application publiée accessible en ligne.
• Vérifier l'application déployée et itérer rapidement en cas d'ajustement.
• Anticiper les limites : relire le code généré et sécuriser avant une mise en production réelle.