Getting Started with React Front-End Development

React is a JS library developed by Facebook, so why did Facebook build React, what problem is it mainly to solve, and how is it solved through this?
Starting from these few questions, I searched the Internet and found such an explanation.
Facebook believes that MVC cannot meet their scaling needs. Due to their very large code base and large organization, MVC quickly becomes very complex. Whenever a new function or feature needs to be added, the complexity of the system increases. It has grown exponentially, making the code brittle and unpredictable, and as a result their MVC is falling apart. It is considered that MVC is not suitable for large-scale applications. When there are many models and corresponding views in the system, its complexity will expand rapidly, and it is very difficult to understand and debug, especially the bidirectional data flow that may exist between models and views.
Solving this problem requires "organizing the code in a way to make it more predictable", which has been done with Flux and React they (Facebook) came up with.
React is a JavaScript class library inside Facrbook, which has been open sourced in 1 year and can be used to create web user interface. It introduces a new way to deal with the browser DOM. Gone are the days of manually updating the DOM and painstakingly recording every state — this old-fashioned approach is neither scalable nor difficult to add new features, and even if it could, it would be risky. big risk. React solves these problems in a very novel way. You only need to declaratively define the user interface at each point in time, and the unordered relationship needs to update which part of the DOM when the data changes. At any point in time, React can update the entire application with minimal DOM modification.
  React introduces some exciting new concepts that challenge some of the existing best practices. Learning these concepts will help you understand their advantages and create highly scalable single page applications (SPAs). React puts the main focus on the "view" part of the application, and does not limit the way of interacting with the server and organizing the code.
Where is React good? There are two personal opinions:
1. Virtual DOM - When the state of the DOM tree needs to change, the virtual DOM mechanism will compare the DOM trees before and after the same Event loop (naturally through a series of efficient algorithms), if there are differences between the two DOM trees , then React will only modify the DOM in response to these different areas (DOM diff), so as to achieve the most efficient DOM manipulation and rendering.
2. Components can be nested, and they can be templated - in fact, the "components" mentioned in React are usually some UI modules that can be encapsulated and reused. Part of the DOM area for fine-grained UI functionality". Then we can use these components nested layer by layer (of course there will be dependencies between components).

As for modularity, similar to ejs, it can be referenced on the page as an independent module for reuse. However, it can directly use UI components as script modules. We can fully cooperate with CommonJS, AMD, CMD and other specifications to require the required component modules, and handle their dependencies (is it a bunker).

Recommended React Free Teaching Courses:

Getting Started with React Front-End Development

(This course mainly explains the basic skills and practical cases of React, and aims to master the development technology of the front-end framework React, which is suitable for front-end developers to learn)

More excellent courses:

7 days to play cloud server

ApsaraDB for Redis Edition Tutorial

Getting Started with Cloud Storage Object Storage OSS

Alibaba Cloud CDN Tutorial

Load Balancing Getting Started and Product Usage Guide

Alibaba Cloud University Official Website (Alibaba Cloud University - Official Website, Innovative Talent Workshop under the Cloud Ecosystem )

Guess you like

Origin http://43.154.161.224:23101/article/api/json?id=324609698&siteId=291194637