Make writing a habit together! This is my first day to participate in the “Gold Digging Day New Plan ยท April More text challenge”, click to see the details of the activity.

preface

React 18.0 has been out for two weeks

So I took some time to go through React completely these two days

I have compiled all the contents into the following 86 brain maps for future reference

Attached with original images and source files:

The original image and source files (including Xmind and POS files) have been uploaded to Github and can be downloaded if necessary

86 brain figure

1. Install

2. Core concepts

JSX profile

2.2 Element Rendering

2.3 Components & Props

2.4.1State & Life cycle

2.4.2 Data Flow and proper use of State

2.5 Event Handling

2.6 Conditional Rendering

2.7 List & Key

2.8 the form

2.9 Status Improvement

2.10 Composition vs. Inheritance

2.11 the React philosophy

3. Advanced Guidelines

3.1 Accessibility auxiliary functions

3.2 Code Segmentation

3.3.1 the Context

3.3.2 rainfall distribution on 10-12 Context API

3.4 Error boundaries

3.5 Refs forward

3.6 Fragments could

3.7 Advanced Components

3.8.1 Integrate plug-ins with DOM manipulation

3.8.2 Collaboration with other third-party libraries

3.9.1 JSX nature

3.9.2JSX Specifies the React element type

3.9.3 Specifying props in JSX

3.9.4 Child elements in JSX

3.10.1 Production version with optimized performance

3.10.2 Using Chrome Performance to Analyze Components

3.10.3 Analyze components using the profiler in developer tools

3.10.4 Other Optimizations

3.11 Portals

3.12 Profiler API

3.13 ES6 Is Not Used

3.14 JSX is not used

[3.15 coordinate

3.16 Refs & DOM

3.17 Render Props

3.18.1 Flow for Static Type checking

3.18.2 TypeScript for static type checking

3.18.2 Others of static Type Checking

3.19 Strict mode

3.20 Use PropTypes for type checking

3.21 Uncontrolled Components

3.22 Web Components

4. The API reference

4.1.1React Top-level API Overview

4.1.2React Top-level API reference

4.1.3React Top-level API Reference 2

4.2.1React.Com ponent of overview

4.2.2 Common life cycle methods

4.2.3 Uncommon lifecycle methods

4.2.4 other apis

4.2.5Class Attributes and Instance Attributes

4.3 ReactDOM

4.4 ReactDOMClient

4.5 ReactDOMServer

4.6 the DOM elements

4.7.1 Composite Events

4.7.2 Supported Events

4.7.3 Supported Event 2

4.7.4 Supported Event 3

4.8 the Test Utilities

4.9 Test the Renderer

4.10JS Environment Requirements

4.11 the React terms

5. Hook

5.1 introduction of Hook

5.2 an overview of the Hook

5.3 Use State Hook

5.4 Using Effect Hook

5.5 Hook rules

5.6 the custom

Hook API

5.8.1 Adoption strategy of Hooks FAQ

5.8.2Hooks FAQ on migrating from Class to Hook

5.8.3Hooks FAQ performance optimization

5.8.4Hooks FAQ Underlying principles

Test 6.

6.1 Test Overview

6.2 Test Techniques

6.3 Test Environment

7. FAQ

7.1 the AJAX and APIs

7.2Babel, JSX and the construction process

7.3 Passing functions to components

[7.4 Component Status.png

7.5 Styles and CSs.png

7.6 Project file Structure

7.7Virtual DOM and kernel

conclusion

That is all the content of this article, if you have questions, please point out ๐Ÿ’•