Top 10 React.js Hacks !!
1 .What is react.js ? why should we learn react.js ?
=> React.js is a small library of javascript . It is components based library . components means it is reusable . we see that a website have some features are looking same but data is different so if we don’t repeat this code we will use dynamic value in component it will help you to don’t repeat codeing .
2. React Hook
A hook is a special function of react features .
→ Why we use useState ?
# useState is React hook you think component data always is change able it uses is change able state
→ why we use useEffect ?
# useEffect is use for API call . when we want to load data from it helps me API call in react hook .
3 . Why we use props ?
# React props pass arguments and data components to child components .
4 . React Virtual DOM
→ virtual DOM is react data representational ui component . It is a vast helpful because javascript DOM presented time is long but React virtual DOM is so faster then javascript DOM . Javascript DOM take more memory cost but virtual DOM take less memory cost etc .
5 . What is JSX?
→ JSX is a JavaScript Extension Syntax used in React to easily write HTML and JavaScript together.
jsx code is like -
const jsx = <h1>This is JSX</h1>It is simple JSX code in React. But the browser does not understand this JSX because it’s not valid JavaScript code. This is because we’re assigning an HTML tag to a variable that is not a string but just HTML code.
6 . React Optimizing and Performance .
→ Web site performance is important for user and google rank . If we want to make our website best performance we can use some technik see bellow -
- use React.Fragment to avoid adding extra nodes to the DOM
- Before deploy application must build production build it will help to more faster web site .
- use React.lazy api because it will help optimize and speeding up render time
7 . Purpose of React render .
Each React component must have a render() mandatorily. It returns a single React element which is the representation of the native DOM component. If more than one HTML element needs to be rendered, then they must be grouped together inside one enclosing tag such as <form>, <group>,<div> etc. This function must be kept pure i.e., it must return the same result each time it is invoked.
8 . What is a state in React?
States are the heart of React components. States are the source of data and must be kept as simple as possible. Basically, states are the objects which determine components rendering and behavior. They are mutable unlike the props and create dynamic and interactive components. They are accessed via this.state().
9 . What are Higher Order Components ?
Higher Order Component is an advanced way of reusing the component logic. Basically, it’s a pattern that is derived from React’s compositional nature. HOC are custom components which wrap another component within it. They can accept any dynamically provided child component but they won’t modify or copy any behavior from their input components. You can say that HOC are ‘pure’ components.
