Components

Components are just a reusable piece of code and in react, everything is treated as a component, for example, a header, sidebar in this website is just a components.

The component name should always start with a capital letter otherwise react treated it as a normal HTML element.

In react, there are two approaches to write a Components.

1.Stateless Components

  • Components which are created by using functions are called Stateless Components.
  • it means there is no state object or any Lifecycle methods present inside this functional components.

example :

function Stateless(){
    return (
        <h1>Im stateless</h1>
    )
}

2. Stateful Components

  • Components which are created by using class syntax are called Stateful components.

  • it means there are an internal state object and Lifecycle methods present inside this class based components.

example :

class StateFul extends React. Component{

   constructor(){
     super();
     this.state ={name:"stateful"}
   }

  render(){
      return (
          <h1>{this.state.name}</h1>
      )
  }

}