JavaScript React

*Context API *

The Context API is a React structure that enables you to exchange unique details and assists in solving prop-drilling from all levels of your application and prop-drilling is a process where we pass a props with another component with the help of all the components that come between them. Actually we use context api pass some unique data from one component to another so this is very important in React.

*JSX *

JSX is a syntax extension which describes React object tree. It is just like an XML-like extension to ECMAScript.
A JSX compiler will translate any JSX into regular javaScript before the file gets to the web browser. A React element which is produced by JSX and it is simply an object and its representation of a DOM node.

*Virtual DOM and diffing- algorithm *

Virtual dom is representing a UI which is a copy of the original DOM kept in the memory and synced with the real DOM by libraries such as ReactDOM. This process is called Reconciliation.
Virtual Dom: Best for mobile-first application. Representation of a dom object.
Real Dom : Representation of a web page. Represent the document as nodes and objects.
Diff algorithm : A programming tool and using this tool we can differentiate between two or more files. To find a heuristic to change anything from a state to another is the main work of a diff algorithm.

*Props and states *

Props : Props are read-only and immutable. Pass data from one component to other components as an argument. Can be accessed by the child component.
State : State changes can be asynchronous and mutable. State holds information about the components. Can’t be accessed by child components.

*React component lifecycle *

React component lifecycle can be describe into four parts:
Initialization,
Mounting,
Updating,
Unmounting.

*UseState *

A function is a built-in hook that can be imported from the react package. It allows us to track state in a function component.
It is a special function that passes a function as an argument if the initial state has to be computed and the value returned by the function will be used as the initial state.

*Differentiate between stateful and stateless components *

Differentiate between stateful and stateless components are:
Stateful components: Manages the state in class-based with state or functional with useState. Have authority to change state. Data keeps changing.
Stateless components: No initial state management in it. Do not have authority to change state. Data remains the same.