What is react
React is a fast front-end, open-source, popular JavaScript library developed by Facebook in 2011, that is growing in popularity with its single-page web and mobile applications architecture, It is used to build a reusable component with an interactive User Interface. It is mainly focused on control the view layer or front-end, rendering data to the DOM of the web application.
React works on “props down, events up” approach to share data between components and out of the components
Prerequisites to learn React
- Basic knowledge of HTML, CSS
- JavaScript and ES6
- Arrow function
- Array methods
- Const,let
- Import/Export
- Classes
- Object, array Destructing
- Package Manager (Node + Npm)
- What is JSX in React?
- How to do React JS Environment setup
- How to create components in React?
- React Interview Questions and answers
- How to allow Positive number in Textbox React JS
Major features of React
React have many features that make it a fast and powerful front end library.The major features of React are:
1. VirtualDOM:
React uses VirtualDOM instead of RealDOM.RealDOM manipulations are expensive so maintaining a VirtualDOM makes it faster. React keeps a lightweight representation of the “real” DOM in the memory, and that is known as the “virtual” DOM (VDOM).RealDOM manipulation is much slower than manipulating VirtualDOM because nothing gets drawn on the screen and everything is in memory only. When the state of an object changes, VirtualDOM changes only that object in the real DOM of the page instead of updating all of the objects.
2. JSX – JavaScript Syntax Extension
JSX stands for Javascript Syntax extension.JSX is a XML-like syntax extension to ECMAScript.
JSX is recommended to be used with React to describe what the UI should look like.
JSX is a kind of a template language, but it comes with the full power of JavaScript.
4. Supports server-side rendering
Server-Side Rendering(SSR) is the ability of a front-end framework to render markup while running on a back-end system. Applications that have the ability to render both on the server and on the client are called universal apps. React is capable of this and is used to make universal applications.
5. Follows Unidirectional data flow or data binding.
React’s unidirectional data binding keeps everything modular and fast. A unidirectional data flow means, the react views contain the parents and child components with each other. This helps in the design and data flow from parent to child and gives better control to developers on the Views designs.
6. Uses reusable/composable UI components to develop the view.
React applications used the components to design the views on the pages. React components can be designed to be reusable on multiple pages. This makes the code reusable and helps in faster development also.
7. Debugging support
React applications can be developed and debugged easily with the help of flexible browser plugins. These plugins helps in better analysis and debugging features.React tab in google chrome or chromium browser is an good example of such tools that helps developers to debug the applications very easily.
What are the advantages of React?
React have a lot of advantages that make it as one of the most liked Front end library. Let us have a look at these advantages of React:
- Increases the application’s performance with the use of Virtual DOM.This helps in better GUI experience with very fast page rendering.
- JSX template supports makes it very easy to code.
- React code can be rendered both on client and server side (SSR) and this supports SPA (Single Page applications) that makes
it a perfect library for universal applications. - React library is very Easy to integrate with many other front end GUI frameworks, since it is a lightweight view library.
- React is easy to write unit and integration test cases with supported tools such as Jest.
What are the limitations of React?
Though React has a lot of advantages, but it has some limitations also. Sometimes these limitations make developers not go with the React library to develop their applications.
Let us have a look at these limitations:
- React is not a full framework. React is just a view library.
- There is a learning curve for beginners as JSX is new to Web development.
- Integrating React into a traditional MVC framework requires some additional configuration.
- The code complexity increases with inline templating and JSX.
- Too many smaller components leading to over-engineering or boilerplate.