What is React?
It is a library (not a framework) by Facebook. It is the V in MVC.
It introduces the XML/HTML-like (JSX) concept of writing UI which makes the code readable. You write components instead of views. Components are used by other components. React supports one-way data-flow through props. So the child views are agnostic of where it is being used. This induces modular code.
Before React, we had to manually go and change the DOM based on whatever action the user takes or whatever changes happen in our data-model or any state change. We had to specifically define events, trigger them, listen to them and then manually go and change the DOM accordingly. This was time-consuming, added litter all over the code, bug-risky and made the apps slower.
The DOM was never optimised for creating dynamic UI.
So, React adopted the concept of virtual DOM in which we are never required to manually go and change the DOM. React also introduced the concept of state.
We just need to define how our app/component is supposed to look at any given state and React will handle the DOM manipulation for us in a very effective and speedy manner. When the data changes, React conceptually hits the “refresh” button, and knows to only update the changed parts. React always updates the entire components (conflict with earlier statement — need to resolve).
All we do in React is make components. These components are of 2 types: Container components and Presentational components.
Container: These components have logic i.e. state.
Presentational: These are dumb components and supposed to just render the stuff given to them.
If we follow the above architecture, the components are composable which adds up to modular code.
React challenges much of the conventional wisdom because it gets rid of most of the conventional methods which leads to slower apps and dirty code.