Components

Components let us split our UI into independent, reusable pieces, and think about each piece in isolation.

Conceptually, components are like JavaScript functions. They return React elements describing what should appear on the screen.

Components in React are widely classified as:-

1. Functional Component

2. Class Component

The simplest way to define a component is to write a JavaScript function:

function Welcome()
 { 
 return <h1>Hello, React</h1>;
 }

This function returns a React element. We call such components “function components” because they are literally JavaScript functions.

You can also use an ES6 class to define a component:

class Welcome extends React.Component 
 { 
 render() 
 { 
 return <h1>Hello, React</h1>; 
 } 
 }

This class extends the inbuilt React Component class and returns a React element. We call such components “class components”