Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Working with Tailwind CSS every day for 2 years

themosaad.com

Post reply on HN
Print view View original

131–140 of 215 posts

Re: Working with Tailwind CSS every day for 2 years

#131

Post by davnicwil »

icambron wrote: post #83

A lot of people I respect really like Tailwind, but I just don’t get it. Seems like you end up with walls of classes because you don’t name your compositions, and thus your design system doesn’t actually live anywhere. If you have a standard box in your design system with a certain padding, spacing, font size, and so on, are you really going to write out all its constituent properties every time you use it? How do yo…

I think the usual solution here is just to make your standard box a component, as opposed to using a div with a class. Then if your design system changes, you just change the wall of tailwind classes in that single component file.

Re: Working with Tailwind CSS every day for 2 years

#132

Post by hbn »

pupppet wrote: post #56
hbn wrote: post #55

Earlier quoted context omitted.

It's not a replacement for CSS, it's an extension of it. You shouldn't use Tailwind if you don't already know CSS.

I'd be very surprised if there are many devs with a deep understanding of CSS using Tailwind.

I'll give you an example of one:

Adam Wathan, the creator of Tailwind

Re: Working with Tailwind CSS every day for 2 years

#133

Post by hbn »

waboremo wrote: post #98
hbn wrote: post #50

Earlier quoted context omitted.

I really don't get the "tailwind is for beginners" opinion I see parroted so much. It doesn't enable you to do anything that CSS didn't already do. It's just a different way of writing it. Knowing CSS is a prerequisite to being able to use Tailwind. "Tailwind is for beginners" just sounds to me like "I don't like this thing because I'm too smart for it"

Because Tailwind is often suggested as a way for novices to implement design without having to really learn CSS. Simultaneously, allows people who don't care at all for CSS or design to create something functional. Tailwind does not require knowing CSS. It'll get you around tailwind faster if you do know it, but you do not have to care about what Tailwind is really up to when adding "outline outline-2 p-4 outline-off…

> Because Tailwind is often suggested as a way for novices to implement design without having to really learn CSS

Where are do you so frequently see that being suggested? I would never suggest that and I've never seen anyone say something like that before.

Tailwind is not an alternative to CSS, it's a way of writing CSS.

Re: Working with Tailwind CSS every day for 2 years

#134

Post by dimmke »

nirvdrum wrote: post #90
bluetidepro wrote: post #39

Earlier quoted context omitted.

> It's loved by novices and those who don't know what they're doing, almost exclusively. They claim they know CSS, but will fail after any casual test. This is an incredibly silly take. As a senior frontend dev with almost 20 years of experience and a solid resume, I will take Tailwind over anything else in most cases. Obviously there is always exceptions based on the project needs, but to have such a hard take like…

I've been doing front-end development in some capacity almost as long as you, but it's not my forte. I've looked at Tailwind and I can see its value as a way to quickly prototype, but it also looks to violate the deeply instilled belief I have about semantically named classes. I know front-end development has changed its set of best practices several times now. We went from unobtrusive JS and semantic class names to…

This is so frustrating to read over and over. Tailwind uses PostCSS. You can literally wrap a bunch of utilities inside a semantic class name.

Or, if you're using containers/writing components you can literally do something like this: https://pastebin.com/qkdzGWNT

But that a { could just as easily be "tag"

Personally, I've always found BEM to be tedious and the sort of "roll your own" class names just doesn't scale. This approach scales. This is what we should be moving towards as an industry.

Re: Working with Tailwind CSS every day for 2 years

#135

Post by terminal_d »

icambron wrote: post #83

A lot of people I respect really like Tailwind, but I just don’t get it. Seems like you end up with walls of classes because you don’t name your compositions, and thus your design system doesn’t actually live anywhere. If you have a standard box in your design system with a certain padding, spacing, font size, and so on, are you really going to write out all its constituent properties every time you use it? How do yo…

It is possible to "group" tailwind classes.

See https://gist.github.com/axeldouglas/7f45b2a862401c7b515c138e...

Re: Working with Tailwind CSS every day for 2 years

#136

Post by PainfullyNormal »

esparrohack wrote: post #123

This style comes and goes. Utility classes. Then a framework like bootstrap comes up. Then it’s back to utility classes. I feel like I’m taking crazy pills

> I feel like I’m taking crazy pills

You're not. If you look hard enough, long enough, you'll see this same pattern in every corner of programming. Round and round, never forward.

Re: Working with Tailwind CSS every day for 2 years

#137

Post by hk1337 »

hk1337 wrote: post #57
734129837261 wrote: post #22

I hate Tailwind with the passion of a million suns. It's loved by novices and those who don't know what they're doing, almost exclusively. They claim they know CSS, but will fail after any casual test. The best arguments against it: 1. Spamming utility classes causes horrible git commits, git history, git difference checks; 2. Conflicting utility classes aren't clear, and sometimes the order cannot be trusted; 3. Rep…

What would recommend for some sane CSS/SCSS defaults?

Oh, I guess I cannot edit it anymore.

*EDIT* for the above.

What are some typical defaults that I should start with for things like margin, padding, font size? What sort of items should I be initializing in ::root then overriding later?

Re: Working with Tailwind CSS every day for 2 years

#138

Post by terminal_d »

CapnCrunchie wrote: post #45
pupppet wrote: post #40

Earlier quoted context omitted.

My best argument against it is whatever the learning curve, you're better served just spending that time learning to write CSS instead.

My understanding of CSS has gotten a lot better from using Tailwind.

This has been my experience as well. Tailwind is a good pair of support wheels, but it gets annoying after a while, and is difficult to maintain long-term.

Re: Working with Tailwind CSS every day for 2 years

#139

Post by hk1337 »

Kiro wrote: post #60
734129837261 wrote: post #22

I hate Tailwind with the passion of a million suns. It's loved by novices and those who don't know what they're doing, almost exclusively. They claim they know CSS, but will fail after any casual test. The best arguments against it: 1. Spamming utility classes causes horrible git commits, git history, git difference checks; 2. Conflicting utility classes aren't clear, and sometimes the order cannot be trusted; 3. Rep…

Tailwind is obviously not just loved by novices. I've done CSS since IE6 and I really like Tailwind. Your "best arguments" are not actually problems. If anything git diffs become clearer because you see immediately what was changed without having to jump between files and lines. I wouldn't touch SCSS with a ten foot pole in 2022, especially not for React where literally any CSS-in-JS library is better, and I used to…

Do you favor putting multiple tailwind classes on an element or creating your own CSS classes with an "@apply" and what tailwind specifics you want for that class?

Re: Working with Tailwind CSS every day for 2 years

#140

Post by terminal_d »

hk1337 wrote: post #137
hk1337 wrote: post #57

Earlier quoted context omitted.

What would recommend for some sane CSS/SCSS defaults?

Oh, I guess I cannot edit it anymore. *EDIT* for the above. What are some typical defaults that I should start with for things like margin, padding, font size? What sort of items should I be initializing in ::root then overriding later?

This might be helpful.

https://necolas.github.io/normalize.css/

Design decisions, though, are ultimately up to your taste and judgement.

Post reply on HN