Create a react component

Create a react component

Once you have imported the core react library as we have seen, you can start using it for creating components. Components are re-usable pieces of an application. The main idea behind it, is instead of having one big page, we split our page into smaller pieces. These pieces could be anything, like a navbar, an aside section, a main section, a form or even smaller pieces like buttons.

These components are autonomous and they serve a specific task, normally to render some HTML with some functionality inside. Components for now are separable, and we will see later how we can make them communicate with each other. 

The main purpose of components is that we separate concerns, and we have an easier to debug, develop and test code. It is one of the key concepts that react brings in.

We can create a component by extending the React.Component class that comes from react as shown to the picture. We will see later, what to put inside the component, and how to use it in our application.