01 React 的历史与应用
React的应用
- 前端应用开发，如Facebook，Instagram,Netflix网页版。
- 移动原生应用开发，如lnstagram，Discord，Oculus。
- 结合Electron，进行桌面应用开发。
为什么要了解React的历史？
往往是因为，一个东西出现在某个历史阶段，人们产生了某种需求。如果不了解这种需求，就去学习，其实是不理解的。
2010年Facebook在其 php 生态中，引入了xhp 框架，首次引入了组合式组件的思想，启发了后来的 React 的设计。
2011年Jordan Walke 创造了FaxJS，也就是后来的 React原型
2012年 在Facebook 收购Instagram后，该FaxJS 项目在内部得到使用，Jordan Walke 基于 FaxJS 的经验创造了React
2013年React正式开源
2014年-今天 生态大爆发，各种围绕React 的新工具/新框架开始涌现
02 React的设计思路
UI编程的痛点
1.状态更新，UI不会自动更新，需要手动地调用DOM进行更新。
（什么是状态？状态就是自己声明的变量，自己要去维护一些状态，就要去声明一些变量）
2.欠缺基本的代码层面的封装和隔离，代码层面没有组件化。
3.UI之间的数据依赖关系，需要手动维护，如果依赖链路长，则会遇到“Callback Hell”。
（数据依赖关系？当某个东西改变，另外一些东西也要跟着改变）
转换式系统
给定输入求解输出
响应式系统
监听事件、消息驱动
事件——执行回调——状态变更——UI更新
响应式编程
-
状态更新，UI自动更新
-
代码组件化，可复用、可封装
-
状态之间的依赖，只需声明即可
组件化
1.组件是组件的组合/原子组件
2.组件内拥有状态，外部不可见
3.父组件可将状态传入组件内部
组件设计
1.组件声明了状态和UI的映射。
2.组件有Props/State两种状态。
3.“组件”可由其他组件拼装而成。
03 React的实现
问题
1、JSX不符合JS标准语法
2、返回的JsX发生改变时，如何更新DOM
3、State/Props更新时，要重新触发render函数
VDOM
Virtual DOM是一种用于和真实DOM同步，而在JS内存中维护的一个对象，它具有和DOM类似的树状结构，并和DOM可以建立——对应的关系。
04 React状态管理库
核心思想——将状态抽离到U外部进行统一管理
几个状态管理库：redux xstate mobx recoil
05 应用级框架科普
1 NEXT.JS
硅谷明星创业公司Vercel的 React 开发框架，稳定，开发体验好，支持Unbundled Dev，SWC等，其同样有Serverless一键部署平台帮助开发者快速完成部署。
2 MODERN.JS
字节跳动Web Infra团队研发的全栈开发框架，内置了很多开箱即用的能力与最佳实践，可以减少很多调研选择工具的时间。
3 Blitz
无API思想的全栈开发框架，开发过程中无需写API 调用与CRUD逻辑,适合前后端紧密结合的小团队项目。
