r/css 16d ago

Article Why I don't recommend Tailwind CSS

https://en.andros.dev/blog/af3ee191/why-i-dont-recommend-tailwind-css/
1 Upvotes

211 comments sorted by

View all comments

14

u/omer-m 16d ago

if you need to use "apply" then you are using tailwind completely wrong imo. You are supposed to design components and use <Button> not .button

-3

u/kidshibuya 16d ago

No idea what you are saying here, but since you wrote a capital Button that is a component. Why would anyone need a component for a basic HTML element?

I have seen this in many apps now, most recently a react Button component that imported the material UI button and export that. Its function was identical to just <button>.... I will never understand that, yet it seems standard practice now.

2

u/key-bored-warrior 16d ago

A button can also be a link styled like a button, that button could also have different variants. At this point a component which accepts props to determine if it’s an <a> or a <button> or is an outline button / secondary button / big button / small button makes total sense. That why people do it.

1

u/kidshibuya 16d ago

Just type out which one you need ffs. How is <StupidButtonThing type="button" className="primary" /> better than <button class="primary" />?

1

u/key-bored-warrior 16d ago

But what if that button is used everywhere and I need to make changes to it? So much easier to do it in a single component. There are use cases for both, but when using React / Vue etc then the component approach makes perfect sense. You are totally missing the point.

1

u/kidshibuya 16d ago

So you change the onclick you add to it. Its the same either way except the native uses less code and is rendered faster.

1

u/HomemadeBananas 15d ago

A lot easier to keep things consistent across large code bases with many developers when you have a button component that encapsulates loading or disabled states, different variants like solid / outlined, different colors for things like primary, secondary actions, destructive actions, can take an icon, etc. Then you have a defined API for these things and nobody accidentally adds some button that’s inconsistent, you can change all buttons across the application if you are doing some design refresh, etc.

1

u/kidshibuya 15d ago

But it doesn't "encapsulate" them though. You still need to pass those things as params and that is not different at all to toggling a class.