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

Play with TailwindCSS in the Browser

play.tailwindcss.com

Post reply on HN
Print view View original

81–90 of 300 posts

Re: Play with TailwindCSS in the Browser

#81

Post by andiareso »

the_other wrote: post #72
onion2k wrote: post #40

Earlier quoted context omitted.

It’s like you have to learn every raw CSS selector, and then also learned how it’s represented in Tailwind, and then scatter that all over your markup. That's exactly what it is. But... you have to do that regardless of what you use for CSS layout. If you're not using Tailwind (or something like it) then you're going to end up creating classes using the raw CSS, and then naming them yourself, and then having to remem…

> If you're not using Tailwind (or something like it) then you're going to end up creating classes using the raw CSS, and then naming them yourself, and then having to remember what you called them. This is true. But if we better taught the cascade and promoted the idea of global styles rather than pretending it's a problem then more people would be better at this and the problems would gently recede. We (the high-en…

But this isn't much different than:

extends

I'd argue you have less markup to write overall if you are modularizing component logic/styling

Re: Play with TailwindCSS in the Browser

#82

Post by jakelazaroff »

pocketsand wrote: post #36
peterkelly wrote: post #32

Earlier quoted context omitted.

Any time spent learning tailwind is much better invested in learning plain CSS, since it's basically just syntactic sugar for style attributes. And learning CSS itself will be useful for many years to come, well beyond the lifetime of any given framework. The browser's built-in CSS support is the framework, I don't understand why people try to build things like this on top of it unless they're adding real value.

It's really not just syntatic sugar for style. It's a design system as well as a set of utility classes. Consider the difference between Gray text and Gray text In the former, you can't just redefine what gray means. You've hard set it to a value you need to keep track of and keep consistent. On the right, you can configure what "700" means, switch between a cool gray or a blue gray, etc.

So use a custom property instead (don’t use inline styles tho):

    Gray text
Or use Sass or something. This problem has been solved for like 15 years.

Re: Play with TailwindCSS in the Browser

#83

Post by megaman821 »

stefanfisk wrote: post #69
f3b5 wrote: post #50

Earlier quoted context omitted.

Tailwind is a thin wrapper for the people scared of CSS. I use Tailwind at work, and it opened my mind to the benefits of an "ugly" html layout with inline styling. However, being there now, I think that inline CSS offers the better "Tailwind experience" - CSS requires no setup, and learning it properly is a good investment for the future when Tailwind, like so many other frameworks, will inevitably end up on the fro…

how would you use media queries or pseudo selectors in inline CSS?

I was about to say, if anything it shows there is demand for the style tag to handle pseudo selectors. Setting up some CSS variables on the root and accessing them through the style tags would provide most of the benefit of Tailwind.

Re: Play with TailwindCSS in the Browser

#84

Post by wiredearp »

anon1378 wrote: post #62

I cannot believe how anyone can look at the following code below and think that it's maintainable, just for an input box with additional styles for states: How is mushing every single style into a class attribute supposed to help with readability and maintainability? Even if you use `@apply` to reduce the clutter, you are basically venturing back into "vanilla" CSS territory, and which their docs expressly said to av…

Tailwind is a multi million dollar business [1] and I've found that the only credible explanation is they they simply hire people to leave positive comments in popular forums. The backenders who bite on it will eventually despair and "upgrade" to Tailwind UI which is a paid product. If there are real frontenders who buy into this, they are from a segment that have not followed CSS for the last ten years while being young enough, not to remember HTML 3.2 which appears remarkably similar to Tailwind and indeed gave birth to CSS; which if it had been inventented today would be hailed it as a giant leap forward. Well, CSS is still being invented today, but since the latest tech maps badly to presentational classes [2] they will never know about it. I use Tailwind every day and it's a disaster.

[1] https://adamwathan.me/tailwindcss-from-side-project-byproduc... [2] https://web.dev/state-of-css-2022/

Re: Play with TailwindCSS in the Browser

#85

Post by andiareso »

samtimalsina wrote: post #26

