Partage Apprendre les bonnes pratiques de CSS avec BEM OOCSS & SMACSS

[louloudev]

Projet de formation​

Durant cette formation, vous allez concevoir un site web dédié aux articles sur le CSS. Voici les étapes clés de ce projet passionnant :

• Structuration du CSS : Vous allez structurer votre code de manière optimale pour que votre site soit à la fois esthétique et performant. La méthodologie BEM vous guidera pour une organisation claire et logique.
• Développement Modulaire : À travers la méthodologie SMACSS, votre site sera conçu de manière modulaire. Cela signifie que chaque partie de votre site pourra être modifiée indépendamment des autres, garantissant une évolutivité et une flexibilité accrues.
• Personnalisation Avancée : Pour donner une touche unique à votre site, vous utiliserez la méthodologie OOCSS combinée aux puissances de Bootstrap 5 et Sass. Cette étape vous permettra d'ajouter des détails et des fonctionnalités spécifiques à votre site.

À la fin de cette formation, vous aurez en main un site web riche en articles sur le CSS, conçu selon les meilleures pratiques du développement web

Description​

Le CSS : Cascading Stylesheet (les feuilles de styles en cascade en français) est, avec l’HTML, le langage du développement web. C’est le langage informatique permettant la mise en forme des pages web.
Le CSS permet de modifier et de contrôler l’apparence des pages visibles sur les ordinateurs de bureau et les écrans mobiles.
En même temps que l’évolution du web, les méthodologies de développement se sont modernisées pour apporter des solutions prêtes à l’emploi et des outils pour automatiser et normaliser le processus de développement.
Des méthodologies comme SOOCS, SUITCS, BEM et SMACSS partagent les mêmes principes et objectifs de :
●Créer une base de code solide et flexible ;
●Créer des règles CSS avec une convention de nommage standardisée et une syntaxe stricte ;
●Créer une architecture CSS structuré, ordonné et organisé ;
Dans cette formation CSS, vous découvrez :
En premier, une méthodologie pour créer des composants réutilisables et flexibles, BEM, qui est :
●L’abréviation de Block Element Modifier regroupe trois composantes pour créer du CSS plus structurée avec une terminologie reconnaissable
●Une convention de dénomination, simple avec :
○Une syntaxe stricte pour écrire du code plus lisible, explicite, scalable et robuste
○Et, des appellations communes pour aider à modifier et maintenir le code front
En deuxième, vous découvrez SMACSS, qui est l'abréviation de Scalable and Modular Architecture for CSS : une architecture évolutive et modulaire du CSS en français. SMACSS offre :
●Un guide de style pour écrire et diviser le CSS en cinq catégories
●Une terminologie standard et reconnaissable avec un ensemble de directives CSS pour :
○Organiser les règles CSS en modules réutilisables
○Créer du code plus propre avec une meilleure lisibilité et maintenabilité
Enfin, vous découvrez OOCSS, la méthodologie CSS pour créer des objets de style et des utilitaires CSS
●OOCSS (CSSOS), CSS orienté objet en français, inclut des composants CSS (à un niveau supérieur) et des objets de style décoratifs (utilitaires réutilisables)
+Programme de la formation CSS
Présentation de la formation CSS
M1 : CSS : de ses origines au CSS moderne
M2 : Méthodologie BEM : les règles et les bonnes pratiques
M3 : [PROJET] - Organiser le CSS avec BEM
M4 : L'approche architecturale et modulaire de la méthodologie SMACSS
M5 : [PROJET] - Créer et organiser une architecture CSS en cinq catégories avec SMACSS
M6 : OOCSS : Découvrir Le CSS orienté objet
M7 : [PROJET] - Créer des utilitaires CSS avec OOCSS et Bootstrap 5
Conclusion
❖Pour plus de détails, rendez-vous à l’onglet « Programme détaillé ».
Formateur
Cette formation CSS sera présentée et animée par le formateur Sandy Ludosky, formatrice, consultante en informatique et spécialiste dans le développement front en JS.
Elle accompagne ses clients dans leur transformation digitale avec le développement de solutions logicielles multiplateformes. Depuis 2014, Sandy accompagne également des milliers d'apprenants, francophones et anglophones, dans leur montée en compétences en développement web et mobile.


Voici le lien vers la ressource :

Vous devez répondre à ce post pour accéder à ce contenu.