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

Unpopular Opinion: Bootstrap is a better front-end framework than Tailwind

news.ycombinator.com

Post reply on HN
Print view View original

11–20 of 39 posts

Re: Unpopular Opinion: Bootstrap is a better front-end framework than Tailwind

#11

Post by d1sxeyes »

stephenr wrote: post #2

> bg-sky-500 hover:bg-sky-600 active:bg-sky-700 text-white px-4 py-2 rounded-lg What fresh fucking hell is this? I can't say I've had the (mis)fortune of being forced to work with Tailwind (I've seen the name enough to know it's something vaguely "CSS framework"-adjacent though). Seriously, though what kind of crack induced nightmare state was required for someone to think up such an abomination, implement it, and th…

Once you learn how to read it, it's actually pretty clear.

This element has a small amount of x and y padding that is suitable for (for example) keeping text away from the edge of the container. The text is white. The corners of this are rounded.

The background is the default intensity 'sky' colour, which darkens slightly on hover and darkens further when it's active.

You can take this from 77 characters to 189 like this:

    .button {
      background-color: #0ea5e9;
      color: white;
      padding: 0.5rem 1rem;
      border-radius: 0.5rem;
    }

    .button:hover {
      background-color: #0284c7;
    }

    .button:active {
      background-color: #0369a1;
    }
Tailwind simplifies consistency, and frankly is pretty readable. It's not like Button is exactly the pinnacle of human clarity and simplicity in the first place.

Of course there are other ways to do it, but this faux outrage demonstrates not that this is some 'fresh fucking hell' or some 'crack induced nightmare', but rather that you simply don't get it.

Re: Unpopular Opinion: Bootstrap is a better front-end framework than Tailwind

#12

Post by sjoedev »

I wouldn’t put them in the same category. Bootstrap has a much stronger opinion about how you write and structure CSS, while Tailwind is a framework for building a style system and writing arbitrary CSS that conforms to it. In practice, Tailwind is actually much closer to writing vanilla CSS. It does come with a widely used default (and very good, IMO) style system, but you ultimately apply arbitrary CSS rules just like vanilla.

Tailwind is certainly divisive. It’s better suited to component-based frameworks than templates or plain HTML, so a person’s background likely contributes to how they perceive it. Personally, I’ve worked a lot with vanilla CSS, opinionated libraries like Bootstrap, and Tailwind, and opinionated libraries are the only one I have no desire to use again. I generally want Tailwind in component-based projects and vanilla CSS in template-based projects.

At the end of the day, pick what you like and use it. They all get the job done.

Re: Unpopular Opinion: Bootstrap is a better front-end framework than Tailwind

#14

Post by twelvedogs »

rozenmd wrote: post #6

Sure Bootstrap is better, for you . Your postscript explains why: using the same "btn-primary" as every other user of the framework hints that you're not building something with its own visual identity. For the rest of us, we throw that "bg-sky-500 hover:bg-sky-600 active:bg-sky-700 text-white px-4 py-2 rounded-lg" (or whatever color and shape matches our brand) into a component with a variant=primary property and ca…

oof, that looks like absolute trash. i don't get why you want to use something less readable than css but to each their own i guess

Re: Unpopular Opinion: Bootstrap is a better front-end framework than Tailwind

#17

Post by stephenr »

d1sxeyes wrote: post #11
stephenr wrote: post #2

> bg-sky-500 hover:bg-sky-600 active:bg-sky-700 text-white px-4 py-2 rounded-lg What fresh fucking hell is this? I can't say I've had the (mis)fortune of being forced to work with Tailwind (I've seen the name enough to know it's something vaguely "CSS framework"-adjacent though). Seriously, though what kind of crack induced nightmare state was required for someone to think up such an abomination, implement it, and th…

Once you learn how to read it, it's actually pretty clear. This element has a small amount of x and y padding that is suitable for (for example) keeping text away from the edge of the container. The text is white. The corners of this are rounded. The background is the default intensity 'sky' colour, which darkens slightly on hover and darkens further when it's active. You can take this from 77 characters to 189 like…

