React Js is an open source JavaScript library used to build User Interface(UI) components. React Js is component-based and has many lifecycle methods to control the data flow. Data flow is unidirectional and use states and props to handle it. Each time when a component has some changes, it is re-rendered which can lead to memory loss. But React overcomes this by creating a Virtual DOM, which is actually a copy of the real DOM. Whenever changes happens, it is rendered in virtual dom and then it compares with the previous DOM. Once this is done,in real DOM only those changes in the right component are rendered rather than the whole document or application.

Why React Js?

• Components – creates reusable components with specific logics.
• Data Binding – use One-way data binding and provides better control over application.
• Virtual DOM – use a virtual DOM (copy of real DOM) for faster and efficient running of applications.
• JSX – allows to use HTML like text along with React Js code.

State and Props

The State is like a data store for a react component. Components are rendered whenever there is a change in the state and this is handled by using setState() method. Props are used to send the data between the components and they are immutable.

LifeCycle Methods

1.Mount

• getDerivedStateFromProps
• render
• componentDidMount

2.Update

• getDerivedStateFromProps
• shouldComponentUpdate
• render
• getSnapshotBeforeUpdate
• componentDidUpdate

3.Unmount

• componentWillUnmount