react is the most popular frameworks;
Which is the use of thinking mvvm, let us put all the focus only view and logical layers, so you can better write code;
In react in our html structure is through js to achieve, but we are also in nodejs achieved by js service side, we can see the ability js also gradually increases;
The founder react: Facebook; founder of js: Brandon Archer;
Positive preamble:
Want to learn a framework, the most important thing is to understand his thought (jsx, components, react-dom), and his family buckets (react-router-dom, redux), this can be a good use of a framework;
If we do not use the create-react-app (react scaffolding), then we should react to an understanding of the configuration of the environment to do
If we use react the need to introduce three files: react.development.js, react-dom.development.js, babel.min.js, we do not feel that the introduction of multi-file, which is actually a good thing,
If you react to write something less, corresponding to things we have to write a lot, and help us all can think of things, all thought, we only need what they offer on it, but also to help us improve
Development efficiency
The role of react.development.js: react core library
Role react-dom.development.js: Operating dom expansion library provides object of ReactDOM
The role of babel.min.js: jsx js syntax into the syntax, jsx is js expansion syntax, html how to write how to write, js grammar written in the inside {}
These are our most basic library, we have to download any case, the following libraries are optional, but it is also an essential part, if react scaffolding, then do not need to download the above, the following will need to download
prop-types: grammar we want to verify, and restrict data types and default values
react-router-dom: react to achieve a jump of routing plug
redux: is used to communicate between components, but we write in large projects, it is undoubtedly the best choice for small projects, it can not be considered
Achieve initial function
Before starting react, we have to know some things, react development model is based on component-based development model, so we have to know how to define components, as well as due to the use of jsx react syntax to write the js
Code, so we need to define the type of js
Custom Components ways:
1. The function defined in formula :( stateless manner)
2. class definitions :( There are ways the state)
The first case: a display hello world on the page
The second case: nested components
The third case: the communication component (The props)
The fourth case: Use prop-types of components
The fifth case: the wording of event processing
The sixth case: ref use (acquisition element node)
Seventh Case: For the form of special treatment
Eighth case: Life Cycle function
Ninth cases: for loop, and if the condition determination
