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

Why Tailwind CSS Won

matt-rickard.com

Post reply on HN
Print view View original

171–180 of 559 posts

Re: Why Tailwind CSS Won

#171

Post by randomdigitz »

keyle wrote: post #140

Gray beard's 5c: Tailwind is a farce and a catastrophe. It's as modern as the style parameter is, and it's as reusable as a moving a dirt pile from one corner to the next. You're not learning anything valuable by learning Tailwind. Learn CSS, that will stick with you for the next 20 years. It amuses me when a library is implemented 'with tailwind', which means it's totally useless to the people _not using tailwind_,…

I’ve learned CSS, used Bootstrap, and tried a bunch of other tools. Tailwind ecosystem is the fast approach to building web UIs in my experience. It doesn’t matter if you know CSS or not. Nobody gains if you know CSS per se. People gain when you deliver finished projects. Tailwind helps ship projects faster.

Re: Why Tailwind CSS Won

#172

Post by 9dev »

stefanfisk wrote: post #121
9dev wrote: post #97

Earlier quoted context omitted.

It’s a completely viable solution for certain situations, say, having a .button class. The things mentioned in that twitter thread have nothing to do with that.

I was commenting on "As soon as you have recurring product prices, you’re encouraged to use @apply to group those classes. ". It's certainly technically possible to create a CSS class. But AFAIK the recommendation is loudly and clearly to use components https://tailwindcss.com/docs/reusing-styles#extracting-compo... , and for good reason.

I follow, but even that part of the docs acknowledges the use cases solved by @apply. No denying it’s a powerful gun to shoot your foot with, but it has its merits. Especially in the OPs context of some bespoke e-commerce CMS, which might not even have a frontend pipeline more sophisticated than grunt or something.

Re: Why Tailwind CSS Won

#173

Post by dikei »

mablopoule wrote: post #147
nisegami wrote: post #145

Earlier quoted context omitted.

>You're not learning anything valuable by learning Tailwind. Learn CSS, that will stick with you for the next 20 years. Tailwind maps onto CSS in a very straightforward way. I think you'd have to go out of your way to "learn Tailwind" without also improving your knowledge of CSS.

Except for the whole "Cascading" part. I think I understand tailwind, but like the parent poster I'm really not a fan, because while CSS can be a footgun, it can also be quite clean when you use a sane DOM structure, CSS variables, and well thought out CSS selectors.

> it can also be quite clean when you use a sane DOM structure, CSS variables, and well thought out CSS selectors.

This fall apart pretty quickly as soon as more developers join the project. Keeping consistency between multiple team members is hard without a reference point, which is what a framework like Tailwind provides.

Re: Why Tailwind CSS Won

#174

Post by deliriumchn »

conradfr wrote: post #114
xigoi wrote: post #50

Earlier quoted context omitted.

> class="my-4 mb-sm-5 mb-lg-6" I've seen Perl code that was more readable than this.

If you know the convention it's quite easy. I don't know Tailwind but with Bootstrap it would be m = margin, y = y axis, b = bottom, sm/lg = screen size, 4/5/6 = size

> If you know the convention it's quite easy.

