React: Reinventing the Model View Controller Paradigm
In the traditional model view controller (mvc) paradigm, the application is split into three folders: state(model), the user interface(view), and the controller(how interactions in the view change state) Instead of separating the logic for each component into three different places, React breaks down the application into numerous components (functional units) and places all the logic for each component in one place. When a developer makes a change, they are mainly concerned with changing a specific functional unit and thus want all that logic for that component in one place.
In addition to restructuring the application, React simplifies the mvc model. The render function in each component encodes how the view should look based on the state. React also allows you to add other functions such as event handlers that impact the state. Whenever the state changes, React automatically renders the component based on the new state. Furthermore, it automatically makes the minimal modifications to the DOM to go from the old view to the new view. In traditional mvc, for each possible old state/new state combination, the developer has to figure out how the view should change. In React, the developer defines one function for how the view depends on the current state and only needs to define functions for what can change the state. The developer does not need to worry about what the previous state was and how this change in states impacts the view.
In conclusion, the functional component based structure of React is developer friendly. Second, React allows developers to simply focus on how the view depends on the state and what events can change that state.
