The core purpose of a React component is to define the displayed view and bind it to the code that drives its behavior. React’s functional components distill this down to the simplest possible profile: a function that receives properties and returns a JSX definition. Everything required for behavior is defined within the function body, and the class-related parts of object-oriented components are dropped.

Functional components are capable of performing all the work of a class-based component beginning with React 16, via the “hooks” API.

Let’s begin by comparing a very simple class-based component with a functional version.

To read this article in full, please click here