Conventions du dossier des crochets et proximité des tests
Créez une convention simple pour les crochets (préfixe use*, logique pure), placez les crochets dans les dossiers de fonctionnalités et gardez les tests à côté des unités qu’ils vérifient.
Conventions du dossier des crochets et proximité des tests est une leçon React Academy gratuite sur CoddyKit. Ceci est la leçon 2 sur 3. Tu peux lire la leçon complète ci-dessous gratuitement — puis la pratiquer en direct dans le navigateur avec un éditeur de code intégré et un tuteur IA 24/7. Elle fait partie du parcours d'apprentissage React Academy, et ta progression se synchronise sur le web et l'application CoddyKit. Le cours React Academy comprend 3 leçons au total.
Pourquoi des conventions pour les hooks ?
Objectif : garder les hooks bien organisés et testables.
- Préfixes : use*
- Logique pure dans les hooks ; interface utilisateur à l’extérieur
- Regrouper les tests près des unités concernées
Idée de structure des dossiers
- features/counter/useCounter.js
- features/counter/CounterPanel.jsx
- features/counter/useCounter.test.jsx
- ui/Button.jsx
Modèle de hook : useCounter
Les hooks renvoient état + actions ; gardez une API réduite et prévisible.
<div id="root"></div>Réutilisation du modèle de hook useToggle
Les petits hooks sont faciles à réutiliser. Deux composants partagent le même comportement useToggle.
<div id="root"></div>Test simulé : useCounter
Conservez un petit fichier de test à côté du hook (par exemple useCounter.test.jsx). Ici, nous simulons des assertions.
<div id="root"></div>Conseils et liste de vérification
- Nommez les hooks avec use*
- Gardez les hooks purs (sans DOM) et renvoyez une API minimale
- Regroupez les tests à côté des hooks/composants
Vérification des bases du regroupement
Récapitulatif
Récapitulatif : placez les petits hooks purs dans les dossiers de fonctionnalités, renvoyez des API simples et stockez les tests juste à côté des unités afin qu’ils restent ensemble lors des refactorisations.
Questions Fréquemment Posées
La leçon « Conventions du dossier des crochets et proximité des tests » est-elle gratuite ?
Oui — le texte complet de « Conventions du dossier des crochets et proximité des tests » est gratuit à lire ici sur le web. Pour la pratiquer de manière interactive (un éditeur de code intégré et un tuteur IA 24/7) et déverrouiller le reste du cours React Academy, passe à CoddyKit PRO. Le cours React Academy comprend 3 leçons au total.
Qu'est-ce que j'apprendrai dans « Conventions du dossier des crochets et proximité des tests » ?
Créez une convention simple pour les crochets (préfixe use*, logique pure), placez les crochets dans les dossiers de fonctionnalités et gardez les tests à côté des unités qu’ils vérifient. Tu pratiques React Academy avec du code pratique que tu exécutes directement dans le navigateur, et un tuteur IA 24/7 répond à tes questions au fur et à mesure que tu avances dans la leçon.
Dois-je avoir de l'expérience pour commencer React Academy ?
Aucune expérience préalable n'est requise. React Academy sur CoddyKit est structuré pour les débutants jusqu'aux apprenants avancés, donc tu peux commencer ici ou depuis le début et avancer à ton rythme. Ceci est la leçon 2 sur 3.
Combien de temps prend la leçon « Conventions du dossier des crochets et proximité des tests » ?
La plupart des leçons CoddyKit prennent environ 5–10 minutes. Chacune est courte et interactive, tu progresses régulièrement et tu repiques exactement où tu t'es arrêté sur le web et l'app.
Peux-tu écrire et exécuter du code dans cette leçon React Academy ?
Oui. Chaque leçon React Academy inclut un éditeur de code intégré, tu écris et exécutes du vrai code directement dans ton navigateur et tu reçois des retours IA instantanés — aucune configuration locale requise.
Toutes les leçons de ce cours
- Dossiers de fonctionnalités et composants d’interface ou composites
- Conventions du dossier des crochets et proximité des tests
- Recommandations de refactorisation