Ca y est. La derniere lecon. A la fin, ton Waitlist Wizard sera en ligne sur internet — accessible a quiconque a l'URL. Tout ce que tu as construit au cours des neuf dernieres lecons se rassemble ici.
Strategie de deploiement
Nous utiliserons AWS Amplify — le chemin le plus simple pour deployer une application Next.js sur AWS. Amplify se connecte a ton repository GitHub, compile ton application automatiquement, et l'heberge sur un CDN mondial (Content Delivery Network).
Concept
Le deploiement est le processus de prendre ton code depuis ton ordinateur et de le mettre sur un serveur ou n'importe qui dans le monde peut y acceder. AWS Amplify automatise ca : tu push du code vers GitHub, et Amplify le compile et le deploie automatiquement.Preparer le deploiement
Avant de deployer, assurons-nous que tout est pret :
Essaie
Dans Claude Code :"Review the project for deployment readiness. Check: 1. No hardcoded localhost URLs 2. Environment variables are in .env.local (not committed) 3. The build completes without errors (run npm run build) 4. All sensitive data is in .gitignore 5. Create a .env.example file listing required environment variables without actual values"
Si npm run build affiche des erreurs, partage-les avec Claude pour les corriger. Le build doit passer avant de pouvoir deployer.
Push vers GitHub
D'abord, nous devons mettre ton code sur GitHub pour qu'Amplify puisse y acceder :
Etape 1 : Creer un repository GitHub
- Va sur github.com et clique sur l'icone "+" > "New repository"
- Nomme-le
waitlist-wizard - Garde-le Private (ton code, ton choix)
- N'ajoute pas de README, .gitignore ou licence (nous les avons deja)
- Clique sur "Create repository"
Etape 2 : Push ton code
Essaie
Dans Claude Code :"Help me push this project to GitHub. The repository URL is https://github.com/[your-username]/waitlist-wizard.git. Add the remote, and push the main branch."
Remplace [your-username] par ton vrai nom d'utilisateur GitHub.
Claude executera les commandes git :
git remote add origin https://github.com/yourusername/waitlist-wizard.git
git branch -M main
git push -u origin main
Deployer avec AWS Amplify
Maintenant la partie excitante :
Etape 1 : Va dans la console AWS Amplify (cherche "Amplify" dans la console AWS)
Etape 2 : Clique sur "Create new app" > "Host web app"
Etape 3 : Choisis GitHub comme source et autorise AWS a acceder a tes repositories
Etape 4 : Selectionne ton repository waitlist-wizard et la branche main
Etape 5 : Amplify detectera automatiquement que c'est un projet Next.js et configurera les parametres de build. Verifie-les — ils devraient etre corrects.
Etape 6 : Ajoute tes variables d'environnement :
- Clique sur "Advanced settings"
- Ajoute
ADMIN_PASSWORDavec ton mot de passe choisi
Etape 7 : Clique sur "Save and deploy"
Attends 2-3 minutes. AWS Amplify est en train de compiler ton application, de la packager et de la distribuer sur leur reseau mondial.
Quand le build est termine, tu verras une URL du type : https://main.d1a2b3c4d5.amplifyapp.com
Essaie
Clique sur ton URL Amplify. Tu devrais voir ta landing page Waitlist Wizard — en ligne sur internet ! Essaie d'envoyer un email et de visiter la page /admin.Connecter DynamoDB (remplacer le stockage JSON)
Notre stockage en fichier JSON fonctionnait pour le developpement, mais il ne marchera pas sur AWS Amplify (les environnements serverless n'ont pas de systemes de fichiers persistants). Passons a DynamoDB :
Essaie
Dans Claude Code :"Switch the data storage from the local JSON file to AWS DynamoDB: 1. Create a DynamoDB table called 'waitlist-signups' with partition key 'email' (String) 2. Update the /api/signup route to write to DynamoDB instead of the JSON file 3. Update the /api/signups route to read from DynamoDB 4. Use the AWS SDK v3 for JavaScript 5. Use environment variables for the AWS region 6. Include instructions for setting up IAM permissions"
Apres que Claude ait mis a jour le code, tu devras :
-
Creer la table DynamoDB dans la console AWS :
- Va dans DynamoDB > Create table
- Nom de la table :
waitlist-signups - Cle de partition :
email(String) - Laisse tous les autres parametres par defaut (capacite a la demande)
-
Configurer les permissions IAM pour qu'Amplify puisse acceder a DynamoDB :
- Va dans IAM > Roles
- Trouve le role qu'Amplify a cree pour ton application
- Ajoute la politique
AmazonDynamoDBFullAccess
-
Ajouter les variables d'environnement dans Amplify :
AWS_REGION:us-east-1
-
Push et redeploie :
git add .
git commit -m "switch to DynamoDB for production data storage"
git push
Amplify recompilera et redeploiera automatiquement. Ca prend 2-3 minutes.
Tester ton application en ligne
Parcours le flux complet :
- Visite ton URL Amplify — vois la landing page
- Envoie un email de test — ca devrait reussir
- Visite
/admin— entre ton mot de passe - Vois l'email dans le tableau de bord — il est stocke dans DynamoDB !
- Essaie l'export CSV — il devrait inclure les donnees en ligne
Astuce pro
Tu peux verifier les donnees directement dans DynamoDB : va dans DynamoDB > Tables > waitlist-signups > Explore table items. Tu verras chaque email stocke comme un enregistrement dans la base de donnees.Ce que tu as construit
Prends un moment pour apprecier ce que tu as accompli :
- Une landing page professionnelle avec collecte d'emails
- Une API backend qui valide et stocke les donnees
- Une base de donnees cloud (DynamoDB) avec mise a l'echelle automatique
- Un tableau de bord admin avec graphiques et export CSV
- Le tout tournant sur AWS, accessible a quiconque a l'URL
- Cout mensuel total : 0$ (dans les limites du free tier)
Et ensuite ?
Ton parcours de vibe coding ne s'arrete pas ici. Quelques idees :
- Domaine personnalise — Pointe ton propre domaine (ex. waitlistwizard.com) en utilisant Route 53 et CloudFront
- Notifications par email — Utilise AWS SES (Simple Email Service) pour envoyer un email de confirmation quand quelqu'un s'inscrit (3 000 emails gratuits/mois)
- Fonctionnalites IA — Utilise Amazon Bedrock pour ajouter des fonctionnalites alimentees par l'IA a ton application
- Construire TA propre idee — Utilise exactement le meme workflow pour construire l'application dont tu reves
Note honnete
Le vibe coding avec l'IA est un vrai superpouvoir, mais il a ses limites. A mesure que tes projets grandissent en complexite, tu rencontreras des situations ou l'IA galere : les flux d'authentification complexes, la logique metier complexe, l'optimisation des performances a grande echelle. Les fondations que tu as construites dans ce cours — comprendre comment les applications web fonctionnent, comment diriger l'IA efficacement, comment deboguer les problemes — te serviront peu importe combien de code tu ecris ou non a la main.Checkpoint Git final
git add .
git commit -m "production deployment with DynamoDB"
git push
Point cle
Tu as commence ce cours sans aucune experience en programmation. Tu as maintenant une application en ligne sur AWS que tu as construite en ayant des conversations avec l'IA. Ce n'est pas une demo jouet — c'est une vraie competence, et c'est l'avenir du developpement logiciel.