What does HackerNews think of twin.macro?
๐ฆนโโ๏ธ Twin blends the magic of Tailwind with the flexibility of css-in-js (emotion, styled-components, stitches and goober) at build time.
They don't ever claim to be component-driven. They are utility-class library and nothing else.
I highly recommend using twin.macro if you are using React. It basically combines tailwind with styled components and helps immensely with readability:
I especially like how easy it is to fall back onto ordinary Styled Components if I'm trying to implement things more specific than what tailwind can handle.
Here's a sample of what I've implemented with twin.macro: https://grueplan.com
1. You're talking of MVP so I assume the UI doesn't have to be glamorous. Most of the elements you are going to leverage could be UI libs like Material-UI[0] or Ant Design[1].
2. Then, other than components, sometimes you do need some CSS handle layout and such. My choice would be CSS frameworks like Tailwind[2]. Honestly, to make good use of Tailwind sometimes require good CSS skill, but I believe people could still try Adhoc problem-driven approaches - you'll learn things along the way.
In case CSS makes you wonder after the MVP, you could try to expand styles you have been using in Tailwind, to see what's the corresponding CSS is and you'll learn.
(There's also a macro version of Tailwind named twin.macro[3] which fits React better IMO.)
(Tailwind has their official UIs (not free) [4] but I never tried them, it might work for you if you don't care about UI)
[0] https://material-ui.com/ [1] https://ant.design/ [2] https://tailwindcss.com/ [3] https://github.com/ben-rogerson/twin.macro [4] https://tailwindui.com/
It also answers the "where do custom styles go" question to some extent (answer: the css prop).
https://github.com/ben-rogerson/twin.macro
Edit: I had stopped reading half way through! This is what the article is about. I'll leave my comment up to publicly shame myself.