Understanding React Components - What are States - What are Props - State vs. Props

What are the components and brief understanding of State and Props?

Components in React consist of mainly five things to bear in mind:

1. A component is a plain old Javascript function.

2. A component must return "something".

3. The "something" is JSX.

4. A component may have data private to itself, we call it "State"

5. A component may have data to share with other components, we call it "Props"

Component is an isolated unit which can be used to do specific jobs and that they can also be used in many different places. This means that a component has UI as well as computational logic.

It is always suggested to breakdown the components into simpler parts rather than a big monolithic component because components have a feature of reusablity through which we can use the desired chunk of our component and use it in our desired position.

In a component, there is always a private data in it which is called as state and if the components need to share the data with other components then we take the help of props.

One can remember state as local variable of a program and props as arguments of the program.