PSA: Web browsers only understand pure, unadulterated CSS. All of the fancy tools we use — Bootstrap, Tailwind, Sass, CSS-in-JS libs — produce vanilla CSS for the browser.
If you want to be productive with these tools, you *need* to understand how CSS works.
If you want to be productive with these tools, you *need* to understand how CSS works.
I think a lot of developers think that these tools are shortcuts, as though you can learn them instead of learning CSS. But that's not actually true.
These tools are meant to *amplify* your CSS skills, not replace them!
These tools are meant to *amplify* your CSS skills, not replace them!
Here's one big reason why: when things go awry, and you need to debug an interface that isn't right, the browser devtools will show you the CSS that has been applied. Not the Material UI components / Tailwind classes.
Even if you don't *write* CSS, you still need to *debug* CSS.
Even if you don't *write* CSS, you still need to *debug* CSS.
There are quirks and mechanisms in CSS that will affect you no matter which tool you use. Margins still collapse. Stacking contexts and scroll containers and containing blocks are all still present, no matter how many layers of abstraction they're buried under.
To be clear, I'm not anti-tool. I've used and loved lots of different CSS tools! But like I said, they amplify my CSS skills. They don't replace them.
Think of it like a fancy mechanical keyboard; it can enhance the typing experience, but you still need to learn how to type!
Think of it like a fancy mechanical keyboard; it can enhance the typing experience, but you still need to learn how to type!
• • •
Missing some Tweet in this thread? You can try to
force a refresh
