Last week, Trulia hosted a meetup for the ReactJS San Francisco Bay Area group, where more than 100 developers came to our office to learn more about React. Speakers covered Atomic Design in React, Graphql and Relay. Representing Trulia, I gave a talk on CSS in React, including the pros and cons of moving from basic CSS to using a React specific framework for handling styles in components.
:after. Also, since styles are all inline, debugging larger applications is difficult and there may also be a performance impact.
React CSS modules
.btn it can be customized via your build tool to become
.btn_HYx7V. This new modularized class contains your corresponding rules and is scoped to your individual component.
If you would like to learn more or experiment with these ideas in a minimized and step-by-step approach, I’ve created a CSS in react github repo to get you started. Just clone the repo, and switch to the directory you’d like to test. I will be keeping an eye on the developments in the CSS in React community as it is exciting to see how cssnext and Shadow DOM gain wider adoption within React. More on these topics will be covered during my upcoming talk at SXSW in 2017, too, so stay tuned!