Aprende SASS – primeros pasos

Comparteme!Share on FacebookShare on Google+Tweet about this on TwitterShare on LinkedInEmail this to someone

 

Si ya estas cansado de pasar malos ratos, como repetir el mismo código puede llevarte muchas horas de trabajo. Igualmente, buscar un error dentro de documento de más 1000 linea de código, o simplemente buscado algún estilo en especifico. Te recomiendo que te quedes y sigas estos sencillos pasos para instalar SASS, que te ahorraran todos esos problemas.

Primero lo básico, ¿Qué es SASS (Systactically Awesome StyleSheets)?, es un pre-procesador que potencia el lenguaje CSS, el cual permite usar variables, mixins, imports, y demás. Todas con completa compatibilidad de la sintaxis CSS. Asimismo, ayuda a mantener bien organizados una gran cantidad de hojas de estilos, ya que nos permite modular nuestras hojas de estilos creando archivos pequeños que puedan ser ejecutado con mayor rapidez.

Existen varias maneras de instalar SASS, una de ellas es por aplicaciones (la mayoría pagas) como CodeKit, Compass.app, y Ghostlab, entre otras, para desarrolladores con mas experiencia existe otro método, por consola, para usuarios linux y windows es necesario instalar ruby. Los usuarios con Mac obvian este paso ya que su equipo lo trae pre-instalado.

Es recomendado tener conocimientos y el manejo medio/avanzado del lenguaje CSS, por otra parte, no todos los editores pueden interpretar el lenguaje SASS para eso necesitaras editores similares a como VS Code o Atom que ya lo tienen integrado.

INSTALACIÓN

PASO 1: Instalar Ruby.

Como mencione anteriormente para los usuarios Linux y Windows  es necesario primero la instalación de ruby. Los usuarios linux deben abrir el terminal e ingresar sudo su -c "gem install sass". Los usuarios windows deben ir a la parte de descargas en la pagina de ruby y descargar e instalar el programa.

PASO 2: Instalar SASS.

Una vez ya tengamos ruby en nuestros equipos debemos abrir nuestras consolas con Ruby (Este usa ‘gem’ para manejar varios paquetes de código), en la consola escribiremos gem install sass en caso de que te de un error escribes sudo gem install y te solucionara el problema.

PASO 3: Verificación.

Ahora debemos correr el comando sass -v para asegurarnos de que se haya instalado. Si te retorna un mensaje como Sass 3.4.22 (Selective Steve) lo habremos instalado correctamente.

Ahora te toca empieza a utilizar SASS en todos tus proyectos y ser más eficiente escribiendo un mejor código. Por otra parte, te dejare la documentación para que continúes aprendiendo. Por ultimo, recuerda ¡Code Once, Think twice!

Comparteme!Share on FacebookShare on Google+Tweet about this on TwitterShare on LinkedInEmail this to someone

Deja un comentario

A %d blogueros les gusta esto: