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😊.