Using stateful versus pure functional components

While building a UI with React components, composing the views with more stateless functional components can make the frontend code manageable, clean, and easier to test. However, some components will require the state or life cycle Hooks to be more than pure presentational components. In the following sections, we will look at what it takes to build stateful and stateless functional React components, when to use one or the other, and how often.

Stateful React components with ES6 classes or Hooks

We can define stateful React components with ES6 classes or by using Hooks without writing a class. React components defined using ES6 classes have access to life cycle methods, the...