这是我参与「第五届青训营 」伴学笔记创作活动的第 6 天
前端技术栈之React Ⅰ 青训营笔记
前置知识
学习这些都需要会什么
-
HTML，JS，CSS基础。
-
基础的数据结构/算法知识，如二叉树，深度遍历等。
-
会使用浏览器提供的DOM API 来修改DOM ，更新 UI。
React应用场景
- 前端应用开发，如 Facebook，Instagram，Netflix网页版。
- 移动原生应用开发，如 Instagram，Discord，Oculus。
- 结合Electron，进行桌面应用开发
React的设计思路
原生JS的UI痛点
- 状态更新，UI 不会自动更新，需要手动调用 DOM进行更新。
- 欠缺基本的代码层面的封装和隔离，代码层面没有组建化。
- UI之间的数据依赖关系，需要手动维护，如果依赖链路长，则会遇到 Callback Hell。
React 优势
响应式编程
前端UI
事件 - 执行既定的回调 - 状态变更 - UI更新
- 状态更新，UI自动更新。
- 前端代码组建化，可复用，可封装。
- 状态之间的互相依赖关系，只需声明即可。
组件化总结:
- 组件是组件的组合/原子组件
- 组件内拥有状态，外部不可见
- 父组件可将状态传入组件内部
问题解析
- React属于单向数据流，向下传递
状态管理库
状态管理库，也就是将状态抽离到UI外部进行统一管理。
状态管理库有那些:
- redux
- xstate
- mobx
- recoil
应用级框架科普
- NEXT.js 硅谷明星创业公司 Vercel 的React 开发框架，稳定，开发体验好，支持 Unbundled Dev ， SWC 者快速完成部署。
- MODERN.js 字节跳动 Web Infra 团队研发的全栈开发框架，内置了很多开箱即用的能力与最佳实践，可以减少很多调研选择工具时间。
- Blitz 无 API 思想的全栈开发框架，开发过程中无需写API 调用与 CRUD 逻辑，适合前后端紧密结合的小团队项目。
React 与 Vue 区别
React 跟vue都是用于构建UI界面目前比较流行的框架。
渲染:
- vue 的渲染是基于模板(Temple)，写起来像是Html，对新手比较友好。
- React 是使用js 通过嵌套的React.createElement来描述DOM。React 推出了 JSX ，JSX要比Temple要灵活一些
React 要比 Vue 流行 React 是大公司开源框架，背后有大团队进行维护。vue对新手比较友好更规范。React更加灵活，周边库选择比较多。
部分是网上自己查阅 ，有不对的地方望理解。
