36 points par bamchi 2025-06-29 | 9 commentaires | Partager sur WhatsApp
  • 17 heures, de 9 h à 2 h du matin pour créer et déployer, avec Claude Code et Rails 8, un service de collecte de données réellement exploitable en production, avec un frontend entièrement développé et mis en ligne
  • Toutes les étapes hors backend réalisées en collaboration avec l’IA : de la planification au design, au frontend, aux tests et au déploiement, dans un processus de développement one-stop
  • En fournissant uniquement l’URL d’un site de référence, l’IA analyse le ton et le style pour construire automatiquement un système de design cohérent
  • Développement parallèle par duplication de dossiers : développement des fonctionnalités principales et correction de bugs menés simultanément pour maximiser l’efficacité
  • Application forcée de la méthode TDD afin de garantir une qualité de code de niveau production, avec couverture de tests
  • L’IA résout elle-même les erreurs de déploiement : en cas de problème de migration, elle gère automatiquement sauvegarde → rollback → redéploiement
  • Conception détaillée d’un système d’affiliation à commission différenciée B2B/B2C et d’un modèle de revenus intégrant les coûts des services externes
  • Connexion du domaine et exploitation réelle du service : le service est actuellement accessible sur acticrawl.com

Le déroulé réel de ce marathon de développement de 17 heures

Étape 1 : création d’un système de design basé sur une référence (2 heures)

  • Fourniture à l’IA de l’URL d’un site SaaS existant pour analyser automatiquement couleurs, typographie et patterns de mise en page
  • Mise en place, avec TailwindCSS, d’un système de composants de niveau Bootstrap afin d’assurer une UI/UX cohérente
  • Mise en œuvre d’une expérience utilisateur professionnelle grâce à la standardisation des boutons, animations et effets de survol

Étape 2 : structuration des pages et implémentation des fonctionnalités (8 heures)

  • Landing page : page principale de présentation du service et d’acquisition des utilisateurs
  • Système d’authentification : inscription et connexion

Étape 3 : conception de la logique métier et du modèle économique (4 heures)

  • Système d’affiliation : structure de commission différenciée de 20 % pour le B2B et 15 % pour le B2C
  • Calcul des coûts des services externes : tarification réaliste intégrant les frais d’exploitation, comme les IP proxy

Étape 4 : tests et déploiement (3 heures)

  • Rédaction de tests en TDD pour garantir la stabilité
  • Pipeline de déploiement automatisé : en cas d’erreur, l’IA résout le problème étape par étape
  • Optimisation de la connexion du domaine et de l’environnement de production

Découverte d’un workflow innovant

Développement parallèle par duplication de dossiers

  • Duplication du projet en deux dossiers avec exécution indépendante de Claude Code dans chacun
  • Développement des fonctionnalités principales et correction des bugs menés en parallèle pour doubler la vitesse de développement
  • Gestion de branches sécurisée selon GitHub Flow et réduction des conflits au minimum

Faire apprendre des règles de développement à l’IA

  • Une fois configurées, les règles sont respectées durablement par l’IA : TDD, Git Flow, principe DRY, I18n, etc.
  • Une qualité de code cohérente que l’IA ne laisse jamais échapper, même si l’humain oublie
  • Application automatique des best practices de niveau développeur senior

The 17-Hour Development Principle

Dépasser les limites des méthodes de développement traditionnelles

  • Des tâches de développement frontend qui prenaient de quelques semaines à plusieurs mois sont réalisées en une journée
  • Un nouveau paradigme dans lequel une seule personne peut assumer à la fois les rôles de designer et de développeur frontend
  • Atteinte d’une qualité de frontend réellement exploitable en production, et non d’un simple MVP

L’effet de synergie d’une combinaison d’outils IA

  • Claude Code + Rails 8 + TailwindCSS : une capacité de combinaison inattendue
  • Chaque outil est bon séparément, mais leur usage conjoint produit un effet exponentiel
  • Une nouvelle référence en matière de productivité de développement

Résultats vérifiés et publication en toute transparence

Service réellement exploité

  • acticrawl.com : un frontend complet et fonctionnel actuellement accessible (le backend sera développé séparément)
  • Tests frontend complets : une base de code UI/UX stable, développée en TDD
  • Modèle économique concret : une conception réaliste intégrant structure de revenus et coûts d’exploitation

