[ComiCSS] Benefits of Tailwind
-
Genuine question : what's wrong with modern vanilla CSS3 ?
Maybe it's because I've used css2 I don't see the point of css frameworks.
-
Having never used it before, is it that bad?
-
Having never used it before, is it that bad?
yea it's redundant as hell if not combined with UI libraries that extend it like shadcn / daisyui
-
Genuine question : what's wrong with modern vanilla CSS3 ?
Maybe it's because I've used css2 I don't see the point of css frameworks.
I was very much against frameworks initially: tailwind, bootstrap etc. However, when I started really building sites & apps using components, I found tailwind made my life a lot easier, so I could easily see and change styling while writing code/html, and it would only affect that component.
Beforehand, I was trying to come up with names for CSS classes all the time, and then I'd change one thing, and fuck up styling on a diff page.
-
Genuine question : what's wrong with modern vanilla CSS3 ?
Maybe it's because I've used css2 I don't see the point of css frameworks.
Tailwind sounds cooler than CSS, which, I presume, would be important when you're applying at a startup.
-
Having never used it before, is it that bad?
I've not used it in anger but the principle just seems like inline-styles with extra steps. However I've also had to change something in a large project that had a lot of dedicated classes with specific and shared styles and trying to sort that out without breaking stuff was a massive pain.
-
Tailwind is like going back to in-line styles. If you add font tags you are back in the 2000’s
-
Genuine question : what's wrong with modern vanilla CSS3 ?
Maybe it's because I've used css2 I don't see the point of css frameworks.
It helps to avoid the specificity problem. You don’t have to manage a complicated class system, you just set styles directly on the elements. Yes this is pretty much what everyone agreed in the past was the worst thing to do but that was before things like CSS variables existed (which Tailwind uses excessively) that lets you control details like color and fonts from a single point. So you don’t have to go through every component to change the brand color.
At work we don’t use Tailwind often but in our React apps we mostly use Theme-UI which lets us write regular CSS on each element in a nice JSON format instead of the class name hell that is Tailwind. This is my preferred way.
-
Having never used it before, is it that bad?
At first it seems nice...I played with it for a few hours in an established project and didn't mind. But the I thought about using it from scratch and I'm just baffled anyone does. It's like if CSS was slightly more abbreviated but you couldn't use classes so every style has to be specified on every component.
-
I was very much against frameworks initially: tailwind, bootstrap etc. However, when I started really building sites & apps using components, I found tailwind made my life a lot easier, so I could easily see and change styling while writing code/html, and it would only affect that component.
Beforehand, I was trying to come up with names for CSS classes all the time, and then I'd change one thing, and fuck up styling on a diff page.
Honestly love tailwind. Once you get used to all the names/abbreviations and how they work with sizes and states etc. it's much easier to see what's happening when eyeballing code.
Makes reviewing and bug fixing easier too.
I get that early on it feels annoying. I recall disliking it the first time I learnt it, but then when I went back to regular css and classes I really missed it.
-
Having never used it before, is it that bad?
No, it is not that bad. It's actually very nice.
It affords a lot of consistency, is relatively easy to understand (once you're familiar with the convention), and theming allows you to modify all the colors and sizing in one file rather than modifying a lot of CSS
I think the worst that can be said about it is that it is unnecessary, but I cannot see a true downside to using it besides personal preference. It gets the job done efficiently and correctly and that's what's important at the end of the day
-
Ngl I love tailwind, I've been through so many different css paradigms
- separate css files: why did we ever do this, if you've ever used kendo's css stuff you'll understand how unfathomable hundreds of thousands of lines of css with complex rules is. Identifying all the things that affect a single component is the work of dozens of minutes at minimum, sometimes hours, you have to understand every nook and cranny of the css spec.
- inline styles: fine, but verbose and requires object spreading, harder to compose, theming is tough and requires discipline to be consistent in your theme conventions, almost impossible to also theme imported library components
- module.css with imported classes: my go to outside of tailwind
- scss: I actually really like scss but it exacerbates the complexity and mystery of css, great for small projects but terrible as projects bloat
- bootstrap: basically just worse tailwind, providing only components and colors
That's all I can think of right now, but tailwind is my preferred way to style a new project, I love how easy theming and style consistency is
-
Tailwind is for people that don't know how to use CSS properly. There, I said it.
-
At first it seems nice...I played with it for a few hours in an established project and didn't mind. But the I thought about using it from scratch and I'm just baffled anyone does. It's like if CSS was slightly more abbreviated but you couldn't use classes so every style has to be specified on every component.
You can still use classes if you want to...
-
A very colorblind chart
-
At first it seems nice...I played with it for a few hours in an established project and didn't mind. But the I thought about using it from scratch and I'm just baffled anyone does. It's like if CSS was slightly more abbreviated but you couldn't use classes so every style has to be specified on every component.
wrote on last edited by [email protected]A lot of ui frameworks are based on tailwind and allow you to customize the components with more tailwind. It's really a win because:
- it's not "just inline classes", it's a design system (spacing, colors, breakpoints etc are well structured and not random)
- it is way less verbose than vanilla css and easier to remember
-
It helps to avoid the specificity problem. You don’t have to manage a complicated class system, you just set styles directly on the elements. Yes this is pretty much what everyone agreed in the past was the worst thing to do but that was before things like CSS variables existed (which Tailwind uses excessively) that lets you control details like color and fonts from a single point. So you don’t have to go through every component to change the brand color.
At work we don’t use Tailwind often but in our React apps we mostly use Theme-UI which lets us write regular CSS on each element in a nice JSON format instead of the class name hell that is Tailwind. This is my preferred way.
This is very informative. I avoided Tailwind for the reason you mentioned, but look closer now that I know the difference.
-
This is very informative. I avoided Tailwind for the reason you mentioned, but look closer now that I know the difference.
I think it's especially great for smaller apps/sites or prototyping. Setup is quick if you're already comfortable with CLI tools and configs. Or if you just want to get started immediately with no setup, just add a script into your site and when it needs to go into production later you can still do the setup process for a robust build.
-
You can still use classes if you want to...
Yes but it's also expressly discouraged in the documentation so...