I was in the camp "this-is-bullshit" until recently. It felt backwards. We recently switched to Tailwind for one of our projects, and Tailwind was a delight to use, especially with its VS Code extension. Code readability is surprisingly not that big of a deal because we use components. Of course if you are looking at the raw HTML in chrome tools, it can get disorienting. For folks that are worried about having to lea…

I'm in the same boat. I laughed the first time I saw it on Hacker News and thought it was the dumbest replacement to just using style tags.

Boy I felt like an idiot when I started using it.

I spend way less time going from idea in my head to actual concept now.

Foolish boy.

Re: Play with TailwindCSS in the Browser

#86

Post by divan »

rco8786 wrote: post #16

Im sorry but I don’t understand how anyone can look at that and think it’s a good way to build UIs. I’m almost certainly in the wrong, considering how popular this library seems to be getting, but holy heck that looks like a tedious mess to work with. It’s like you have to learn every raw CSS selector, and then also learned how it’s represented in Tailwind, and then scatter that all over your markup.

Building UIs with typesetting engine and bunch of styling classes is fundamentally wrong. CSS is broken by definition. Tailwind makes it a bit less broken on practice.

Re: Play with TailwindCSS in the Browser

#87

Post by andiareso »

kanonieer wrote: post #78
halotrope wrote: post #71

There is only two kinds of people. The ones that don't like Tailwind and the ones that have used it. I know it is conceptually "wrong" and a bunch of well crafted CSS classes would be more elegant. In the end it works, works really well and makes collaboration dead simple. Commonly used groups of classes can either be aliased by @apply or used in a (react) component. I used CSS way before Tailwind was a thing and in…

> There is only two kinds of people. The ones that don't like Tailwind and the ones that have used it. I know a lot of people who have tried but didn't like Tailwind. I think most people like it on a greenfield project, but that number drops off when they go back to a Tailwind project after some time.

Meh everyone ultimately has a personal preference so it's a bit hyperbole to say that everyone that hasn't used it would like it.

Just like everything, it would depend on the project, team, and individual.

I personally was against it until I used it.

Re: Play with TailwindCSS in the Browser

#88

Post by mritchie712 »

65 wrote: post #80

I used to be a Tailwind hater. I couldn't fathom why anyone would ever use it. And then I used it. It seriously makes CSS significantly easier to maintain, dramatically reduces your CSS build size, and is really good for teams if you're trying to use consistent CSS throughout your UIs. You also don't need to go back and forth between CSS file and HTML file. If you're on the fence, try it out. I think it's the future…

for haters, color management is a good starting example of why it's good.

https://tailwindcss.com/docs/customizing-colors

Re: Play with TailwindCSS in the Browser

#89

Post by f3b5 »

stefanfisk wrote: post #69
f3b5 wrote: post #50

Earlier quoted context omitted.

Tailwind is a thin wrapper for the people scared of CSS. I use Tailwind at work, and it opened my mind to the benefits of an "ugly" html layout with inline styling. However, being there now, I think that inline CSS offers the better "Tailwind experience" - CSS requires no setup, and learning it properly is a good investment for the future when Tailwind, like so many other frameworks, will inevitably end up on the fro…

how would you use media queries or pseudo selectors in inline CSS?

Good point, I don't know of any way of doing that inline. So that's definitely a good convenience function in Tailwind!

My lived approach to inline vs. not-inline is: why not both? Inline is great for prototyping, and for edge cases, like specific margins for wrapper divs. Where CSS classes really shine is when it comes to mature / often used components.

Re: Play with TailwindCSS in the Browser

#90

Post by rco8786 »

seabea wrote: post #31
rco8786 wrote: post #16

Im sorry but I don’t understand how anyone can look at that and think it’s a good way to build UIs. I’m almost certainly in the wrong, considering how popular this library seems to be getting, but holy heck that looks like a tedious mess to work with. It’s like you have to learn every raw CSS selector, and then also learned how it’s represented in Tailwind, and then scatter that all over your markup.

I'm really tired of needing to wade through these sort of comments. This is not a unique criticism. If you don't don't get it, either try it out or move on. These comments add no value to the conversation.

My apologies for having a discussion on a discussion forum
Post reply on HN