Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS

Jessica Chong
Jessica Chong
2,438 Points

Sass Frameworks vs CSS frameworks?

In what scenario might a developer prefer to choose a Sass framework such as Compass/Bourbon over a CSS framework such as Bootstrap/Foundation.

I know this isn't a direct apples to apples comparison but it seems like they are just two different approaches to doing the same task. I'm curious what types of projects usually find developers opting for one approach over the other.

1 Answer

jason chan
jason chan
31,009 Points

You would use sass to organize your css. Compass and bourbon are libraries built from sass. Sass is just css on steroids with more functionality. You can store variables, loops, deal with colors, color methods (like saturation, or inverse color).

mixins are probably the coolest part of it. Functions with arguments.

Plus you can have partials. Basically split your code in pieces. Like break up your code in files and different folders so their more organized. Your going to see a lot of this in the future. MVC.

If your developing with ruby on rails it's already built into the framework.

The sass/less version of bootstrap and foundation are more customizable. You can comment out functions you don't need making the framework more customizable and light. You can't do that with the minified your stuck with the entire framework.

@import "compass";
// this is sass
body
    padding: 50px
// this is scss the curly braces syntax your used to but you can nest css now.
body {
      color:red;
.col {
      padding: 20em;
      }
}

https://teamtreehouse.com/library/css-to-sass

https://teamtreehouse.com/library/sass-basics

https://teamtreehouse.com/library/compass-basics

https://teamtreehouse.com/library/modular-css-with-sass

https://teamtreehouse.com/library/advanced-sass

Is it worth it to learn sass. Yes I would say so.