Various discussions of React

React is a javascript library. It is a declarative, efficient, and flexible javascript library. It developed by Facebook. It’s also components-based architecture. But it’s not a framework.

01.ReactDOM.render:

It generally the entry point for react application into the browser’s DOM(Document Object Model). It has two arguments. The first one stands for what to render to the browser. It always reacts to elements. the second one stands for where to render the react elements on the browser.

02. Error Boundaries:

Error boundaries React components catch javascript errors anywhere in their child component tree, log those errors, and display a fallback UI instead of the component tree that crashed. Error boundaries catch errors during rendering, in lifecycle methods, and in constructors of the whole tree below them.

03. Ternary operator:

Ternary operators are used to performing conditional rendering if required.

if..else alternative used ternary operator.

i. ternary operator outside return expression,

ii. if/else block outside return expression.

Syntax:

condition? ifTrue: ifFalse

04. Spread Attributes:

we know already have props as an object, and you want to pass it in JSX, you can use … as a “spread” operator to pass the whole props object. And Also calling Spread Operator.

05.setState():

setState() change to the components state .And this component and its children need to re-rendered with the updated state. This is the primary method used to update the user interface in response to event handlers and server responses. and user response update immediately good performance.

06. Conditional rendering:

Conditional rendering is depending on some conditional logic. It’s often needed to render one part of the Html if some conditions are met, and the other if they not. React there are a few ways to do that.

07.Hook:

A hook is a react component that is called a special function. All hooks function starts with the “use” word. It is a very stronger function.it is used components and change use components value output. and it is uses function and class both components.

Example:

i. useState,

ii. useEffect etc.

08. React.createElement:

React.createElement is a method. Instead of working with strings to represent DOM elements in React, we represent DOM elements with objects using calls to the React.createElement method.

React.createElement has a many arguments:

i. First argument the Html “tag”(div),

ii. the second argument is for any attributes(id,href, etc),

iii. the Third argument is dom element children (output).

09.forceUpdate():

Our need when our component’s state or props change, our component will re-render. If our render() method depends on some other data And can tell React that the component needs re-rendering by calling force update().Calling force update() will cause render() to be called on the component, skipping shouldComponentUpdate()

10. Nesting React elements:

We know we have two nodes, one controlled with the dom directly and another controlled with react API. there are two nodes big difference is the Html version we used a string to represent the DOM tree and the React version we used pure JavaScript and represented the DOM tree .

THANKYOU