A few months ago we had the opportunity to create a new product from scratch at YPlan and we wanted to do it in the right way. Our aim was to craft beautiful UI components which we could easily extend and reuse across the application.
Atomic CSS is a method of writing CSS where a class defines a single property. The result is a CSS file in which every declaration appears only once.
Let’s start with the following tweet with which I couldn’t agree more:
It looks like there’s a war between CSS and inline styles people but it’s not true: everyone just wants to make their job better day after day. React, in particular, has always been communicated in a very strong way (either you accept it or not) and inline styles are not an exception.
Some weeks ago I shared a survey to compare how developers felt about inline styles the first the time they heard about them versus how they feel about them today, on a scale from one…
Apart from working with love everyday, one thing we can do to achieve our goal is to write a good number of tests. The component-based nature of React comes handy in this process because components are easy to test.
Front End Engineer at Facebook