CSS is one of those technologies that we learn to use when starting with web development. But after we find better solutions we don't really think about it. Don't get me wrong CSS is great it helps us build modern and rich ui for websites. But when I'm creating a web application for my client CSS might not be the best choice.
The Problem With Frameworks
the only problem I have with using framework such as bootstrap or tailwind is that they are a completely different way of writing CSS and a average beginner might find it difficult to use these technology right away in their project. So the problem arises how do we make css less boring and also make it easier for developers to write it?
Solution To The Problem
Let's introduce Sass also known as Syntactically Awesome Style Sheets.
Sass is a css framework that builds on top of normal css,its like typescript but for css.
But Why do i like sass so much?
to know the answer of this lets answer three questions
Why should I use sass?
Sass is literally css!.Yeah sass is literally css but with some extra feature. This makes developer experience amazing!
Sass is smart!. When you write sass you are also writing legacy support for older browsers
Sass is mature! sass is stable and has a large community!
So the next time someone tells you they need to use a CSS framework point them to this blog!
Now for the final part I am going to give you some resources that you can use to your advantage
.
sass Documentation: https://sass-lang.com/
SASS SCSS SYNTAX AND SASS
sass can be written in two ways using the scss or the sass way
create a file with .scss syntax to use the scss syntax
and use .sass to use the sass bracket syntax
What't the difference
SCSS does not contain any brackets and relies on indentation
SASS uses to contain a style
TIP: CHECK THE SASS DOCS TO SEE MORE ABOUT SASS VS SCSS
//scss code
.button
padding: 3px 10px
font-size: 12px
border-radius: 3px
border: 1px solid #e1e4e8
//sass code
.button {
padding: 3px 10px;
font-size: 12px;
border-radius: 3px;
border: 1px solid #e1e4e8;
}
PROMOTION
If you like this content be sure to subscribe to my youtube channel as a thank you helps me a lot! :)
CHANNEL--👉https://www.youtube.com/channel/UCVN9qpxbrJ9qMPjpZf3ywpA
signing off....
Top comments (5)
but also
Your reasoning is shakier than pudding.
You know that Bootstrap is built with Sass, right?
With bootstrap you have to learn a new syntax and a new style of writing css which might not be the best for beginners sass is css but with a few perks like variables mixins functions loops etc
Sass also writes legacy css for you like webkit so it works on older browsers too.bootstrap might use sass but it's method might not be the best for beginners
Do you have questions? feel free to ask!
Maybe you can add a little bit more about SASS or reference SASS documentation? Since SASS has two syntax and its SCSS that is an extension of CSS syntax, just a thought.
Tanwa Sripan Thanks for highlighting the issue we are going to fix the issue as soon as possible please check the blog again to see the updated changes...thanks again :)