Monday, August 31, 2020

Let's learn react


Hello developers!! 

We will learn  about react and it's feature in introduction to react blog. Let's begin the learning!!

React

React is a JavaScript library to build user interface. React was developed by Jorden Walke, a software engineer at Facebook. Many people have the confusion either it react, reactjs or react.js so, you can use any of them. 

React Feature

  • React is a open source JavaScript library - It mean react project is available on Github and developers can contributes on project. 
  • Component Based Architecture - Component refers to building blocks of website. Joining all the components having different roles we make a single page application.
  • Code reusability - You will find footer in every website in react you just have to make one component [footer] and you can can reuse it in every page. Similarly, you can do will other components.
  • Performance- React is super in performance. React manages the virtual DOM, All the change in react component firstly reflects in virtual DOM and then get render in real DOM[browser]. The DOM exist entirely in memory. Due to this, when change done in component is firstly reflects in virtual dom instead of real DOM[browser] leading to smoother performance.
  • JSX- JSX stands for JavaScript XML. It is a JavaScript syntax extension. Its an XML or HTML like syntax used by ReactJS. This syntax is processed into JavaScript by babel. It extends the ES6 so that HTML like text can co-exist with JavaScript react code. It is not necessary to use JSX, but it is recommended to use in ReactJS.
  • Simplicity- React is easy to code as it uses the JSX syntax. Also it is a component based you can reuse the component.
  • One-way data binding -React apps are organized as a series of nested component. These components are functional in nature: that is, they receive information through arguments[props attributes] and pass information via their return value[render function].This is called unidirectional data flow. Data is passed down from components to their children.
  • Virtual DOM -A virtual DOM object is a representation of the original DOM object. It works like a one-way data binding. Whenever any modifications happen in the web application, the entire UI is re-rendered in virtual DOM representation. Then it checks the difference between the previous DOM representation and new DOM. Once it has done, the real DOM will update only the things that have actually changed. This makes the application faster, and there is no wastage of memory.



4 comments: