Member-only story
Optimize Your CSS Code With Sass
When you work on a large project, you find that the style gets more and more difficult to maintain, and when a client asks for changing the style of a part of the project you worked on it a long, long time ago ☹️️, yeah this is my reaction too.
Sometimes you ask yourself do you need to repeat this CSS code each time or you forget about the color you worked with and you hoped that there is a way to create variables inside CSS and pass them each time rather than pass the color.
Do we have a better way, 🤔?
Yes, this is when Sass goes in.
What is Sass?
Sass is a CSS pre-processor that compiles to CSS, meaning that all CSS rules are valid sass rules.
Sass adds superpower to CSS through variables, nested rules, mixins, functions, and more feature we will see them together.
Before we discover sass, I want to mention the BEM naming convention.
BEM naming convention:
BEM is a methodology for creating reusable components.
