A brief introduction to Sass that I created for the Ventura County WebMob Meetup group on November 11, 2015. There was a live demo after slide 8 to demonstrate how Sass worked, so the presentation is better live.
aumnia.comWhat is a CSS Preprocessor?
“A scripting language that extends CSS and
gets compiled into regular CSS syntax”
aumnia.comHow popular is Sass?
According to an information survey of developers conducted at http://ashleynolan.co.uk/blog/frontend-tooling-survey-2015-results
aumnia.comBut wait, I’m already a CSS expert…
Sass will make you a CSS ninja!
It will help you to
•Generate cleaner, more readable code,
•Organize and modularize your CSS,
•Create pieces for reuse across projects (and sharing),
•Import cool libraries, and
•Achieve cross-browser compatibility (with some help
from its friends)
aumnia.comKey features (to get you going)
• [Advanced] Mathematical Calculations
• Color variations
Let’s see if live examples will work….
1.Use an application – CodeKit, Scout, etc.
2.Go command line
See http://sass-lang.com/install for more info on above options
3.Step up your game and use a task runner
a) These are tools like Gulp or Grunt
b) They do all kinds of great stuff in addition to
turning your Sass into CSS