Simple Explanation on React component and types of React component

What is React Components?

React component are reusable piece of code written that can be use just like a function. Once a component is declared it can be use in other components.

There are two types of React component

Class component

Class component is the type of component must include extend React.Component, it has access to state which dictate the current behaviour of a component. It uses a contructor method.

In this image below you will understand and see how class component is been created by creating an Example component and pass it into App component

Class Example extends React.components{
    render(){
       return(
          <h1>this is a class 
            component
          </h1>
        )
     }
}
 export default Example;

Passing the Example component into the App component

import Example from "../components/Example

class App extends React.components{
   render(){
       return(
         <Example />
       )
    }
}
 export default App;

Function component

Function component is a type component is a Javascript functions that accepts props and returns the react element. It's easy to write and more readable

In this image below we are going create a Hashnode component and pass it to another component called App

function Hashnode (){
    return(
       <h1>this is a function 
             component
       </h1>
    )
}

App component

import Hashnode from "../components/Hashnode

function App (){
    return(
       <Hashnode />
     )
}
 export default App;

That's the end folks, hope you found article helpful. You can follow me on twitter @hey_Jonuel and LinkedIn Emmanuel j uzoezie