Functional vs Class Component in React.js

Components are the most important part of React, it let's us to write code in different piece and split in independent states.
It literally is a function which "returns something" like in JavaScript Functions. You write something you get that thing.

1.Functional Components

Way to define a functional component which accepts a prop can be :
function Welcome(props) {
return <h1>Hello, {props.name}</h1>;
}

• Here input can be props and output can be JSX, very straight forward right??.

• Functional components don't support State until React Hooks came into existence

2.Class Based Components

With react ES7 Snippet installed type rcc it's gonna give react class component :
class Welcome extends React.Component {
render() {
return <h1>Hello, {this.props.name}</h1>;
}
}

• In class based function we have to first use render() then return something (whereas in functional components directly return something). A bunch of things can be written under render that comes under state and lifecycle topic, to know refer here.

That's all from my side, I will write next article continuing Components and how to use them with State and Props which are building blocks to learn and master React.

If there is anything I can add please let me know😊.