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

General Discussion

Chase Lee
Chase Lee
29,275 Points

Sass Content

Hi Treehouse,

I was looking around and saw that we now have Sass as one of the languages. I was wondering what that was and where I could find it.

Thanks.

4 Answers

Patrick Johnson
Patrick Johnson
9,505 Points

First off, let me say that Sass is amazing. It's a CSS pre-compiler that allows the author to easily create CSS files that are easy to read (with nested styles) and easy to manage (with variables for things like font, color, height, etc).

You should definitely check it out. Sass is pretty easy to install and get running with your machine. The toughest concept to grasp might be the 'include' for files, which basically allows the author to section out code in pieces, then once the compiler is run, those sections are included into the overall CSS style sheet.

Check it out at Sass's Website

Chase Lee
Chase Lee
29,275 Points

So is it kinda like PHP include commands?

Patrick Johnson
Patrick Johnson
9,505 Points

I'm not extremely well-verssed in PHP but conceptually, yes.

At first I was hesitant to start learning Sass. My initial reaction was: 'oh, another language...' Now it's the only thing I'll write in.

The one downside is since it's a pre-compiler you'll have to recompile the SCSS every time you change something, but that becomes second nature and easier with the help of an advanced workflow and plugins.

I'd also suggest checking out this quick tutorial by NetTuts+ that goes over the basis of SASS

James Richards
James Richards
2,976 Points

SASS is a CSS pre compiler. It basically takes out a lot of the repeated code you'd normally write in your regular css files.

You can write sass files using the CSS techniques you already know, gradually building on that by adding in different features of SASS that benefit you as you learn more.

One of the most powerful features of SASS is nesting, this is covered on the SASS home page and I highly recommend you visit that page to get to grips with what SASS does and what it can offer you. Another great feature of SASS is includes, this allows you to split up your CSS into separate files. This gives you a more modular approach when your working with CSS, so you could have say, a separate CSS file specifically for styling web forms, so you would have _forms.scss. This file would then be reference in your main css file, where all of your modular "include" files will be grouped together to form a single CSS file once you compile your css.

SASS relies on Ruby, so your going to need to install that on your computer first, from there, you then need to install sass which is covered on the sass website. If your on a Mac, you already have Rub on your machine. If you Windows, you need to get it. It can be installed from here for Windows: http://rubyinstaller.org/downloads/ 1.9.3 is a relatively new build and is very stable. Once you have Ruby, install sass and form there you can setup whats called a "watcher" in the command line. This will watch your Sass files for changes and automatically spit out some lovely css files for you.

While your at it, check out Compass too. They kinda go in tandem with each other, although personally I just use SASS on production work. Hope this info helps! http://compass-style.org/

SASS will make you way more efficient at coding CSS. It's a big life changer. Good luck!