这是我参与[第五届青训营]伴学笔记创作活动的第8天，和大家分享自己学习《响应式系统与 React》章节课程的收获。

一、本堂课重点内容

• 前端应用开发历程
• 移动原生应用开发
• 结合Electron的桌面应用开发

二、详细知识点介绍

1.React运用

• 前端应用开发
• 移动原生应用开发
• 结合Electron进行桌面应用开发

2.React的设计思路

（1）UI编程痛点

• 状态更新，UI不会自动更新，需要手动地调用DOM进行更新
• 欠缺基本的代码层面的封装和隔离，代码层面没有组件化
• UI之间的数据依赖关系，需要手动维护，如果依赖链路长，则会遇到问题

（2）响应式与转换式

• 响应式系统：监听事件、消息驱动、监控系统、UI界面
• 转换式系统：给定输入求解输出、编译器、数值计算

（3）响应式编程的优点

• 状态更新，UI自动更新
• 前端代码组件化，可复用，可封装
• 状态之间的相互依赖关系，只需声明即可

(4)组件化

• 组件是组件的组合/原子组件
• 组件内拥有状态，外部不可见
• 父组件可将状态传入组件内部
• 组件声明了状态和UI的映射
• 组件有Props/State两种状态
• 组件可由其他组件拼装而成
• 组件内部拥有私有状态State
• 组件接受外部的Props状态提供复用性
• 根据当前的State/Props，返回一个UI

3.React的写法

4.React的实现

虚拟DOM赋予了React声明式的API,使得编程者从属性操作、事件处理和手动DOM更新这些在构建应用程序时必要的操作中解放出来。

5.React状态管理库

• 核心思想：将状态抽离到UI外部进行统一管理
• 状态机：当前状态下，收到外部事件，迁移到下一个状态

6.应用级框架科普

• NEXT.JS
• MODERN.JS
• Blitz