DEV Community

Discussion on: Create a Responsive Navbar using React and Tailwind

 
mapleleaf profile image
MapleLeaf

Ah, so those points were in reference to using tailwind in css with @apply. My first comment was actually recommending not to do that for various reasons 😂

I agree that using Tailwind in CSS files with @apply is not much better than using regular CSS; if you're doing it that way, you may as well not use Tailwind.

Using tailwind in html jsx or tsx, it horribly reduces readability

I feel like people are better off getting used to the reduced aesthetic cleanliness, there are mountains of benefits when one does. I've read so many testimonials of "at first it looked horrifying, but after using it, I love it!", including from myself 😊

and in the docs tells you if you don't like it use apply to solve the problem it creates.

Assuming you mean this section of the docs, it says to use this feature to reduce repetition, not to make your HTML cleaner. Visual HTML cleanliness is a complete non-goal with tailwind. That's just something people co-opted when they saw @apply as a "solution" to Tailwind looking weird and unusual.

This part of the docs specifically says not to rely on class names to extract components.

If scss supported something similar, tailwind would be in trouble as tailwind would lose any benefit it can provide inside css.

To be fair, SCSS already has features like parametric mixins and functions that let you mimic what @apply can do, so Tailwind is already "in trouble" in that sense. But generally? Nah. Even then, I personally haven't had a use for Sass in ages, even before I started using Tailwind.