What Is Reactjs?
The List of Major Features as following -
Reactjs is a fast, open-source, and front-end JavaScript library and It was developed by Facebook in 2011 for building complex, stateful and interactive UI in web as well as mobile Applications.
Reactjs follows the component based approach which helps you to building reusable and interactive web and mobile User Interface (UI) Components.
Reactjs has one of the largest communities supporting it.
Reactjs has one of the largest communities supporting it.
The high level component Lifecycle -
At the highest level component Lifecycle, Reactjs components have lifecycle events that are -
1. Initialization
2. State/Property Updates
3. Destruction
Reactjs is very fast technology that can be trusted for complex tasks and can simply be trusted for quality outcomes.
When Reactjs released?
March 2013
What Is current stable version of Reactjs?
The Version is - 15.5 and Release on - Apr 07, 2017.
What Is Repository URL of Reactjs?
https://github.com/facebook/react
How Is React different?
Basically, Reactjs is a limited library that is used for building the interactive UI components. Also used for building complex and stateful web as well as mobile apps. But some of the other JavaScript frameworks not perform the same.
Why Reactjs Is used?
Reactjs is used to handle only the View part and not for others web apps as well as mobile apps.
What do you mean by Reactjs?
Reactjs is a fast, open-source, and front-end JavaScript library and I was developed by Facebook in 2011.
The main aim was to build the complex, stateful and interactive user interfaces for web as well as mobile apps.
What Are the features of React?
1. JSX – The JSX is JavaScript Syntax Extension
2. Components - The Reactjs is all about components
3. One Direction Flow (Unidirectional Flux) - The React.js implements one-way data flow, which makes it easy to reason about your apps
The List of Major Features as following -
1. React uses the virtual DOM instead of the real DOM.
2. React uses server-side rendering.
3. React follows unidirectional data-binding.
What Are the Advantages of Reactjs?
The List of Reactjs Advantages as following as -
1. Reactjs uses virtual DOM which will improve performance of the apps.
2. Reactjs is free and Open Source and very fast.
3. Reactjs improves SEO Performance.
4. It can be used for both client and server side.
5. Also it can be used with other frameworks such as Angular, Meteor etc.
6. It is very easy to write UI test cases because the virtual DOM system implemented entirely in JavaScript.
7. It increases the application’s performance
8. Reactjs code readability increases by using the JSX.
What Are the limitations of Reactjs?
Do you think Reactjs has any limitations? If so, tell a few?
Yes! There are some limitations (drawbacks) with this platform. The main drawback of the Reactjs is - size of its library.
It is very complex and creates lots of confusion, takes time to understand to the developers.
List of Limitations of Reactjs-
1. Reactjs is just a library, not a framework
2. The library of Reactjs is - very large
3. Reactjs uses JSX for development.
4. It creates lots of confusion to understand to developers
5. Reactjs coding gets complex as it uses inline templating and JSX
6. Reactjs uses only in view layer of the MVC frameworks.
Does Reactjs use HTML?
No!, Reactjs uses JSX (JavaScript XML) which is very similar to HTML.
What Is the life Cycle of Reactjs components?
1. Initialization /Initial Rendering Phase
2. State/Property Updates
3. Destruction
What Is JSX?
JSX is stands for JavaScript XML.
This is a type of file used by Reactjs and It used in Reactjs as like HTML template syntax. The JSX makes applications robust and boosts its performance. This is simply integrates the HTML templates into the code of JavaScript.
It has become a very popular approach in the present scenario among the developers and browsers are not capable to read the code simply.
Below is an example of JSX -
class yourComponent extends React.Component {
render() {
var prop = this.props;
return (
div className="mycompo">
a href={prop.url}>{prop.name}a>
div>
);
}
}
Why can’t browsers read JSX?
Its follow the components approach. These components split-up the entire user interface (UI) into small independent and reusable pieces that means it renders each of these components independently without affecting the rest of the other user interface.
What Are the differences in between Real DOM and Virtual DOM?
Real DOM –
1. It updates slow as compare to Virtual DOM
2. We can directly update the HTML on DOM at the run time.
3. Will creates a new DOM, if element updates
4. DOM manipulation is bit expensive
5. There is too much memory wastage
Virtual DOM –
1. It updates faster as compare to Real DOM
2. We can’t directly update the HTML on DOM at the run time.
3. Will need to updates the JSX, if element updates
4. DOM manipulation is easy as compare to the Real DOM.
5. There is no memory wastage
Is it possible to nest JSX elements into other JSX elements?
Yes, it’s possible! The process is very similar to the nesting HTML elements.
What Is a state in Reactjs and how is it used?
The states are the heart and soul of Reactjs components. The states are objects, source of data which determine components rendering and its behavior.
The states are mutable and it used to create dynamic, stateful and interactive web and mobile components by using the - this.state().
What Are the Differentiate between stateful and stateless components?
Stateful Components –
1. The Stateful Components are stores the information about component’s state and have authority to change state.
2. The Stateless components notify them about the requirement of the state change and send to props.
Stateless Component –
1. The Stateless components are used to calculates the internal state and do not have authority to change state.
2. The Stateless components receive the props from the Stateful components and treat them as callback functions.
What Are the purpose of render() in React?
Each React component must have a render () functions and it returns a single Reactjs element, If more than one HTML element needs to be rendered. It must return the same result each time it is invoked.
What Is Props?
In Reactjs, Props are short hand for Properties.
Props are read-only components which must be kept pure. It is immutable.
What Are the difference between pros and state?
Props are short hand for properties and immutable while the state is mutable.
Props are read-only components while states are objects, source of data which determine components rendering and its behavior.
Both of them can update themselves easily.
Is it possible to display props on a parent component?
Yes, it is possible!
The best ways to perform this task is - using spread operator and also it can be done with listing the properties but it is a complex process.
What Are the lifecycle methods of Reactjs components?
The lifecycle methods of the Reactjs are-
1. componentWillMount() – This method executed just before rendering takes place both on the client and server.
2. componentDidMount() – This method executed on the client side only after the first render.
3. componentWillReceiveProps() – This method invoked as soon as the props are received from the parent class and before another render is called.
4. shouldComponentUpdate() – This method returns true or false value based on certain conditions.
5. componentWillUpdate() – This method called just before rendering takes place in the DOM.
6. componentDidUpdate() – This method called immediately after rendering takes place.
7. componentWillUnmount() – This method called after the component is unmounted from the DOM and used to clear the memory spaces.
What Is an event in React?
The events are the triggered reactions and it is very similar to handling events in DOM elements –
1. Mouse Hover
