Live data from Hacker News

Building React and Vue Support for Tailwind UI

blog.tailwindcss.com

11–20 of 122 posts

Re: Building React and Vue Support for Tailwind UI

#11
post #4

Or just use something like Chakra UI, which is like Tailwind CSS but based on styled system and built with Typescript for React from the beginning and has a nice set of basic components. I even built something like Tailwind UI but for Chakra (link is in my bio if you want to check it out)

I think you missed the point as an opportunity to pitch your project.

Re: Building React and Vue Support for Tailwind UI

#12
post #9

Tailwind and Tailwind UI are really great. Tailwind UI as a series of blueprints is exactly what I'm looking for and I love how often they're updating and adding new blueprints to their list of components. This part from the blog post kind of confused me a bit, though. "The promise of Tailwind UI is that it's just a code snippet" Am I the only one who never looks at the code snippets/tab for Tailwind UI, and instead…

I’m not sure I get the difference between looking at the source vs inspecting it? In any case, they’re not expecting you to outright copy them (though you can if you want), they’re saying that the code snippet has everything you need just by copying it.

Re: Building React and Vue Support for Tailwind UI

#13
post #12
post #9

Tailwind and Tailwind UI are really great. Tailwind UI as a series of blueprints is exactly what I'm looking for and I love how often they're updating and adding new blueprints to their list of components. This part from the blog post kind of confused me a bit, though. "The promise of Tailwind UI is that it's just a code snippet" Am I the only one who never looks at the code snippets/tab for Tailwind UI, and instead…

I’m not sure I get the difference between looking at the source vs inspecting it? In any case, they’re not expecting you to outright copy them (though you can if you want), they’re saying that the code snippet has everything you need just by copying it.

I guess for me I have trouble visualizing all of the elements and classes just by looking at the code snippets. Looking at them in the DOM allows me to see them in context, and I find to be easier to use than looking at the underlying code snippet.

Re: Building React and Vue Support for Tailwind UI

#14
post #9

Tailwind and Tailwind UI are really great. Tailwind UI as a series of blueprints is exactly what I'm looking for and I love how often they're updating and adding new blueprints to their list of components. This part from the blog post kind of confused me a bit, though. "The promise of Tailwind UI is that it's just a code snippet" Am I the only one who never looks at the code snippets/tab for Tailwind UI, and instead…

Agreed. One reason I find is that I generally use the componentized examples and when put together they lack consistency. Maybe if you lean toward the full page examples it could be used "as is".

Re: Building React and Vue Support for Tailwind UI

#15
post #9

Tailwind and Tailwind UI are really great. Tailwind UI as a series of blueprints is exactly what I'm looking for and I love how often they're updating and adding new blueprints to their list of components. This part from the blog post kind of confused me a bit, though. "The promise of Tailwind UI is that it's just a code snippet" Am I the only one who never looks at the code snippets/tab for Tailwind UI, and instead…

I almost always copy + paste them, but then start tweaking them in my app. It's easier to just start fresh then change after in my app than trying to do things in the console.

Re: Building React and Vue Support for Tailwind UI

#16
Ah I'm not a huge fan of this:

    
I'd prefer it to be like this:

    
I did some experimenting (I'm the owner of `react-tailwind`, please reach out if you want it!) and it's definitely possible to do that; but it does imply components are purely visual, which I'm not sure it's the way they want to go. It's also not possible to use the colon like `md:...`, but you can do `md="..."` instead, which is a good approximation IMHO

Re: Building React and Vue Support for Tailwind UI

#17

Ah I'm not a huge fan of this: I'd prefer it to be like this: I did some experimenting (I'm the owner of `react-tailwind`, please reach out if you want it!) and it's definitely possible to do that; but it does imply components are purely visual, which I'm not sure it's the way they want to go. It's also not possible to use the colon like `md:...`, but you can do `md="..."` instead, which is a good approximation IMHO

A big issue I see with this is that having custom classes (the whole extensibility point), at least in TypeScript (without re-declaring them).

Re: Building React and Vue Support for Tailwind UI

#18
post #4

Or just use something like Chakra UI, which is like Tailwind CSS but based on styled system and built with Typescript for React from the beginning and has a nice set of basic components. I even built something like Tailwind UI but for Chakra (link is in my bio if you want to check it out)

“If we catered to React developers, we'd be making it harder to use for the 70% of people not using React.”

Third paragraph of the article

Re: Building React and Vue Support for Tailwind UI

#19
post #4

Or just use something like Chakra UI, which is like Tailwind CSS but based on styled system and built with Typescript for React from the beginning and has a nice set of basic components. I even built something like Tailwind UI but for Chakra (link is in my bio if you want to check it out)

And then you have JSS, no restrictions to the available design tokens, no postcss plugin support and your "css bundle" increases since you don't reuse tokens but styles are generated.

Those things alone are reason for never using Chakra for anything serious as these are actual reasons your product/saas/whatever is at a higher risk of failing.

And that's just apart from the fact that the components are not allowing easy overriding, theming is a mess (especially if you want Typescript support again for your custom variants) and it's sometimes buggy with the way DOM events are handled (the checkbox being the biggest offender). At some point the frontend also randomly crashed for me because of the Popover component and it's usage of Popper.js

Re: Building React and Vue Support for Tailwind UI

#20
post #4

Or just use something like Chakra UI, which is like Tailwind CSS but based on styled system and built with Typescript for React from the beginning and has a nice set of basic components. I even built something like Tailwind UI but for Chakra (link is in my bio if you want to check it out)

“If we catered to React developers, we'd be making it harder to use for the 70% of people not using React.” Third paragraph of the article

Chakra UI is available for Vue as well: https://vue.chakra-ui.com
Post reply on HN