1 parte: Descarga e instalación

Bienvenid@

¡Hi devs! Hoy les quiero traer un tutorial, sobre Sass, ya que es un preprocesador bastante bueno y recomendado por mí y muchos más devs. Además de que un amigo necesitaba esto; espero que les guste, así que, ¡Vamos allá!

Reseña histórica

Sass (Syntactically Awesome Stylesheets) es un lenguaje de hoja de estilos en cascada inicialmente diseñado por Hampton Catlin y desarrollado por Natalie
Weizenbaum.Después de sus versiones iniciales,
Nathan Weizenbaum y Chris Eppstein han continuado extendiendo Sass con SassScript, un lenguaje de script simple, usado en los ficheros Sass.
Sass es un metalenguaje de Hojas de Estilo en Cascada (CSS). Es un
lenguaje de script que es traducido a CSS, SassScript es el lenguaje de script en sí mismo.

introducción

Sass es un preprocesador css, pero, ¿qué es un preprocesador css? Es un programa que nos permite hacer css con la sintaxis única del prepocesador. Es la forma más eficiente de escribir css.

Sass sirve para mucho, desde declarar variables más ordenado y eficiente, hasta hacer el css de tu aplicación en pequeños archivos .sass de menos de 15 líneas de código,así que si quieres aprender a usar este preprocesador tan útil y práctico, has venido al lugar correcto,¡Vamos allá!

instalación y descargas

descargas

Hay dos métodos de hacerlo, por aplicación, y línea de comando, si quieres probar una aplicación, recomiendo Scout es OpenSource y rápidamente tienes un entorno de trabajo.

Ahora, la línea de Comandos es la más recomendable a mi parecer, pero tranquilo, no es nada difícil la instalación de sass.

Requisitos indispensables

Necesitas tener instalado Ruby para poder instalar Sass, pero, ¿qué es Ruby? Ruby es un lenguaje se programación y además tiene un gestor de paquetes llamado Ruby.gems y Sass es un gems ( así se llaman los paquetes de Ruby.gems); Ruby.gems permite distribuir tanto paquetes como librerías. Fue diseñado para que fácilmente pudiera construir, instalar y distribuir librerías.

instalación de Ruby en Windows

Los pasos son de verdad,muy fáciles, lo que tienes que hacer es ir a la página oficial de Ruby, y descargar según sus necesidades (32 bits y 64 bits), es el típico programa ejecutable, donde sólo le das siguiente y te muestra información y opciones,vas leyendo hasta terminar la instalación,¡y eso es todo! Ya tenemos Ruby instalado en Windows.

instalación de Ruby en Linux y Mac

En Linux y en Mac, Ruby viene pre instalado en el sistema por defecto. La versión no es la más actualizada, pero si lo que pretendes es usar Sass, sirve.

Lo que necesita Sass es que la versión de Ruby sea igual o mayor a la versión 1.8.7 en la mayoría de casos la versión que viene pre instalada es la 1.9.3 o superior.

Si tu distribución de Linux no trae Ruby pre instalado, a continuación presento las otras dos de maneras de instalar Ruby:

Usar el Sistema de gestión de paquetes di tienes una distribución basada en debian o la misma debian puedes usar el apt (advanced packaging tool) de la siguiente manera

$ sudo apt install (nombre-del-paquete)

en caso de tener una distribución de Linux que no utilice apt puedes ir a la página oficial de Ruby y revisar los muchos y extensos métodos de instalación

Para finalizar con la parte de la instalación, les presento RVM (Ruby Version Manager). Una muy buena herramienta para la línea de Comandos, que te permite fácilmente instalar, manejar y trabajar con varios entornos de Ruby.

Cabe destacar que el proceso de instalación es algo más largo y tedioso,pero nada del otro mundo. También,pienso que vale la pena usar esta herramienta ya que permite tener varias versiones de Ruby y Sass sin desinstalar las que usamos diariamente,es útil cuando salen versiones nuevas pero quieres usar la anterior también. Esta herramienta está disponible para todos los sistemas operativos,tanto Windows como Linux y Mac. Es totalmente compatible con los 3 sistemas operativos.

Admito que Me he quedado mucho en la instalación de Ruby,pero era para que no se confundan y mostrarles todas las opciones posibles,ahora si toca la instalación de Sass.

instalación de Sass

Antes de empezar a instalar Sass, les quiero decir que si tienen dudas con gusto responderé siempre y cuando esté a mi alcance.

La instalación de Sass es muy fácil:

Abrir la terminal ( en Windows cmd).
Usamos Ruby.gems para instalar Sass,recuerden que Ruby.gems es la que gestiona los paquetes

$ gem install sass

el comando instalará todas las dependencias requeridas. Si la consola marca error a lo mejor necesitaremos usar el sudo

$sudo gem install sass

para comprobar si se instaló correctamente, copiamos y pegamos en la consola o cmd este comando:

$sass -v

eso nos debería devolver la versión de Sass 3.4.7 (selective Steve).

instalación de Sass con Node.js

Ahora, anteriormente vimos como instalar Sass con Ruby,pero hay otro método más o igual de efectivo.

Con Node.js, el microframework más famoso de Javascript; su popularidad se sobreentiende. Para instalar Sass necesitamos Node.js instalado (pasa algo parecido con Ruby, pero ahora en vez de ser una gem, es un npm). En la página oficial están los métodos de descarga.

Ya con Node.js instalado, lo que hay que hacer es:

Abrir la terminal o cmd.
Y poner esto

$npm i sass-g

el i es para indicar que vamos a descargar un paquete de node, ponemos el nombre del paquete y -g es para descargarlo globalmente en todo el computador,luego ponemos

$sass -v

para verificar que se descargó correctamente, si nos sale la versión, ¡todo ha ido bien!

¡Felicidades! Has completado la instalación de Ruby y Sass, son herramientas que todo dev debería tener en su ordenador. Luego haré posts de cómo usar Sass,su sintaxis y demás. Hasta pronto devs! Recuerda que cualquier duda la puedes dejar en la bandeja de comentarios.