Construire un MVP web en 24h avec l'IA et Next.js

En tant que développeur web chez Ipanova, j'adore relever des défis techniques. Tout a commencé par un appel d'un ancien client qui avait construit une application React pour la dégustation de vin. Son app fonctionnait toujours, mais il cherchait un nouveau modèle B2B piloté par l'IA.

Le rappel inattendu

Quand je l'ai contacté pour prendre des nouvelles, la réponse était prévisible : pas de budget pour faire évoluer son application. À la place, il avait une nouvelle idée : une PWA visant une expérience ultra-immersive avec l'IA, sans passer par les App Stores.

Son co-fondateur technique utilisait déjà Next.js et Cursor — ma stack préférée. L'appel s'est terminé par le classique "On gère le MVP en interne pour l'instant."

Un weekend plus tard… Changement de plan !

Lundi matin, rappel surprise. "Hey, organisons un atelier de cadrage et faites-nous un devis pour le MVP !" La porte était ouverte.

Le défi : construire un MVP fonctionnel en 24h

D'expérience passée comme développeur et ancien commercial, je savais : si le client peut voir et interagir avec un vrai prototype, il s'engagera bien plus facilement.

Pourquoi ne pas me challenger à construire un MVP fonctionnel en une journée ? Pas des wireframes — une vraie version cliquable et testable. Deux objectifs :

1. Donner au client un vrai ressenti de l'application.
2. Recueillir des exigences solides dans le processus.

La stack technique : développement assisté par IA

Mes armes secrètes : Cursor, Next.js, ShadcnUI et Vercel AI SDK.

1. Définir des règles et du contexte clairs

Cursor permet de définir des règles dans des fichiers .mdc pour que l'IA comprenne la syntaxe, les frameworks et les conventions utilisées.

2. Des prompts structurés pour chaque fonctionnalité

Au lieu de simplement "demander à l'IA de coder", j'ai soigneusement préparé des prompts pour chaque fonctionnalité : détails, interactions utilisateur, comportement UI. Chaque prompt fonctionnait comme un blueprint pour un pair-programming IA très efficace.

3. Développement rapide

Armé de ChatGPT et Cursor, j'ai enchaîné les itérations. L'IA gérait le code répétitif pendant que je peaufinais la logique et les ajustements UI. Point fort : intégrer un chat OpenAI avec Next.js et Vercel AI SDK — étonnamment simple, avec des résultats bluffants.

La touche finale

Après une journée de code : correction des bugs, polish des interactions, préparation d'une démo structurée. La vraie leçon : pas juste la rapidité de l'IA, mais l'importance des specs bien définies et de la projection utilisateur.

Leçons apprises

1. Le développement assisté par IA change la donne si vous savez le guider.
2. Une approche structurée (règles, prompts, contexte) améliore significativement l'output.
3. Les clients adorent les résultats tangibles — pas juste des slides.
4. Partager la même stack qu'un client, c'est rare et précieux.

Prendre des risques et pousser des approches innovantes : c'est ce qui rend ce métier si passionnant. 🚀