Whats In a Component?

Components are apart of React. React is a library that was created by facebook. React allows you to use components to keep separation of concerns very organized. This way when updates need to be implemented it is easier for a person to find the file they want to update and more easily make changes.

There are two different types of react components. One type is a functional component. A functional component is usually a simple component that returns a footer or a header. Maybe a flashy title.

Here is an example of a functional component, that is very simple and just returns a title that says “The fighters!”.

A class component on the other hand is a little more deep. A class component can handle the ever changing state of the component and uses the render method. Here is an example of a class component. This component renders a counter that is incremented by the amount of characters that a typed in the input.

With every component the first thing that must be done is too ‘import React from ‘react’. Another must is to export the component. Exporting can be done at the bottom of the component with export default or you can export the component when defining the component at the top, with the export keyword.

Components make react easy and organized. Using components gives your webpage the ability to change more fluidly.