This is exactly the problem. Humans write code for humans, not for tailwind specialists and bots. It should be clear and easy to read unless there is a valid reason for weird code (optimisations, hacks that don't work otherwise etc). Tailwind introduces yet another convention where it is absolutely pointless to do so.

Re: Why Tailwind CSS Won

#175

Post by progx »

PrimeMcFly wrote: post #15
fbnlsr wrote: post #11

I don't get Tailwind. In my book, CSS is here to facilitate the style of multiple webpages by modifying a set of rules, and classes are here to mutualise said rules. With Tailwind, it looks like you design by writing HTML, which is the opposite of what CSS aims at. So if you wish to change your design, you'll have to update multiple templates instead of one CSS rule. Every time I've had to work with Tailwind, it felt…

In a recent thread someone explained Tailwind was best used with component frameworks, and that made it make a lot more sense and I could see the appeal.

I disagree, tried it with a small custom component lib in our company. It was a huge overhead to add options for e.g. a button-component.

You can use Tailwind on top level and it is easy. But as soon as you have complex components with sub-elements, the styling gets really complicated.

It was easier to add component specific classes and define the css within the component. You call then the component with the classname.

Re: Why Tailwind CSS Won

#176

Post by randomdigitz »

mablopoule wrote: post #147
nisegami wrote: post #145

Earlier quoted context omitted.

>You're not learning anything valuable by learning Tailwind. Learn CSS, that will stick with you for the next 20 years. Tailwind maps onto CSS in a very straightforward way. I think you'd have to go out of your way to "learn Tailwind" without also improving your knowledge of CSS.

Except for the whole "Cascading" part. I think I understand tailwind, but like the parent poster I'm really not a fan, because while CSS can be a footgun, it can also be quite clean when you use a sane DOM structure, CSS variables, and well thought out CSS selectors.

Tailwind is a means to an end. If you think writing css is the best way to spend your time, go for it. But I guarantee I can ship things faster using Tailwind.

Re: Why Tailwind CSS Won

#177

Post by throwaway4027 »

winstonewert wrote: post #76
throwaway4027 wrote: post #54

Earlier quoted context omitted.

I agree with you. As a developer I like the separation of style and content. We also gain better readability when the code says " 199 " than a long list of tailwind classes. CSS styles are also more reusable across different web sites. I can to some degree see that you can increase re-usability when using shared React components, but then you just create technical debt for those who want to test other frameworks It s…

Can you explain something about why you prefer the separation of style and content? From my perspective all that it accomplished is making me modify two files (html template and CSS) instead of one.

There are several advantages of separating CSS and code from my point of view.

- I generally dislike inline CSS styles, and the benefits of Tailwind is not enough to overcome that.

- Reusability across systems. At least in mature businesses, they often have CMS systems, different frameworks etc. Using Tailwind kind of encourages everyone to use the same internal React component library.

- Easier to read PR and git logs. Adding a single tailwind class to a component may mark the entire line as changed, and you need to figure out what has changed (including checking the code, because you don't know if that also changed).

- Designers can make changes in CSS without having to learn React.

Re: Why Tailwind CSS Won

#178

Post by nottorp »

randomdigitz wrote: post #171
keyle wrote: post #140

Gray beard's 5c: Tailwind is a farce and a catastrophe. It's as modern as the style parameter is, and it's as reusable as a moving a dirt pile from one corner to the next. You're not learning anything valuable by learning Tailwind. Learn CSS, that will stick with you for the next 20 years. It amuses me when a library is implemented 'with tailwind', which means it's totally useless to the people _not using tailwind_,…

I’ve learned CSS, used Bootstrap, and tried a bunch of other tools. Tailwind ecosystem is the fast approach to building web UIs in my experience. It doesn’t matter if you know CSS or not. Nobody gains if you know CSS per se. People gain when you deliver finished projects. Tailwind helps ship projects faster.

As a user of web sites, this attitude leads to me paying for your fast shipping in electricity for CPU usage, extra money for extra RAM, plus wear and tear on my nerves because you do what your library allows you to do instead of something usable.

Thank you.

Re: Why Tailwind CSS Won

#179

Post by ajanuary »

alex_suzuki wrote: post #125

I always felt slightly dirty after writing a bit of inline CSS (`style=”color: red“`) instead of a proper class, yet at the same time it accomplishes the goal and it was fast. So this is basically Tailwind, right?

One of the selling points that Tailwind pushes that I haven't seen other people mention here is that inline styles are _too_ flexible. You can do `style="color: red"`, but you can also do `style="color: #FE0005"` or `style="color: #FE1111"`.

While tailwind lets you write your styles in the same _location_ as the style attribute, it allows you to restrict what _values_ you can use. You can set up a colour palette so that when you say `class="red"`, it's the shade of red that you (or your designer) picked, and your colleague can't decide to pick a slightly different shade for their component.

Re: Why Tailwind CSS Won

#180

Post by k__ »

progx wrote: post #102

Wordpress, React, many others win too and nobody would say, that these are superior to anything else. Like in WordPress or React you can fiddle with Tailwind too. People like to fiddle. You can make things easy, or fiddle, what did people do? Correct, fiddle. Why you think so many huge overbloated frameworks have soo much success. Fiddle. Fiddle is the key to everything in development. You fiddle hours and hours unti…

"Wordpress, React, many others win too and nobody would say, that these are superior to anything else."

Maybe, they're just superior in a dimension their critics don't care about.

Post reply on HN