Hacker News Reader

Comment by tenaciousDaniel | Hacker News Reader

As it happens, yesterday morning I tried using one for the first time in years. Material UI for React. Looked incredible, is very impressive, and yet within only 2 hours I ran into a scenario that couldn't be handled by the framework.

This morning, I'm stripping out all of it and starting over from scratch, like I should have done in the first place.

A caveat is that I love their color system, so I'm importing and using that, but leaving out everything else.

View on HN

Would highly recommend Tailwind if you don't like the boxed-in nature of most frameworks. Tailwind is more of a design system than a CSS framework. It simply gives you guidance on establishing proper constraints of your design system and then a nice set of utilities to get started with. There is no "can't be handled" scenario in Tailwind.

EDIT: And the book by the same author, Refactoring UI, is also a fantastic primer on the philosophy behind Tailwind.

Refactoring UI looks awesome, thanks for the recommendation, will check it out. I've heard of Tailwind and I can't remember what the price tag was, but it made me raise my eyebrows a bit lol.

> I've heard of Tailwind and I can't remember what the price tag was

It was (and still) is zero. Maybe you have it mixed up with Tailwind UI? (which is a paid library of ready-made components built using TailwindCSS framework)

out of curiosity, what was the scenario?

Converting a tree-like structure into a nested form inputs. Material seems to be rather opinionated about what a "form" is, and I found it too constricting for my needs.

More specifically, the TextField component assumes an accompanying label, while none of the other form components do. It seems like a very odd choice to me, since all form elements should have a descriptive label.

What input didn't have a label? I'm using mui in a webapp and didn't find any I couldn't add a label to.

TextField is already a composition of other components.

The demo page for Checkbox (https://material-ui.com/components/checkboxes/) shows how to use them with labels, and also groups.

Agreed there should be something included for CheckboxWithLabel, but to think it's impossible and the whole thing must be thrown out is a bit much.

Eh I wasn't super descriptive in my response, but it was connected to that. It wasn't that I didn't see a solution, it was more "how much effort modifying in a solution will take vs just writing it myself". I decided the latter was more cost-effective for my particular use case.

Reply on news.ycombinator.com