🌈React的优点
学习简单
学完ES6+或TS基本语法再过一遍React官方文档即可进入简单的开发
语法简洁
React对TS有着近乎完美的支持度和Eslint的编辑器友好.与Vue需要记一大堆API不同的是React几乎没有API也没有类似Vue3中的setup等啰嗦的东西,更加极客,适合治疗代码强迫症.
生态丰富
无论国内外大厂,React的采样率都是三大框架中最高的,所以其生态也是非常强大的,与Vue的生态基本不相上下,远超Angular,比如支持小程序开发的Taro,支持移动端开发的React Native等,基本开发中要用到的东西都有开源实现的方案
这里吐槽一下Angular的生态,其实与Nestjs能结合最好的本来应该是NG,NG其实框架本身的工程化做的还不错,但是连小程序和APP都写不了的东东算前端吗？目前React有Taro和RN,Vue有Uni,而NG小程序就算了,连写个APP都只能用IONIC这种webview或者满是BUG的NativeScript聊以自慰,也是服了...
社区庞大
因为是三大框架中全球用户最多的,所以社区庞大,爬坑最容易,一般找生态,查问题,基本谷歌一下,各种stackoverflow,github issue,medium,dev.to等各种社区会报出最准确的解决方案.
🌧React缺点
React最大的缺点在于过于灵活,一大堆杂七杂八的状态管理,有时候会导致选择障碍,路由也是组件实现,需要配置式必须要自己封装,并且工程化团队开发困难,NG虽然工程化比较好,但生态的落差基本直接弃.React还有一个缺点就是移动端好用的UI库并不多,而上述问题Vue都解决的不错,比如拥有官方的vuex和配置式的vue router以及类似Vant这种现象级别的移动组件库.所以站长建议最好有时间把两者都学习一下,那么在开发的时候就可以灵活选择.
✍️目标学者
本教程适合以下朋友学习
👉 前端入门者: 已经学习过TS和ES6的基础知识,需要快速学习一个前端框架
👉 React初学者: 已经学会了各种React知识希望有一套能进行项目实战练习的教程
👉 Vue开发者: 觉得Vue3太啰嗦不够Geek或者对TS和编辑器支持度有强迫症想尝试一下新东西
👉 Angular开发者: 想开发一下小程序或者移动APP
👉 Jquery为主的传统MVC开发者: Jquery+PHP/ROR写腻了? 那么就来追一下潮流哈
👉 Gopher,Javaer等职业后端: 想成为全栈开发者或者至少不再与前端争论对错和扯皮,自己能看懂前端代码,那么本教程正适合你
👀教程内容
本教程是一套从React入门到项目实战的全解析教程.内容涉及React的几乎所有知识以及Spa后台和SSR网站两个实战案例的开发等,非常全面地讲解React+TS项目开发中的方方面面,使大家能全面深入的掌握React及其周边的生态.
Spa应用的脚手架选择更好更快的vitejs,SSR应用的脚手架选择next.js.为了教程更轻量易懂,我们直接略过传统的Class组件,而直接全部使用函数组件讲解,后续所有React系列的教程也全部使用函数组件.并且为了与本站其它教程相对应,本站所有的前端/Node教程全部使用Typescript讲解.
🌒知识点
- React+TS+Vitejs的开发环境构建
- 掌握React开发的绝大部分技术
- 灵活的使用Hooks以及编写自定义的Hooks
- React Router的深度配置化封装以及懒加载实现
- 学会使用Reducer+Context封装轻量级的状态管理
- 掌握Redux与Mobx两种模式来进行全局的状态管理
- 全面掌握React Router的使用和配置化封装
- 学会css in js等多种css模式的使用
- 使用Antd Components快速构建布局和表单
- 使用localforage构建本地化数据缓存
- 使用umi request进行与后端的数据互交
- 动态暗黑模式和实时皮肤切换实现
- 登录手机认证,社会化认证和验证码实现
- 动态权限路由与菜单的生成
- 图片上传以及区块拖动等常用组件的使用
- Antd Charts实现数据可视化
- TailWindCss与Material ui的使用
- SSR原理以及React手动构建SSR应用
- 完全掌握Nextjs框架的使用
- 初步学会使用Mobx进行状态管理
- 学会使用swr.js来和后端进行数据互交
- Monorepo和同构架构的实现
🔥后续可期待
后面我们还会围绕着《精通React》这个系列制作其它教程,大概有以下几个内容
- React+Electron桌面应用开发
- Taro+RN开发跨端应用
- React原理与实现
希望大家喜欢