meta données pour cette page
  •  

Différences

Ci-dessous, les différences entre deux révisions de la page.

Lien vers cette vue comparative

Les deux révisions précédentesRévision précédente
certif:procedure:develop:formatagecode [2026/03/10 16:13] – nicolascertif:procedure:develop:formatagecode [2026/03/12 11:32] (Version actuelle) – supprimée nicolas
Ligne 1: Ligne 1:
-====== Bonne pratique pour angular ====== 
-====== RÉFÉRENTIEL : Conventions de Nommage Angular ====== 
  
-Ce document définit les standards de nommage à respecter sur l'ensemble de nos projets Angular pour garantir la cohérence du code et faciliter la maintenance. 
- 
----- 
- 
-===== 1. Structure des Fichiers (Kebab-case) ===== 
-La règle d'or est le **"Pattern à deux points"** : ''nom.type.extension''. Tous les noms de fichiers doivent être en **kebab-case** (minuscules et tirets). 
- 
-^ Type de fichier ^ Convention ^ Exemple ^ 
-| **Composant** | ''nom.component.ts'' | ''user-profile.component.ts'' | 
-| **Service** | ''nom.service.ts'' | ''auth.service.ts'' | 
-| **Module** | ''nom.module.ts'' | ''app-routing.module.ts'' | 
-| **Interface/Modèle** | ''nom.model.ts'' | ''hero.model.ts'' | 
-| **Guard** | ''nom.guard.ts'' | ''auth.guard.ts'' | 
- 
-===== 2. Classes et Types (PascalCase) ===== 
-Les noms de classes utilisent le **PascalCase** et doivent impérativement inclure le suffixe du type de fichier. 
- 
-  * **Composants :** ''export class UserProfileComponent { }'' 
-  * **Services :** ''export class AnalyticsService { }'' 
-  * **Pipes :** ''export class FileSizePipe { }'' 
-  * **Directives :** ''export class HighlightDirective { }'' 
- 
-===== 3. Sélecteurs et templates (kebab-case) ===== 
-Les sélecteurs de composants et de directives doivent utiliser un préfixe (par défaut ''app-'') pour éviter les collisions avec les balises HTML natives. 
- 
-  * **Correct :** ''<app-user-list></app-user-list>'' 
-  * **Incorrect :** ''<user-list></user-list>'' 
- 
-===== 4. Tests Unitaires (.spec.ts) ===== 
-Les fichiers de tests doivent porter le même nom que le fichier testé, avec l'extension ''.spec.ts''. 
- 
-  * **Fichier :** ''auth.service.spec.ts'' 
-  * **Description (describe) :** Doit correspondre au nom de la classe. 
-<code typescript> 
-describe('AuthService', () => { ... }); 
-</code> 
-  * **Cas de test (it) :** Doit décrire un comportement attendu (souvent en anglais avec "should"). 
-<code typescript> 
-it('should return true when user is authenticated', () => { ... }); 
-</code> 
- 
-===== 5. Assets et Ressources Statiques ===== 
-Pour les images, icônes et fichiers de configuration : 
- 
-  * **Images/Icons :** Toujours en **kebab-case**. 
-    * ''logo-entreprise-couleur.svg'' 
-    * ''user-avatar-placeholder.png'' 
-  * **Dossiers d'assets :** Organiser par type pour plus de clarté : 
-    * ''assets/images/'' 
-    * ''assets/icons/'' 
-    * ''assets/i18n/'' (pour les fichiers de traduction JSON) 
- 
-===== 6. Logique Interne (camelCase) ===== 
-Pour les propriétés et les fonctions à l'intérieur des classes, le **camelCase** est la norme. 
- 
-  * **Variables :** ''isValid: boolean = false;'' 
-  * **Méthodes :** ''updateUserData() { ... }'' 
-  * **Inputs/Outputs :** ''@Input() userRole: string;'' 
- 
-===== 7. Constantes et Énumérations ===== 
-Les valeurs globales immuables doivent être facilement identifiables. 
- 
-  * **Constantes :** Utiliser le **UPPER_SNAKE_CASE**. 
-<code typescript>export const MAX_FILE_SIZE = 5000;</code> 
-  * **Enums :** Nom de l'Enum en **PascalCase**, valeurs en **PascalCase** ou **UPPER_SNAKE_CASE**. 
- 
-===== 8. Règles d'Organisation des Dossiers ===== 
-  * **Cohérence :** Le nom du dossier doit correspondre exactement au préfixe des fichiers qu'il contient. 
-  * **Arborescence :** 
-    * ''/core'' : Services singletons, guards globaux. 
-    * ''/shared'' : Composants et pipes réutilisables. 
-    * ''/features'' : Modules métiers spécifiques. 
- 
-===== 9. Recommandations additionnelles ===== 
-> **Interfaces :** Ne pas utiliser le préfixe "I" (ex: utiliser ''User'' et non ''IUser''). 
-> **Sémantique :** Nommer les services par leur fonction métier (''StorageService'') plutôt que par leur type de données (''DataService'').