Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/numbbbbb/read-react-source-code
Record what I learn after reading React source code
https://github.com/numbbbbb/read-react-source-code
Last synced: 5 days ago
JSON representation
Record what I learn after reading React source code
- Host: GitHub
- URL: https://github.com/numbbbbb/read-react-source-code
- Owner: numbbbbb
- Created: 2017-07-31T02:17:25.000Z (over 7 years ago)
- Default Branch: master
- Last Pushed: 2018-12-07T14:40:12.000Z (almost 6 years ago)
- Last Synced: 2024-02-17T08:34:30.515Z (9 months ago)
- Size: 33.2 KB
- Stars: 589
- Watchers: 21
- Forks: 52
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Read React Source Code
## Why
Okay, imagine you find a new framework, let's say it's React. You Google the tutorials, build a HelloWorld project and start to use it in company projects.
Now you are familiar with that framework, what should you do?
There are several choices. But for me, I just want to down the rabbit hole and see what's beneath the surface.
How do setState works?
How to design the lifecycle and what's the right time for hooks?
How to organize such a big project?
What's the right way to test it?
Why or why not to have that feature?
In order to answer those questions, I decided to read the source code. The best way to learn is to teach, so I write this series to show you how I read the code and what I got from it.
## How to Read This Series
Even if you can just read and see what I found, I highly recommend you to try it by yourself. You need to get your hands dirty to really learn something.
I will record the actions I take, like **download source code from xxx** and **go to file xxx and find xxx**. You can replay them by yourself.
In this series, I won't try to explain everything. My purpose is to help you understand React's structure and how it works. I will leave some functions or files for you to read in practice sections.
If you have any questions and advice, feel free to contact with me! You can use issue as comment, or email me at *[email protected]*.
## Who This Series is For
Everyone who is familiar with web frontend development can read this series.
If this is your first time reading source code, you can learn how to read them.
If you are a React user you can understand the daily used framework well.
If you have read the source code by yourself, you can check whether I'm right, and maybe you can get a different view.
Feel exciting? Okay, here we go!
## Contents
- [Start with the Messy Build Process](https://github.com/numbbbbb/read-react-source-code/blob/master/01-start-with-the-messy-build-process.md)
- [How Render Works](https://github.com/numbbbbb/read-react-source-code/blob/master/02-how-render-works.md)
- [How `setState()` Works - part 1](https://github.com/numbbbbb/read-react-source-code/blob/master/03-how-setstate-works-part-1.md)
- [How `setState()` Works - part 2](https://github.com/numbbbbb/read-react-source-code/blob/master/04-how-setstate-works-part-2.md)
- [How `setState()` Works - part 3](https://github.com/numbbbbb/read-react-source-code/blob/master/05-how-setstate-works-part-3.md)
- [Events](https://github.com/numbbbbb/read-react-source-code/blob/master/06-event.md)
- [React vs Vue](https://github.com/numbbbbb/read-react-source-code/blob/master/07-react-vs-vue.md)
- [Conclusion](https://github.com/numbbbbb/read-react-source-code/blob/master/08-conclusion.md)
## License
[CC BY-SA 4.0](https://creativecommons.org/licenses/by-sa/4.0/)