What css technologies/ libraries do you use with React?

#beginners #webdev #react #css

hey everyone, still a noob in front end development (sorry in advance for the noobness lol), though I'm curious what people use to in their front-end dev process. I'm just starting to learn react but to make front end development faster do people use CSS libraries like materialize or tailwind CSS or bootstrap along with frameworks like react/ angular?

Top comments (5)

Conrad Sollitt • Jun 10 '20

Hi Mark,

Specifically for React Styled Components and Ant Design are very popular (along with a large number of other projects). Styled Components is very interesting as it uses CSS props with in React/JSX.

styled-components.com/

ant.design/

Personally for React though I like using standard CSS files and the className prop on elements. I like this method as I like using CSS and it keeps the code easily shareable with other technologies and basic pages. Example of a site I created with this method is Awesome Web React on js.org - I also include demos for Styled Components and Ant Design on it:

awesome-web-react.js.org/

Additionally I created a minimal JS framework and standalone react components. The demo pages are of the same pages/apps using different front end tech (React, Vue, Handlebars) so while the JS and HTML is different on each page I was able to re-use the CSS files for each demo:

dataformsjs.com/en/examples

For simple pages I often just write CSS from scratch and for larger projects (specifically corporate web apps with entry forms) I often use Bootstrap but sometimes write fully custom CSS as well.

Here are some good links for learning CSS:

developer.mozilla.org/en-US/docs/L...

smashingmagazine.com/2019/01/how-t...

css-tricks.com/

Good Luck learning Front End Development!