How to write great React

Five points to remember

Writing this article started with a question: if I could give a new developer one piece of advice to help them write great React, what would it be?

My answer: write clean components by following the rules of writing clean functions.

Why focus on writing components?

Our goal is to write React applications that are easy to read, easy to maintain, and easy to extend.

There are a lot of factors that go into this: architecture, state management, file structure, code formatting, etc etc.

But the bulk of our application—the bulk of the code our team will be working with—will be components.

If your components are all clean and concise, your team can move faster.

Will this guarantee a great application? No. The rest of your architecture could be a mess.

But it’s much harder to build bad architecture out of good components.

So how do we write good components? First step: always treat them as functions.

Components as functions

Some React components are functions.

const Button = ({ text, onClick }) => (
  <button…