I didn't say I can't read it. I asked who thought it was a good fucking idea. I guess you've answered that implicitly.

Embedding every style directly into the style attribute is also readable, and as a side benefit it doesn't need a build step just to make your styles actually work.

I can now see exactly why OP made this post. If a client told me they don't want to use something akin to bootstrap or any other sane css library, and that instead I will need to ensure that every element has every manner of css states expressed as a faux class, I wouldn't even stop to make a coffee before telling them how far they can jump.

This sounds perfect for front end “developers" who struggle even with css, and want any reason possible to pad out their billable/working hours doing nothing productive.

Oh what's that, you want to change the style of standard button everywhere in the codebase?

No of course we can't just update a single css file you silly goose.

I feel like half the bad problems in web development are because JavaScript developers saw that j2ee guys had ant and whatnot, and said "hey what if we started inventing reasons to have a build step"?

> button class="button"

The thing is, that is more readable for a sane code base. If I can glance and know it's using the correct standard button class, it means I don't need to memorise the fucking pixel sizes and states of button paddings.

I get it alright. It's a solution looking for a problem that doesn't exist, and instead found a crowd of "developers" looking for anything shiny to pad their resume and keep themselves looking busy.

Re: Unpopular Opinion: Bootstrap is a better front-end framework than Tailwind

#18

Post by d1sxeyes »

stephenr wrote: post #17
d1sxeyes wrote: post #11

Earlier quoted context omitted.

Once you learn how to read it, it's actually pretty clear. This element has a small amount of x and y padding that is suitable for (for example) keeping text away from the edge of the container. The text is white. The corners of this are rounded. The background is the default intensity 'sky' colour, which darkens slightly on hover and darkens further when it's active. You can take this from 77 characters to 189 like…

I didn't say I can't read it. I asked who thought it was a good fucking idea. I guess you've answered that implicitly. Embedding every style directly into the style attribute is also readable , and as a side benefit it doesn't need a build step just to make your styles actually work. I can now see exactly why OP made this post. If a client told me they don't want to use something akin to bootstrap or any other sane c…

Clearly you’ve made your mind up so I won’t push harder, except one point:

> Oh what's that, you want to change the style of standard button everywhere in the codebase?

Tailwind excels when you are using component based frameworks. This change should be at least as simple as updating main.css, except it’s in Button.tsx

Re: Unpopular Opinion: Bootstrap is a better front-end framework than Tailwind

#19

Post by stephenr »

d1sxeyes wrote: post #18
stephenr wrote: post #17

Earlier quoted context omitted.

I didn't say I can't read it. I asked who thought it was a good fucking idea. I guess you've answered that implicitly. Embedding every style directly into the style attribute is also readable , and as a side benefit it doesn't need a build step just to make your styles actually work. I can now see exactly why OP made this post. If a client told me they don't want to use something akin to bootstrap or any other sane c…

Clearly you’ve made your mind up so I won’t push harder, except one point: > Oh what's that, you want to change the style of standard button everywhere in the codebase? Tailwind excels when you are using component based frameworks. This change should be at least as simple as updating main.css, except it’s in Button.tsx

Why am I not surprised this rube Goldberg style machine seems like a rational thing to people who write xml to generate JavaScript to generate html.

Re: Unpopular Opinion: Bootstrap is a better front-end framework than Tailwind

#20

Post by stephenr »

rozenmd wrote: post #6

Sure Bootstrap is better, for you . Your postscript explains why: using the same "btn-primary" as every other user of the framework hints that you're not building something with its own visual identity. For the rest of us, we throw that "bg-sky-500 hover:bg-sky-600 active:bg-sky-700 text-white px-4 py-2 rounded-lg" (or whatever color and shape matches our brand) into a component with a variant=primary property and ca…

> Your postscript explains why: using the same "btn-primary" as every other user of the framework hints that you're not building something with its own visual identity.

You know that bootstrap is trivial to customise right?

It turns out identifying primary and secondary buttons is a pretty standard thing in any kind of UI that has... buttons.

Post reply on HN