Publication de l’ensemble du processus

  • Vidéo récapitulative du développement en 17 heures (https://www.youtube.com/live/zNy9BM8LJwc) rendant l’intégralité du processus transparente
  • Échanges réels avec l’IA et processus de résolution des problèmes documentés de manière vivante
  • Un workflow reproductible que d’autres développeurs peuvent aussi exploiter

Un signal de transformation de l’écosystème de développement

Extension des capacités des développeurs individuels

  • L’époque où l’on peut développer seul un frontend de niveau entreprise est arrivée
  • Le cycle planification → design → implémentation passe d’une échelle de plusieurs semaines à quelques jours
  • Une forte baisse de la barrière d’entrée du développement frontend, ouvrant davantage de possibilités d’innovation

Un nouveau standard pour la collaboration avec l’IA

  • Au-delà de la simple génération de code, l’IA est utilisée comme véritable partenaire de développement frontend de bout en bout
  • Une méthodologie de collaboration efficace avec l’IA à toutes les étapes du frontend, de la planification au déploiement
  • Un cas concret démontrant qu’il est possible d’accélérer sans dégrader la qualité

Conclusion

Ce projet est une démonstration concrète de la manière dont les outils d’IA peuvent améliorer de façon radicale la productivité des développeurs frontend. L’essentiel n’est pas seulement la vitesse, mais le fait qu’il soit possible de construire en une journée un frontend complet prenant en compte les tests, le déploiement et l’exploitation.

PS : si vous voulez tenter le défi des 17 heures de développement, la vidéo récapitulative (https://www.youtube.com/live/zNy9BM8LJwc) est recommandée
PPS : si le service réel vous intrigue, vous pouvez essayer acticrawl.com directement

9 commentaires

 
malcomjj 2025-07-01

C’est un honneur de voir ce genre de vidéo YouTube aussi en Corée. Je m’en inspirerai bien, merci !

 
illiil1lii 2025-07-01

Il semble qu'il y ait beaucoup d'endroits où la section docs ne fonctionne pas.

p. ex.
https://acticrawl.com/en/docs/quickstart

 
bamchi 2025-07-01

Nous allons effectivement procéder au travail sur les documents. Merci !

 
illiil1lii 2025-07-01

Est-ce que la formulation ci-dessous est juridiquement acceptable ?
> Trusted by thousands of companies
Samsung, LG, Kakao, Naver, Coupang

 
rlaehdus2003 2025-06-30

17 heures, c’est impressionnant, bravo.
Je pense que cela sera très utile comme référence lorsqu’on créera un service. Merci.

J’aimerais toutefois vous poser une question : y a-t-il eu des points difficiles ou des obstacles pendant le processus ? (Je n’ai pas encore vu la vidéo… je vais la regarder bientôt.)

 
helio 2025-06-30

Difficultés liées à l’utilisation de l’IA
La vidéo est globalement très positive sur l’usage de l’IA pour le développement, mais l’intervenant mentionne aussi რამდენიმე défis et points à prendre en compte.

  • Délai pour obtenir une réponse : l’intervenant indique qu’il peut s’écouler un certain temps entre la question posée et la réponse de l’IA.
  • Risque de code inexact : il est reconnu que l’IA peut parfois générer du code erroné.
  • Nécessité des tests : l’intervenant souligne l’importance pour l’IA de tester son propre code afin de détecter les erreurs, car il est difficile pour un humain de relire la grande quantité de code qu’elle produit.
  • Défis de l’internationalisation : l’intervenant explique que la prise en charge de plusieurs langues est importante pour avoir une portée mondiale, mais qu’elle peut être difficile en raison de barrières linguistiques, comme un manque de maîtrise de l’anglais, du chinois ou du japonais.
  • Besoin d’améliorations itératives : l’intervenant propose une approche de développement itérative, consistant à commencer par une version de base puis à l’améliorer. Cela signifie que l’IA ne réussira pas forcément à tout rendre parfait dès la première tentative.
  • Gestion des erreurs : l’intervenant donne une solution lorsqu’une erreur survient : copier-coller le message d’erreur pour permettre à l’IA de la résoudre. Cela montre que, même avec l’IA, les erreurs font partie du processus de développement.

J’ai essayé d’utiliser l’IA..

 
bamchi 2025-06-30

Avec quelle IA avez-vous fait le résumé ? J’ai l’impression que la qualité du résumé n’est pas très élevée haha

 
helio 2025-06-30

C’est un gamin qui l’a écrit 😭

 
bamchi 2025-06-30

Tous les points difficiles ou les obstacles sont mentionnés dans la vidéo. Merci.