Amies licornes, lecteurs réguliers ou nouveaux, bonjour !

Depuis le début de la formation (ou presque) nous manipulons du CSS. Pratiques et relativement simples, nos cascading style sheet ont pourtant quelques légers inconvénients : on finit par en avoir des stères et pour modifier un gros projet bonjour la galère.

Quels sont les moyens de composer et modifier rapidement son CSS ?

Il existe une solution à cette fin : les préprocesseurs. Less, Stylus, quelque autres et SASS qui est un des plus utilisés actuellement. Et c’est sur ce dernier que va porter le présent article.

Mais quoi t’es-ce que c’est ?!

SASS permet de générer des feuilles de style à la manière d’objet. Il intègre notamment les fonctions suivantes :

  • Variables : principalement utilisées afin de stocker des valeurs ;
  • Nesting : il facilite l’écriture et la hiérarchisation des sélecteurs ;
  • Import : utilisé avec la syntaxe @import, cette fonction permet d’intégrer de petites portions de code SASS à votre feuille de style ;
  • Mixin : elle permet de stocker des déclarations et ainsi d’y faire appel où on le désire ;
  • Operator : l’opérateur mathématique de SASS est très pratique, permettant pour exemple de conserver des proportions harmonieuses même sur d’autre appareils.

Vrai gain de productivité ?

Oui… mais. Oui mais il faut s’habituer à la logique de SASS. La CSS puisque généré de manière automatique peu facilement contenir des erreurs de déclaration ou de priorité si vous avez mal organisé votre code.
Oui… mais il est un peu lourd à mettre en place pour de petit projets (effet lance roquette pour déboucher une canette de bière), et ne révèle sa vraie force qu’après un peu de pratique.

 

Mais…OUI !

Pourtant SASS est un outil très actuel pour gérer votre quotidien de web-designer. Ses fonctionnalités permettant de coder d’une manière proche de l’objet (boite à outils, mon amour), le stockage des valeurs, le besoin de rigueur dans son organisation sont quelques-unes des nombreuses force de ce pré-processeur.

Permettant une approche globale de votre CSS, il permet aussi d’en renforcer l ‘homogénéité. Enfin, les projets ambitieux, riche de milliers de lignes à structurer nécessitent d’avoir un contrôle optimal de votre CSS.

En conclusion

SASS c’est bon, mangez-en ! A la base du célèbre Bootstraps, SASS est une référence dans son domaine et intègre des fonctionnalités très récentes et pertinentes. C’est donc un outil très moderne et qui mérite d’être étudié de près.

 

That all folks !