Accueil Formations Apprendre CSS 3

Savoir Nommmer les Classes de Design Pattern

Retour à la formation
Chapitre 45 Leçon 1
Précédent
Suivant

Cette leçon explique l'importance de bien nommer vos classes de design pattern pour un code cohérent et réutilisable.

Détails de la leçon

Description de la leçon

Avant de poursuivre la création de votre page web, il est essentiel de se poser la question du nommage des classes de design pattern. Dans cette vidéo, nous montrons comment nommer efficacement vos classes en fonction de leur fonctionnalité plutôt que de leur apparence. Cela permet de maintenir la cohérence et la réutilisabilité de votre code à travers différentes pages et éléments de votre site. Par exemple, des éléments récurrents comme la navigation, le header, et le footer doivent avoir des noms génériques et fonctionnels tels que navigation ou header. Il est également recommandé de nommer les sections promotionnelles et de produits de manière logique, par exemple, promotion ou product, et d'éviter des noms basés sur des styles spécifiques comme fond-rouge.

Objectifs de cette leçon

L'objectif de cette vidéo est de vous apprendre à nommer vos classes de CSS selon des principes de design pattern afin de rendre votre code plus cohérent et réutilisable à travers différents projets web.

Prérequis pour cette leçon

Pour suivre cette vidéo, il est nécessaire d'avoir une bonne connaissance du HTML et du CSS, ainsi qu'une compréhension de base des concepts de design pattern.

Métiers concernés

Les compétences abordées dans cette vidéo sont particulièrement utiles pour les métiers de développeur front-end, intégrateur web et designer UI/UX.

Alternatives et ressources

En complément de cette approche, il existe des solutions comme l'utilisation de frameworks CSS tels que Bootstrap ou Tailwind CSS, qui implémentent déjà des conventions de nommage cohérentes et réutilisables.

Questions & Réponses

Il est important de nommer les classes par leur fonctionnalité pour éviter des incohérences lors de modifications de style et pour garantir que le code reste compréhensible et réutilisable.
Un mauvais nommage de classe pourrait être fond-rouge, tandis qu'un bon nommage serait header-banner, car ce dernier décrit la fonctionnalité plutôt que l'apparence.
Un mauvais nommage des classes CSS peut rendre le code difficile à maintenir, provoquer des confusions lors des modifications et réduire la réutilisabilité des composants à travers le site.