Sass

In week 2 of DBC, we were asked to code a website from scratch using HTML and CSS. That was a frustrating week mostly due to how painful CSS can be to a new coder. Especially if you’re just mucking around not really knowing how to structure your CSS or what best practices to follow. Now that I’m in week 9, and the last week of Phase 0, we were asked to refactor our sites using a framework like Jekyll. Why Jekyll is awesome will come in a different blog post, but through Jekyll I came upon a sexy little CSS compiler called Sass. Which has helped me remember why I love web design again.

What is Sass you ask?

Well, straight from the horse’s mouth, aka Hampton Catlin, he says “think of it as mixing rocket fuel with your CSS and strapping it to a skateboard while pushing it down a hill”. It turns out, after spending all day learning how to use Sass, I am a fan. It allows you to follow the principles of object oriented programming while compiling your code into vanilla CSS.

5 things to love about Sass

CSS is a subclass of Sass, meaning just writing CSS means you’re also writing Sass! Of course, Sass lets you do way cooler things than plain CSS…

  1. you can create variables and reuse them across your stylesheets
  2. you can use loops to dynamically create fun color palettes like this
  3. you can use placeholder classes %placeholder
  4. object oriented CSS - CSS3 mixins
  5. THE CODE IS SO MUCH EASIER TO MAINTAIN!