Explore React Fundamental Core Concept For Beginners

React Introduction

React Is A Javascript library . which is creating user interface. And React Is tiny libray. This is use super easy and super fast working. It is very flexible for fronted ui design. and most popular library than vuje.

React Overveiw.

. A User Interface Library

. Component Architecture

. One way data flow React.

. Component Based React.

React Component

React is component based building user interface. becasue component based user interface creating super easy and very flexible . optimization and customization is very easy any react app.

React components that are reusable, composable, and stateful. when we are define small or bigger component thats component must be shared with any other component.

component always refer can be other component in their outpu. this lets us use the same component abstraction for any level of detail. A header, a form, a button, a paragraph, in expressed in react component.

React Virtual Dom

The virtual dom is a react concept where an ideal virtual representation of a UI is kept in memory and synced with the real DOM by a library such as ReactDOM. This process is called reconciliation. … They may also be considered a part of virtual dom implementation in React.

React virtual dom is efficient working and render than dom. when any data update just virtual dom no full data rendenting just updating changing data. this is efficient working. virtual dom process is called reconciliation.

Manipulate the more than slow. and virtual dom is more faster. In react, for every dom object , there is a corresponding object.

A virtual DOM object has the same properties as a real DOM object, but it lacks the real thing’s power to directly change what’s on the screen.

How virtual dom helps in react

The entirely virtual DOM gets updated. where is the changed data .

The virtual DOM gets compared to where is looked before updated it. React virtul dom figures out which objects / component have changed.

React JSX

JSX that means javascript XML. JSX allows us to write HTML code in React.JSX makes it easier to write HTML code and javascript expression and add HTML in React. it is a syntax extension to JavaScript. it comes with full power of javascript. JSX produces React elements ,, We will explore rendering them to the virtual DOM in the react.

JSX it,s look like HTML code . but ultimately it is a javscript code .

JSX is an useful based on javascript ES6 language. And React JSX always translate regular javascript code when javascript javascript code run time.

jsx translate in regular javascript behind this is working babel . babel is javascript code compliler.

React application not required JSX USE, but this is use make easier and writing code and create react application.

JSX Expression

The expression can be a React variable, or property, or any other valid JavaScript expression. JSX will execute the expression in curly brackets and return the result.

What Is Prop-Types

Prop-Types is library which is props value or data passing validate . Thar is very helpful type checking in react. prop-types exports a range of validators that can be used to make sure the data you receive is valid.

How do work Prop-types

If prop-types checking don’t match right now error showing and give them warning. So Props-Types is very case sensitive . Prop-Types always expect types matching then working beautifully.