Mode Plan
Qu'est-ce que le Mode Plan ?
Le Mode Plan est le workflow intelligent de Claude Code pour gérer les tâches complexes à plusieurs étapes. Face à une refactorisation majeure, au développement de nouvelles fonctionnalités ou à des changements systémiques, Claude créera d'abord un plan détaillé, puis l'exécutera étape par étape.
C'est comme un architecte qui dessine des plans avant de commencer la construction.
Pourquoi avons-nous besoin du Mode Plan ?
Problèmes Traditionnels
Les tâches complexes sans planification mènent souvent à :
- 🔄 Confusion directionnelle : Découvrir des défauts de conception à mi-parcours nécessitant une refonte
- 🧩 Détails manqués : Oublier de gérer les dépendances et cas limites
- ⏰ Perte de temps : Modifier et ajuster répétitivement les approches
- 🐛 Introduction d'erreurs : Implémentation précipitée causant bugs et incohérences
Avantages du Mode Plan
- 🎯 Perspective holistique : Considérer l'architecture globale avant d'agir
- 📋 Étapes claires : Décomposer les tâches complexes en petites étapes exécutables
- ✅ Progrès traçable : Chaque étape a des critères d'achèvement clairs
- 🔄 Approche ajustable : Discuter et optimiser les plans avant l'exécution
Workflow du Mode Plan
1. Déclenchement du Mode Plan
Déclenchement Automatique
Claude entrera automatiquement en Mode Plan dans les situations suivantes :
> Refactoriser tout le système d'authentification utilisateur, supporter plusieurs méthodes de connexion et améliorer la sécurité
# Complexité : Élevée → Entre automatiquement en Mode Plan
> Ajouter le support d'internationalisation à l'application, incluant frontend, backend et base de données
# Portée d'impact : Large → Entre automatiquement en Mode Plan
Déclenchement Manuel
Vous pouvez aussi activer manuellement le Mode Plan :
> /plan Implémenter la fonctionnalité de chat temps réel
> /plan Optimiser les performances de l'application, objectif de réduire de moitié le temps de chargement du premier écran
2. Phase de Création du Plan
Claude analysera la tâche et générera un plan structuré :
## 📋 Tâche : Refactorisation du Système d'Authentification Utilisateur
### 🎯 Objectifs
- Supporter connexion email/nom d'utilisateur
- Intégrer OAuth tiers (Google, GitHub)
- Implémenter mécanisme JWT + Refresh Token
- Ajouter authentification à deux facteurs (2FA)
- Améliorer sécurité et expérience utilisateur
### 🔍 Analyse d'Impact
- **Frontend** : Composants de connexion, gestion d'état d'authentification, gardes de route
- **Backend** : APIs d'authentification, middleware, modèles de base de données
- **Sécurité** : Politiques de mot de passe, gestion de session, protection contre attaques
### 📝 Plan d'Exécution
#### Phase 1 : Préparation (Estimé 30 minutes)
- [ ] Sauvegarder le code d'authentification existant
- [ ] Analyser la structure de données utilisateur actuelle
- [ ] Concevoir le nouveau schéma de base de données
- [ ] Préparer les scripts de migration
#### Phase 2 : Refactorisation Backend (Estimé 2 heures)
- [ ] Mettre à jour le modèle utilisateur et tables de base de données
- [ ] Implémenter le nouveau service d'authentification
- [ ] Créer la classe utilitaire JWT
- [ ] Implémenter l'intégration OAuth
- [ ] Ajouter le support 2FA
#### Phase 3 : Adaptation Frontend (Estimé 1,5 heure)
- [ ] Refactoriser les composants de connexion
- [ ] Mettre à jour la gestion d'état d'authentification
- [ ] Implémenter l'interface de connexion OAuth
- [ ] Ajouter la page de paramètres 2FA
#### Phase 4 : Tests et Validation (Estimé 1 heure)
- [ ] Écrire les tests unitaires
- [ ] Exécuter les tests d'intégration
- [ ] Vérifications de sécurité
- [ ] Tests d'expérience utilisateur
### ⚠️ Points de Risque
- La migration de données peut affecter les utilisateurs existants
- La configuration OAuth nécessite le support de services externes
- L'implémentation 2FA nécessite des packages de dépendances supplémentaires
### 🎯 Critères de Succès
- [ ] Tous les tests passent
- [ ] Données utilisateur existantes migrées complètement
- [ ] Les nouvelles fonctionnalités d'authentification fonctionnent normalement
- [ ] Aucune dégradation significative des performances
3. Phase de Confirmation du Plan
Claude présentera le plan et demandera confirmation :
Claude : J'ai créé un plan détaillé pour la refactorisation du système d'authentification. Veuillez réviser le plan ci-dessus.
Que souhaitez-vous faire :
1. 🚀 Commencer à exécuter ce plan
2. ✏️ Modifier certaines parties du plan
3. 📋 Voir plus de détails d'implémentation
4. ⏸️ Pauser, exécuter plus tard
Quel est votre choix ?
4. Phase d'Exécution
Une fois le plan confirmé, Claude commence l'exécution étape par étape :
[✅ Phase 1.1 Terminée] Sauvegardé le code d'authentification existant dans backup/auth-legacy/
[🔄 Phase 1.2 En Cours] Analyse de la structure de données utilisateur actuelle...
Trouvé :
- Table utilisateur contient email, username, password_hash
- Champs liés OAuth manquants
- Aucun champ de configuration 2FA
[✅ Phase 1.2 Terminée] Analyse de structure de données terminée
[🔄 Phase 1.3 En Cours] Conception du nouveau schéma de base de données...
Types de Mode Plan
1. Plan Séquentiel (Plan Linéaire)
Les étapes doivent être exécutées dans l'ordre :
1. Concevoir le schéma de base de données
2. Implémenter l'API backend
3. Développer l'interface frontend
4. Tests d'intégration
Adapté pour : Changements d'architecture, migration de données, processus de déploiement
2. Plan Parallèle
Certaines étapes peuvent être effectuées simultanément :
Groupe Parallèle A :
- Implémenter l'API d'authentification utilisateur
- Concevoir l'interface de connexion
Groupe Parallèle B :
- Écrire les tests unitaires
- Préparer les mises à jour de documentation
Point de Convergence : Tests d'intégration
Adapté pour : Développement de fonctionnalités, optimisation des performances, projets multi-modules
3. Plan Itératif
Compléter en plusieurs cycles d'itération :
Itération 1 : Authentification de Base (MVP)
- Connexion email/mot de passe
- Gestion de session de base
Itération 2 : Fonctionnalités Améliorées
- Connexion OAuth tiers
- Fonctionnalité de réinitialisation de mot de passe
Itération 3 : Amélioration de Sécurité
- Authentification à deux facteurs
- Détection d'anomalies de connexion
Adapté pour : Grands projets, amélioration progressive, développement MVP
Bonnes Pratiques
1. Granularité du Plan
✅ Granularité Appropriée
- [ ] Implémenter l'endpoint API d'inscription utilisateur
- [ ] Ajouter la logique de vérification email
- [ ] Créer le composant de formulaire d'inscription
- [ ] Intégrer la validation de formulaire
❌ Trop Grossier
- [ ] Compléter le système utilisateur
- [ ] Faire l'interface frontend
❌ Trop Granulaire
- [ ] Créer le fichier register.js
- [ ] Ajouter la première ligne de code
- [ ] Importer le module express
- [ ] Écrire une déclaration de variable
2. Gestion des Risques
Identifier et signaler les risques dans le plan :
### ⚠️ Étapes à Haut Risque
- **Migration de Base de Données** (Risque : Perte de données)
- Atténuation : Valider d'abord en environnement de test
- Contingence : Préparer les scripts de rollback
- **Intégration de Service Tiers** (Risque : Service indisponible)
- Atténuation : Implémenter dégradation gracieuse
- Contingence : Fournir option de connexion manuelle
3. Définition de Points de Contrôle
Définir la vérification aux nœuds clés :
#### Point de Contrôle 1 : Migration de Données Terminée
Conditions de Vérification :
- [ ] Toutes les données utilisateur migrées avec succès
- [ ] Les anciens et nouveaux hachages de mot de passe peuvent vérifier
- [ ] Les utilisateurs de test peuvent se connecter normalement
#### Point de Contrôle 2 : Vérification de Fonctionnalité API
Conditions de Vérification :
- [ ] Tous les endpoints d'authentification répondent normalement
- [ ] La gestion d'erreurs couvre divers scénarios
- [ ] Documentation API mise à jour
4. Suivi des Progrès
Mettre à jour les progrès du plan en temps réel :
> Comment se déroule le progrès actuel ?
Claude :
📊 Progrès Global : 60% (12/20 étapes terminées)
✅ Terminé :
- Conception du schéma de base de données
- Implémentation API backend
- Développement de classe utilitaire JWT
🔄 En Cours :
- Développement de composant de connexion frontend (70%)
⏳ En Attente :
- Intégration OAuth
- Tests et documentation
Techniques Avancées
1. Planification de Branches Conditionnelles
### Point de Décision de Branche : Gestion des Données Utilisateur Existantes
**Option A** : Migration En Ligne
- Avantage : Transparente pour l'utilisateur
- Risque : Peut affecter les performances
- Condition : Nombre d'utilisateurs < 100k
**Option B** : Migration Hors Ligne
- Avantage : Sûre et fiable
- Risque : Nécessite fenêtre de maintenance
- Condition : Nombre d'utilisateurs > 100k
**Base de Décision** : Nombre d'utilisateurs actuel et exigences métier
2. Planification de Rollback
### 🔄 Stratégie de Rollback
Si des problèmes majeurs sont rencontrés pendant l'exécution :
**Déclencheurs de Rollback Immédiat** :
- Perte ou corruption de données
- Crash système ou indisponibilité
- Vulnérabilité de sécurité découverte
**Étapes de Rollback** :
1. Arrêter les nouveaux déploiements
2. Restaurer la sauvegarde de base de données
3. Rollback du code vers la version précédente
4. Notifier les équipes concernées
3. Portes de Qualité
### ✅ Standards de Qualité
L'achèvement de chaque phase doit respecter :
**Qualité du Code** :
- ESLint 0 erreurs, 0 avertissements
- Mode strict TypeScript passe
- Couverture de test > 80%
**Qualité Fonctionnelle** :
- Tous les scénarios utilisateur testés
- Métriques de performance respectées
- Scan de sécurité ne montre aucun problème à haut risque
Applications de Scénarios Communs
Scénario 1 : Projet d'Optimisation des Performances
> /plan Optimiser les performances de l'application, réduire le temps de chargement du premier écran de 5 secondes à moins de 2 secondes
Claude créera un plan complet incluant :
- Diagnostic des problèmes de performance
- Conception de solution d'optimisation
- Implémentation de division de code
- Optimisation de stratégie de cache
- Optimisation d'images et ressources
- Validation et monitoring
Scénario 2 : Migration de Stack Technique
> /plan Migrer le projet des composants de classe React vers les composants fonctionnels + Hooks
Le plan inclut :
- Formulation de stratégie de migration
- Tri de priorité des composants
- Implémentation de migration progressive
- Processus de validation de test
- Arrangement de formation d'équipe
Scénario 3 : Développement de Nouvelle Fonctionnalité
> /plan Ajouter une fonctionnalité complète de panier d'achat et de checkout au site e-commerce
Couvre :
- Analyse des exigences et conception technique
- Conception de modèle de données
- Développement API
- Implémentation d'interface frontend
- Intégration de paiement
- Tests et déploiement
Après avoir maîtrisé le Mode Plan, vous pouvez apprendre le Mode Plan Automatique pour comprendre comment faire en sorte que Claude détermine plus intelligemment quand utiliser le Mode Plan.