markerikson / react-community-tools-practices-cheatsheet

Descriptions and use cases for common tools and practices in the React community
https://react-community-tools-practices-cheatsheet.netlify.app/
328 stars 13 forks source link

Category: Styling #8

Open markerikson opened 2 years ago

markerikson commented 2 years ago

Add pages covering purpose, capabilities, tradeoffs, and use cases for common data fetching tools.

Likely items to cover:

srmagura commented 2 years ago

Planning to do pages on plain CSS, inline styles, and Emotion (to which I'm a contributor), in that order. I'll do them one by one so I can take feedback into account for the next one. 👍

Edit: should Sass be covered on the plain CSS page? Or make Sass it's own page?

markerikson commented 2 years ago

Good question! I'm not exactly sure, and I'm also certainly not an expert on styling techniques. (I know what SASS is, but I've never meaningfully used it.) What's your opinion here?

srmagura commented 2 years ago

I think CSS preprocessors deserve their own page. I've only used Sass, which is the most popular... but I think LESS and stylus are similar enough that we can cover all 3 with a single page.

markerikson commented 2 years ago

Yeah, that's what I was wondering. Sounds good!

Sajad-Sharhani commented 2 years ago

Will be great if we added PostCss, WindiCSS, and TailwindCSS as well.

markerikson commented 2 years ago

Yeah, this also starts to spiral off into "way too many options" just like the other categories :)

I'd say it's worth adding a page on "prebuilt CSS libraries" and "utility CSS" as broader descriptions, and mentioning specific options like Bootstrap and Tailwind as examples of those categories.

(I suppose at some point we might want to consider addressing "component libraries" and start discussing things like React-Bootstrap, Material UI, Antd, Mantine, and the 5 million other options there...)

markerikson commented 2 years ago

Oh hey, was just going back through my bookmarks and ran across Lee Robinson's post "How Should I Style My React Application?" ( https://leerob.io/blog/css-with-react ), which covers a lot of this same stuff.

I think the pages @srmagura is writing are on the same track, but maybe we could steal a bit of the info or presentation from this post.