In this article, I will discuss about some fundamental concept about React.js
There are a few subjects will be talk about here.
1.What is React and Why Should We Use it ?
2. What is Declarative Programming ?
3. What is Imperative Programming ?
4.Declarative Programming versus Imperative Programming ?
5. What is JSX, Element and Component in React ?
6. What are the various kinds of Components In React ?
7.What is render in Props ?
8. Unadulterated capacities versus Impure capacities ?
9. What is Reconciliation Algorithm ?
10. Why React is More Efficient ?
1. What is React and Why Should we utilized it?
ReactJS is an open-source javaScript Library that was made by Facebook which is utilized for building UIs and dealing with see layer for web and portable applications. It’s likewise permit to make reusable UI parts.
The center goal of ReactJS is giving the most ideal delivering execution. The explanation for utilizing ReactJS is to be quick and versatile and basic. It permits us to make huge web applications which can change information, without reloading the page.
2. What is Declarative Programming ?
Explanatory writing computer programs is a programming worldview in which the developer characterizes what should be cultivated by the program without characterizing how it should be actualized.
At the end of the day, the methodology centers around what should be accomplished as opposed to training how to accomplish it.
3. What is Imperative Programming ?
Basic writing computer programs is a programming worldview in which the software engineer characterizes how to achieve the program without characterizing what should be refined by the program.
Basic programming portrays an arrangement of steps that change the condition of the PC. Basic programming expressly tells the PC “how” to achieve it.
4. Definitive Programming versus Imperative Programming ?
Definitive programming :
I) What to do ?
ii) A way of building the Structure and components of the PC programs.
iii) It communicates the rationale of a calculation whithout depicting it’s control.
Basic programming :
I) How to do ?
ii) It’s a programming ideal models that utilizes the explanations that change a Program’s state.
iii) It’s depicts the control for the calculations or for changing the territory of Programs.
5. What is JSX, Element and Component in React ?
JSX :
I) JSX is a preprocessor step that adds XML punctuation to JavaScript.
ii) JSX is a XML-like sentence structure augmentation to ECMAScript with no characterized semantics.
iii) at the end of the day, JSX is a grammar expansion to javaScript. It created respond segments.
const element = <h1> Welcome to ALtCampus </h1>Component :
A component is a plain item portraying a segment occasion or DOM hub and It’s ideal Properties.
Part:
I) It’s an essential structure square of any React application.
ii) It is a javaScript class or capacity that alternatively acknowledges input for example props and returns a React component that depicts how a segment of UI ought to show up.
6. What are the various sorts of Components In React ?
There are two kinds of parts in ReactJS
I) Functional segment :
Utilitarian parts are those segments for example typically characterized as a component of its state and props .
import React from ‘react’;
function App() {
const greeting = ‘Hello Function Component!’;
return <h1>{greeting}</h1>;
}
export default App;
ii) class component:
class components have some additional features .
class classComponent extends React.Component {
render() {
return <div> My Class Component </div>
}
}
7.What is render in Props ?
The term “render prop” refers to a technique for sharing code between React components using a prop whose value is a function.
<Provider render={data => (
<h1>Hello {data.target}</h1>
)}/>
8. Unadulterated capacities versus Impure capacities ?
Pure functions :
I) Pure capacities are those capacities that acknowledge an information and returns a qualities without adjusting any information outside it’s extension.
ii) A Pure capacity consistently restores a similar incentive as the given information.
iii) A Pure capacity ought not have any side effetcs like mutataing the information , console.log, Math.random and Rendering API calls.
Impure functions :
I) Impure capacities are those capacities that acknowledge an information and returns an altering information outside of it’s lexical degree.
ii) Impure capacities changes the variable/state/information outside of it’s lexical degree.
Lexical Scope : A show utilized in numerous projects to sets the degree (scope of usefulness) of a variable so it might just be called from inside the code is characterized.
In basic , lexical Scope implies the factors characterized inside a capacity .
9. What is Reconciliation Algorithm ?
I) In basic, “ Reconciliation is the activity of making one view or conviction viable with another.”
ii) It’s a cycle through which respond refreshes the DOM. At the point when a segments state’s changes ,React needs to ascertain on the off chance that it is important to refresh the DOM. It does by making a VIRTUAL DOM and contrasting and the current DOM.
Virtual DOM :
‘“ The virtual DOM is the example of existing DOM, that contain the new condition of the part. “‘
10. Why React is More Efficient ?
Respond is more proficient due to Reconciliation (Diffing Algorithm). Respond re-render just that components whose state are changed rather than in general component or view.
Thank you.