Como utilizar SASS y SMACSS

SASS es un lenguaje de procesamiento de CSS, el cual permite desarrollar y mantener las hojas de estilos de los sitios web de una forma más rápida y sencilla. Por el otro lado SMACSS es una arquitectura y filosofía creada por Jonathan Snook, para la estructuración de las hojas de estilos de un proyecto, buscando facilitar la mantenibilidad y flexibilidad, mediante la categorización de los estilos en diferentes archivos.

El equipo de desarrollo de Envato ha desarrollado una variación de SMACSS para utilizar con SASS, la cual a mi parecer es bastante útil e interesante para implementar en los proyectos, debido que SMACSS está conceptualizada para ser usada con CSS y sus limitaciones.

SMACSS define cinco categorías o archivos, los cuales son base, layout, module, state y theme. El enfoque del que hablaré omite las categorías layout y theme. A continuación explicaré que se debe incluir en cada una de las categorías:

Base

En esta categoría se incluirán los estilos base de nuestro proyecto, por ejemplo la hoja de estilo Normalize.css, tipografías, colores y márgenes básicos de todo el sitio.

Module

Los módulos son todos aquellos componentes reutilizables e independientes, las dependencias de los módulos son los estilos básicos de la aplicación, para asegurar que cumplan con esta premisa, deben de ser estructurados de tal forma de que si son eliminados del proyecto no causarán problemas con otros módulos o estilos.

State

Las reglas de estado son todas aquellas que determinan como se verá un módulo, cuando se encuentra en un estado en específico, las mismas se incluirán junto a las reglas del módulo.

¿Qué paso con las categorías Layout y Theme?

Los estilos que para SMACSS son parte de layout son conceptualizados como parte de module, finalmente la finalidad que tiene theme son resueltas a partir del uso de variables en un archivo de configuración, explotando esta maravillosa característica de SASS.

Conclusión

El utilizar esta metodología o cualquier otra similar, siempre traen un beneficio para el mantenimiento, escalabilidad y desarrollo de los productos, por lo que se debe contemplar la opción de implementar este tipo de metodologías en los proyectos, para aprovechar de la experiencia y soluciones creadas por personas con gran experiencia en el área.