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

91–100 of 215 posts

Re: Working with Tailwind CSS every day for 2 years

#91

Post by dmitriid »

atsjie wrote: post #84
dmitriid wrote: post #64

Earlier quoted context omitted.

It gives you a consistent design system with sensible defaults and easy-to-use (and rather memorable or easy to deduce) utility classes. Unlike the yet-another umpteenth bespoke `.card-header__buttons .card-header__button--secondary` that no one can remember and create an umpteenth+1 Tailwind works great when your site/app is a collection of components

`.card-header__buttons` that example makes no sense unless you use global CSS/SASS, which very few projects do anymore. Component CSS/SCSS or CSS-in-JS are very common which resolve this scoping problem. So why bother with a DSL like Tailwind over Component CSS/SCSS for example?

How do you enforce consistency in CSS-in-JS? Paddings, margins, sizes, colors?

Everywhere I've seen CSS-in-JS used, everywhere it's people busy writing bespoke styles in every file.

Re: Working with Tailwind CSS every day for 2 years

#92

Post by rndmize »

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…

> 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.

As a long term front-end dev who likes tailwind, I find this fairly offensive. Your second and third points sound like problems with CSS in general.

> Vanilla CSS using `:root` declaration, a fixed base size (using `rem` and `em`), CSS variables and `calc()` are SO powerful.

If I'm using tailwind on a project, I don't want more power. I want less. I want simple constraints that give me solid basic styling without constant adjustment. The adjustments I _do_ want to make should be easy. The options available should be good options, not all options. I don't feel like fussing with box-shadow for the umpteenth time to get something that looks nice, or poking at my margins or padding or gap until it works with the rest of the page. I don't want to come up with a grid system again, or a color set, or a bunch of variables to extract these from the custom classes so they see proper reuse and are easily available; I want them already done.

Re: Working with Tailwind CSS every day for 2 years

#93

Post by kaba0 »

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…

I think you miss that using components or tailwind is not exclusive. If you have a reusable button than you are supposed to make it a reusable component and have it styled with tailwind at one place only. So your concern doesn’t apply at all.

Re: Working with Tailwind CSS every day for 2 years

#95

Post by [deleted] »

atsjie wrote: post #84
dmitriid wrote: post #64

Earlier quoted context omitted.

It gives you a consistent design system with sensible defaults and easy-to-use (and rather memorable or easy to deduce) utility classes. Unlike the yet-another umpteenth bespoke `.card-header__buttons .card-header__button--secondary` that no one can remember and create an umpteenth+1 Tailwind works great when your site/app is a collection of components

`.card-header__buttons` that example makes no sense unless you use global CSS/SASS, which very few projects do anymore. Component CSS/SCSS or CSS-in-JS are very common which resolve this scoping problem. So why bother with a DSL like Tailwind over Component CSS/SCSS for example?

[deleted]

Re: Working with Tailwind CSS every day for 2 years

#97

Post by waboremo »

9dev wrote: post #89
kypro wrote: post #74

Earlier quoted context omitted.

Variables would be the obvious answer here. If you're applying `p-4` to all your component classes you're only marginally improving on applying `padding: 8px` on all of your component styles. Both are terrible solutions even if one is slightly better than the other. I generally agree with OP. Tailwind is horrible for larger projects and I have no idea why it's so well liked. The utility class approach is bad, and nam…

But p-4 is a variable: you can set the actual padding applied in the configuration file! It doesn’t have to mean 8px, but rather „standard amount of padding“. If you want to use „small amount of padding later on, you’ll use p-2 - whatever that means in your app. That solves the exact problem you and OP complain about, in a neat, configurable, safely replaceable way. Tailwind allows you to separate design intent from…

Vanilla CSS also allows this, without any real effort either. Tailwind's power is in its defaults, as soon as you want to start tinkering, you were much better suited sticking to vanilla CSS.

Re: Working with Tailwind CSS every day for 2 years

#98

Post by waboremo »

hbn wrote: post #50
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 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-offset-2". This is a major reason why people pick it up in the first place, to ignore CSS as much as possible.

Re: Working with Tailwind CSS every day for 2 years

#99

Post by hackingforfun »

deliriumchn wrote: post #9

I'll be honest here, after working with tailwind for 7 months I really hate this piece of tech and really regret picking this company. I thought it wouldn't be a big deal but after seeing unnecessary long walls of class names I'm really tired. Anything other than basic styling is an absolute pain with tailwind and I don't understand why /my company specifically/ can't just use typestyle/styled-components/css modules…

If you like styled components, you can use this in a similar way, applying tailwind classes instead of CSS: https://www.npmjs.com/package/tailwind-styled-components

I like that it helps reduce the walls of class names since the classes are on their own lines in the tailwind styled component.

Re: Working with Tailwind CSS every day for 2 years

#100

Post by jmull »

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.

Well... you can bumble through using tailwind without understanding it much in the same way you can bumble through using CSS without understanding it much.

There are plenty of people bumbling through with both.

But understanding the CSS is needed to use it reasonably well.

Post reply on HN