Heads up! To view this whole video, sign in with your Courses account or enroll in your free 7-day trial. Sign In Enroll
Well done!
You have completed CSS to Sass!
You have completed CSS to Sass!
Preview
Before we wrap up, let's go over a few additional tools and resources that will help you go forward with Sass.
Sass Coding Tools
Sass Layout Tools
Sass Mixin Libraries
Sass References
Related Videos
Related Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign upRelated Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign up
Remember how you felt about Sass at the
beginning of this course?
0:00
How do you feel about it now?
0:03
Hopefully the whole CSS to Sass process
seems a little less intimidating.
0:04
And we've only just scratched the surface
of what Sass can do for us.
0:08
So before we wrap up, let's go over a few
additional tools and
0:12
resources that will help you go forward
with Sass.
0:15
So if you need quick tools to try out
ideas, or
0:19
quickly experiment with Sass, two of the
best tools are Codepen and Sassmeister.
0:21
To use Sass on Codepen, we can click the
settings icon in the CSS window.
0:27
Then we can select either the Sass or SCSS
syntax.
0:33
Then you can start writing Sass in the CSS
window.
0:38
Now to view the compiled CSS, you can
click the preview icon and
0:41
it shows you the compiled CSS preview.
0:46
So a really helpful tool for working with
Sass and writing Sass snippets.
0:48
So another awesome tool made by the Sass
community for
0:53
the Sass community is Sassmeister.
0:56
Again, Sassmeister supports both the Sass
and SCSS syntax.
0:59
You write your Sass in the left column and
1:04
it shows you the CSS output in the right
column.
1:06
And in the advanced Sass course, Dale
Sand, one of the creators of Sassmeister,
1:10
gives us a good rundown of all the
features of Sassmeister.
1:15
And if you're looking for
1:19
helpful layout tools while building with
Sass check out Susy.
1:20
Susy is a smart and powerful set of Sass
mixins for building grid-based layouts.
1:25
And it's a flexible tool for defining and
using various types of grid layouts.
1:30
Now breakpoint at breakpoint-sass.com is
also
1:35
a great tool that makes writing and using
media queries in our Sass really simple.
1:40
So next, if you need any Sass mixin
libraries
1:46
to speed up your workflow even more, start
by checking out Bourbon.
1:50
Bourbon is a simple and lightweight mixin
library for Sass.
1:54
And it helps write CSS faster and easier.
1:58
Now, if you like using Bourbon,
2:01
there's also a lightweight responsive grid
framework they make called, NEAT.
2:03
And NEAT is built on top of Bourbon.
2:09
And we can use it for building all types
of layouts.
2:11
Finally, there's also the Compass
framework at compassstyle.org.
2:14
Now, to learn more about Compass you can
actually check out the Compass Basics
2:19
course in our library.
2:23
Finally, for more help and references, you
can always refer to the original Sass
2:25
documentation, accessible from the Sass
homepage at sass-lang.com.
2:30
And there's also popular blogs like The
Sass Way and Sass break
2:36
which frequently publish articles about
the latest in Sass and related topics.
2:42
So, as you can see, there are lots of
helpful Sass resources out there.
2:49
And if you come across a handy Sass
snippet, don't just copy and
2:54
paste it into your project, anyone can
copy code.
2:57
Now if we try to understand the thinking
that went behind that code,
3:00
that's where a lot of the learning and
understanding will happen for you.
3:04
One of the best parts about Sass has
little to do with the technology itself,
3:09
it's the community around Sass that also
makes it special.
3:13
Sass is driven by an amazing community of
designers and developers who
3:16
love to collaborate, help others out, and
spread the word about Sass.
3:20
So, what's next?
3:24
Well, there are more courses on Sass that
will teach you advanced concepts,
3:25
how to write modular code and more, but
3:29
what can we do now to practice what we
have learned?
3:31
Well you can start by converting your
portfolio or blog over to Sass.
3:34
Or you can build a simple website,
3:38
even just a small site component from
scratch using Sass.
3:40
Now if you work with a team, go ahead and
3:44
show your team some of the neat things we
can do with Sass.
3:46
Or get on CodePen or SassMeister and just
experiment with Sass code.
3:49
Learning and experimenting gives us the
courage to build more projects and
3:54
share our ideas, even if it means we mess
up a little more often,
3:57
but that's okay because that's how we're
gonna get better.
4:01
So remember, we're always here to help, so
if you have any questions about Sass
4:04
feel free to reach out to our wonderful
treehouse community on the forum, or
4:08
you can get a hold of me on Twitter, I'm
@guilh..
4:13
Thanks, everyone.
4:15
You need to sign up for Treehouse in order to download course files.
Sign upYou need to sign up for Treehouse in order to set up Workspace
Sign up