How to create React components
According to Meta Platforms, Inc., React is a JavaScript library for user interfaces (UIs). Since version 15, React has been developed under the Massachusetts Institute of Technology (MIT) license. React is component-based, and the components are independent and reusable. The components are the basic building blocks of React. When you start to develop a UI with React, it is good to start by creating mock interfaces. That way, it will be easy to identify what kinds of components you have to create and how they interact.
From the following screenshot of the mock UI, we can see how the UI can be split into components. In this case, there will be an application root component, a search bar component, a table component, and a table row component:
Figure 7.1 – React components
The components can then be arranged in a tree hierarchy, as shown in the following screenshot. The root component has two child components: the search...
