DEV Community

Cover image for What is SASS?
Bhavesh Kasturi
Bhavesh Kasturi

Posted on

What is SASS?

Once you’re comfortable with CSS, the next natural step is to use a preprocessor. The biggest advantage is not having to repeat yourself. “Don’t Repeat Yourself” or "DRY" is a principle in software development aimed at reducing repetition of code, and using SASS we can have the advantage of keeping our CSS Dry.

What is CSS preprocessor?

"A CSS preprocessor is a program that lets you generate CSS from the preprocessor's own unique syntax." - MDN

Why use preprocessors?

  • Cleaner code using variables and nesting.
  • Ease of organizing and maintaining the code as we can separate files into modules.
  • Ability to implement logic and calculations in stylesheets.
  • Overall improvement in workflow which can save hours of development time!

What is SASS?

SASS (or Syntactically Awesome Style Sheets) is a tool known as a CSS preprocessor. SASS is a scripting language that provides us the capabilities which regular CSS doesn't have. Using SASS we can write more maintainable, readable and reusable code.

It gives us various capabilities such as:

  • Variables
  • Partials & Imports
  • Nesting
  • Functions
  • Mixins
  • Control directives
  • Inheritance

In other words SASS helps us write CSS and organize large stylesheets in more maintainable way.

Thanks for reading!

Discussion (6)

Collapse
devcoder profile image
devcoder

I love using SASS! Helps me keep more organized

Collapse
duhbhavesh profile image
Bhavesh Kasturi Author

Yess!

Collapse
coswise profile image
Cosimo Scarpa

I like Sass, even if I prefer the SCSS syntax, it sucks that people stated to snub it a bit. Hoping to see more Sass around or at least more Sass features in CSS.

Collapse
duhbhavesh profile image
Bhavesh Kasturi Author

Hopefully 😅

Collapse
louislow profile image
Louis Low

Mine! My precious... I love Sassy lady...

Collapse
duhbhavesh profile image
Bhavesh Kasturi Author

Hehe❤️