The React. Js little book

Reac.js is a small book

Please indicate the source, keep the original link and author information

Online reading: huziketang.com/books/react…

Introduction to the

This is a little book about React. Js.

Because I have been using React. Js in my work, I want to summarize my knowledge and experience about React. I took a few ideas and wrote them down into an open source, free, professional, simple entry level book for the community. I hope I can help more people who are just getting started with React.

Due to the limited level, there will inevitably be many mistakes in the process of writing. I hope you can send a Pull Request to the project on Github if you find any problems in the process of reading. I sincerely hope that more people can participate in the compilation of this book.

(A future video version of the book may follow, so stay tuned.)

This book introduces

This book is written for students who have a bit of a front-end foundation and zero foundation in react. js to help them master react. js and flexibly apply it to real projects. If you have some basic HTML, CSS, or JavaScript and want to learn React. Js, but find some concepts in React. However, if you are already familiar with the front end and have used a lot of front-end frameworks and componentization techniques, you are advised to go directly to the official documentation.

This book will not document all the knowledge points, but will only extract the basic, important and frequent knowledge of actual combat experience and focus on the explanation, so that you can understand the most needed reac.js knowledge and routine in actual combat with the least effort, and travel lightly. If you need more comprehensive knowledge, you can refer to more official documents or other rich materials.

In addition, the book is written in ECMAScript 2015. Make sure you have mastered the basic syntax of ECMAScript 2015 before you read it, otherwise it will be very difficult to read.

This book is initially divided into three stages, each stage will be the final actual combat analysis, the knowledge of the stage to apply.

Stage 1: I hope to help readers grasp the basic concepts and knowledge of React. Js. Including the root cause of the problem: front-end component reusability issues, data and view synchronization issues. Learn the basics of React. Js, including JSX, event listeners, State, props, and list rendering. See how React. Js solves these problems. At the end of this phase, readers can use React. Js to build simple page functions.

Phase 2: Give readers a better understanding of React. Js, including component lifecycle and what it means, advanced concepts of state and props, props validation and what it means, advanced component composition, how to work with DOM, and start introducing front-end application state management issues.

The third stage: let readers master the more advanced concepts of React. Js, including higher-order components and context. And try to introduce React-Router and Redux to help us build a relatively complete front-end application. We’ll also begin an in-depth discussion of front-end application state management.

directory

The first stage

  • Lesson 1-react.js
  • Lesson 2 – Front-end Componentization (I) : Start with a simple example
  • Lesson 3 – Front-end componentization (II) : Optimize DOM operations
  • Lesson 4 – Front End Componentization (III) : Abstract out common component classes
  • Lesson 5-react. js Basic environment installation
  • Lesson 6 – Describe UI information using JSX
  • Lesson 7 – The render method of a component
  • Lesson 8 – Composition, nesting, and tree of components
  • Lesson 9 – Event Listening
  • Lesson 10 – Component state and setState
  • Lesson 11 – Configuring the props of the component
  • Lesson 12 – state vs props
  • Lesson 13 – Render list data
  • Lesson 14
  • Lesson 15
  • Lesson 16

Second stage

  • Lesson 17 – Front-end application State Management – State improvement
  • Lesson 18 – Component Life Cycle in mount Phase (I)
  • Lesson 19 – Component Life Cycle in mount Phase (II)
  • Lesson 20 – Component life cycle of the update phase
  • DOM manipulation in Lesson 21-ref and react.js
  • Lesson 22-props. Children and container class components
  • Lesson 23 – dangerouslySetHTML and style properties
  • Lesson 24-PROPTypes and component parameter validation
  • Lesson 25
  • Lesson 26
  • Lesson 27

The third stage

  • Lesson 28 — Higher-order Components
  • Lesson 29-react. js context
  • Lesson 30 – Redux (I) : Gracefully modify shared state
  • Lesson 31 – Implementing Redux (2) : Extract store and monitor data changes
  • Introduction to Redux (iii) : Pure Functions
  • Lesson 33 – Implementing Redux (4) : Sharing structured objects improves performance
  • Lesson 34 – Implementing Redux (v) : Don’t ask why reducer
  • Lesson 35 – Implementing Redux (VI) : Summary of Redux
  • .

Special thanks to

Special thanks to the following friends for their proofreading of this book and their valuable suggestions for improvement:

  • Kuang Weike – Tencent Web front-end Engineer
  • Yang Haibo – Senior Front End Engineer of Baidu Web
  • Junling Xie – Tmall Web front-end engineer
  • Jiahua Dai – former wechat Web front-end engineer

Contact the author

  • Email address: [email protected]
  • Zhihu: @Beard big ha
  • Column: @front end big ha
  • Join the React. Js Little Book reader community to discuss, communicate, and learn about front-end technologies.

License

This work is licensed under the Attribution-No Deduction 4.0 International License