Why I Stopped Using Sass
HTML-код
- Опубликовано: 15 июл 2024
- Have you ever heard how much better Sass is than plain old vanilla CSS? Sass and SCSS has been the go-to for web developers for over a decade, but these days it's not quite as necessary as it used to be. In this video, I'm going to explain why I don't use Sass any more, as well as explain why I don't need its most popular features when I'm writing my CSS. Next time you start a new project, maybe think twice before reaching for Sass over CSS...
Why I don't use vendor prefixes: • What is CSS Prefix?
How to use CSS variables: • Making CSS more effici...
Do you still need a CSS reset?: • Do We Still Need CSS R...
🌐 My website: ericmurphy.xyz
💸 Support the Channel: ericmurphy.xyz/donate
🎥 Watch my videos on Odysee: odysee.com/@ericnmurphy
💻 My GitHub: github.com/ericmurphyxyz
0:00 What's Sass?
2:00 What about variables?
3:33 What about nesting?
7:08 What about mixins?
8:03 Why I don't use Sass
8:47 So what do I use instead? 
Наука
I love sass. I only started using it a week ago and I'm hooked.
What is your opinion on tailwind , personally i like vanilla css 😊 it is javascript that gives me nightmares 😢😢.
Learn to write properly. Or use a translator
Sass is a compiler and thus there should not be an issue with performance since your final production bundle will include the compiled css and not sass.
No performance issue with Sass, I just like reducing complexity in my projects.
@@EricMurphyxyz I love your work man. Thanks a lot.
Thanks for sharing. Most of the time I use the BEM naming convention for classes in HTML and CSS.
you're gonna grow out of it
@@BusinessWolf1ass cucks be seething over bem enjoyers
@@BusinessWolf1 ......and use Tailwind instead 🤣
nah
Your vim looks the same as vscode or you are using vscode with a extension of vim
is that CSS LSP that gives u selector specificity on hover?
This is VSCode
i just use vanilla css
love grids
I'm not a webdev, but have been tinkering with html and css since the early 2000's. Never used Sass, and I actually didn't know what it was up until last year. I also learned about Tailwind css, which, to be honest, looks absolutely horrible. Seems to go against the spirit of css of separating content from presentation. Have you used it?
If you're just tinkering a bit and not using JS frameworks you might not get why Tailwind is useful, when you write reusable components your frontend is separated into multiple parts and it's not as messy.
Tailiwind has been made with that in mind, you can still use the apply directive to have regular css like functionality but that's not how it's intended to be used
@@heroe1486 Tailwind is useful because is more composable, is one of the first in break separation of concerns in component code, this give you the ability to not leave your component and concentrate all styles, html, and functionality in one single reusable component, also the performance vs others normal aproach like css or scss is abysmal. Kinda make CSS more scalable. But i also not a huge fan, but i understand his pros. I use PandaCSS because it give me everything that tailwindCSS give, but without losing readabilty or having to learn anything new, just write CSS in your component, and also is the more scalable way of all, because it also have typesafe tokens, so if you change something your editor will scream.
You are the issue, you don't know how to use tailwind.
It's great that native css is picking up functionality. Now if only they could add TypeScript support to HTML files.
Maybe someday...one can dream, right? :)
or experiment with strong typing in JS directly
Personally, I would like the properties of @mixin in vanilla css
Talk about postcss, 🤔 i think tailwindcss
You use sass nesting when you use things like ::after, ::before, :hover, :active, :focus, etc. To do these without nesting is a fucking nightmare
Css has nesting out of the box no need for sass my boy
@@nested9301 see my comment is 1 year old, and CSS nesting had just begun then. Only postcss supported it well.
so sass is basically the jquery of css
no. its the javascript of css
Vscode nah you've betrayed the community, just kidding but yeah why would I need SASS and its overhead when I could just easily write this logic in JS which is already a programming language, + vanilla CSS is also capable these days, with more and more features added.
Might be good for people who do styling for a living tho, but that's not my use case, tailwind and vanilla CSS when needed + JS when styling is based on some logic is enough
I see all the soy devs use tailwind so I’ve been looking into that. I will say it is nice that I don’t have to think about what to my name divs anymore. Also nice that the @base thing presets some options to give a consistent look across browsers.
I've been meaning to check out tailwind. The classes approach seems weird to me but I also found a tool that converts it to normal CSS so we'll see...
@@EricMurphyxyz Converting it to normal CSS (I'm assuming what you mean by that is converting the ad hoc utility classes into separate stylesheets with semantic classes) would probably cause you to miss out on one of the big advantages of Tailwind: how light the CSS ends up being. Tailwind output CSS is never a gram over 15 KB for me.
Soy devs are even better than grown up weebos like u.
i find most of these to not be my case. css has nesting, but sass has better nesting. sass has also loops that are better implemented that if I used Javascript. i find myself using almost all quirks that sass use, because it makes my code simpler in really large projects. postcss can emulate many of them but with less support and a few more bugs, nothing crazy but still worth mentioning. Great video though, wish more people used their own postcss config
modern css is so good ....
Its pretty ugly but honestly tailwind is probably the best way to use css. It makes things dead simple. And there are extensions to hide all the clases to make it less busy while coding.
EDIT: I think one of the advantages is that you dont have ti think at all about performance. With tailwind there are no "tricks" to make it faster. Its pretty much as fast as its going to be whether you take performance into account or not. For better and for worse of course but 90% of the times, for the better.
Tailwind is just so so so much better. Semantic class names seem like they should be better in theory, but in practice they always just end up sucking way more ass than the big ugly utility class lists. I suspect most human beings would innately assume that classes like "article-body" and "left-aligned-main-header" etc. are better since they organize styles into logical bins and tuck them away, and also make it easy to not have to re-style similar elements all over again. In reality though, these classes end up typically being non-reusable since there's always one little pesky style that needs to be different between element A and B, and all these semantic class names end up taking up 200 KB.
The only elements that I find ever truly benefit from a standard class are buttons. I always end up setting the padding, the hover color, etc. the same way, so buttons get a semantic class even when I'm using tailwind.
sass is for PWD's
15:15 I think its useless to talk about css performance
I stopped using Sass when they added BLM banner to their website.
Almost all the projects virtue signal. It's not viable imo
ah yes, stopped using the free-to-use software because they support politics you don't. there's a saying that "if hitler himself came back from the grave and did a good Git commit, we should accept it", and I think you should consider that.