如果你想全面的学习React的知识，可以安装这篇文章的顺序进行学习，这个从基础到实战都有了，如果你全部学完，一定对React有一个全面了解。

从这里开始学习吧。

• 011、React课程前言:https://jspang.com/detailed?id=46#toc21
• 012、React简介和Vue对比:https://jspang.com/detailed?id=46#toc28
• 013、React开发环境搭建:https://jspang.com/detailed?id=46#toc212
• 014、脚手架生成的项目目录介绍:https://jspang.com/detailed?id=46#toc216
• 015、HelloWorld和组件的讲解:https://jspang.com/detailed?id=46#toc220
• 016、React中JSX语法简介:https://jspang.com/detailed?id=46#toc223
• 017、React实例-小姐姐服务菜单:https://jspang.com/detailed?id=46#toc227
• 018、React实例-宝剑磨的好,理论不能少:https://jspang.com/detailed?id=46#toc231
• 019、React实例-老板我要加个钟:https://jspang.com/detailed?id=46#toc238
• 020、React实例-宝剑虽然好 老腰受不了:https://jspang.com/detailed?id=46#toc28
• 021、React进阶-JSX防踩坑的几个地方:https://jspang.com/detailed?id=46#toc242
• 022、React进阶-Simple React Snippets:https://jspang.com/detailed?id=46#toc247
• 023、React进阶-组件的拆分:https://jspang.com/detailed?id=46#toc250
• 024、React进阶-父子组件的传值:https://jspang.com/detailed?id=46#toc252
• 025、React进阶-单项数据流和其他:https://jspang.com/detailed?id=46#toc255
• 026、React高级-调试工具的安装及使用:https://jspang.com/detailed?id=46#toc259
• 027、React高级-PropTypes校验传递值:https://jspang.com/detailed?id=46#toc263
• 028、React高级-ref的使用方法:https://jspang.com/detailed?id=46#toc265
• 029、React高级-生命周期讲解-1:https://jspang.com/detailed?id=46#toc268
• 030、React高级-生命周期讲解-2:https://jspang.com/detailed?id=46#toc272
• 031、React高级-生命周期讲解-3:https://jspang.com/detailed?id=46#toc277
• 032、React高级-生命周期改善程序性能:https://jspang.com/detailed?id=46#toc279
• 033、React高级-axios数据请求:https://jspang.com/detailed?id=46#toc282
• 034、React高级-Axios请求EasyMock:https://jspang.com/detailed?id=46#toc286
• 035、React高级-用CSS3实现react动画:https://jspang.com/detailed?id=46#toc289
• 036、React高级-CSS3的keyframes动画:https://jspang.com/detailed?id=46#toc293
• 037、React高级-react-transition-group:https://jspang.com/detailed?id=46#toc297
• 038、React高级-多DOM动画制作和编写:https://jspang.com/detailed?id=46#toc2100

• 039、基础-认识Redux和文章介绍:https://jspang.com/detailed?id=48#toc21
• 040、基础-Redux工作流程:https://jspang.com/detailed?id=48#toc26
• 041、基础-Ant Design介绍和环境初始化:https://jspang.com/detailed?id=48#toc29
• 042、基础-用Ant Design制作UI界面:https://jspang.com/detailed?id=48#toc213
• 043、基础-创建Redux中的仓库-store和reducer:https://jspang.com/detailed?id=48#toc218
• 044、基础-Redux Dev Tools的安装:https://jspang.com/detailed?id=48#toc222
• 045、基础-通过Input体验Redux的流程:https://jspang.com/detailed?id=48#toc225
• 046、基础-Redux制作ToDoList列表:https://jspang.com/detailed?id=48#toc230
• 047、基础-用Redux实现ToDoList的删除功能:https://jspang.com/detailed?id=48#toc234
• 048、基础-工作中写Redux的小技巧-1:https://jspang.com/detailed?id=48#toc238
• 049、基础-工作中写Redux的小技巧-2:https://jspang.com/detailed?id=48#toc242
• 050、加餐-Redux填三个小坑:https://jspang.com/detailed?id=48#toc246
• 051、进阶-组件UI和业务逻辑的拆分方法:https://jspang.com/detailed?id=48#toc250
• 052、进阶-填坑和Redux中的无状态组件:https://jspang.com/detailed?id=48#toc254
• 053、进阶-Axios异步获取数据并和Redux结合:https://jspang.com/detailed?id=48#toc257
• 054、进阶-Redux-thunk中间件的安装和配置:https://jspang.com/detailed?id=48#toc261
• 055、进阶-Redux-thunk中间件的安装和配置:https://jspang.com/detailed?id=48#toc264
• 056、进阶-Redux-saga的安装和配置:https://jspang.com/detailed?id=48#toc266
• 057、进阶-用Redux-saga获取TodoList列表:https://jspang.com/detailed?id=48#toc270
• 058、进阶-React-Redux介绍和安装:https://jspang.com/detailed?id=48#toc273
• 059、进阶-React-redux中的Provider和connect:https://jspang.com/detailed?id=48#toc278
• 060、进阶-React-redux的数据修改:https://jspang.com/detailed?id=48#toc282
• 061、进阶-React-redux增加List数据:https://jspang.com/detailed?id=48#toc286
• 062、加餐-React-redux程序优化(完结):https://jspang.com/detailed?id=48#toc290

• 063、React Router 安装和基础环境搭建:https://jspang.com/detailed?id=49#toc21
• 064、像制作普通网页一样使用ReactRouter:https://jspang.com/detailed?id=49#toc25
• 065、ReactRouter动态传值-1:https://jspang.com/detailed?id=49#toc210
• 066、ReactRouter动态传值-2:https://jspang.com/detailed?id=49#toc214
• 067、ReactRouter重定向-Redirect使用:https://jspang.com/detailed?id=49#toc216
• 068、实例-ReactRouter嵌套路由-1:https://jspang.com/detailed?id=49#toc219
• 069、实例-ReactRouter嵌套路由-2:https://jspang.com/detailed?id=49#toc223
• 070、实例-ReactRouter嵌套路由-3:https://jspang.com/detailed?id=49#toc227
• 071、后台动态获取路由进行配置:https://jspang.com/detailed?id=49#toc231

• 072、React Hooks介绍和环境搭建:https://jspang.com/detailed?id=50#toc21
• 073、useState 的介绍和多状态声明:https://jspang.com/detailed?id=50#toc25
• 074、useEffect代替常用生命周期函数:https://jspang.com/detailed?id=50#toc28
• 075、useEffect 实现 componentWillUnmount生命周期函数:https://jspang.com/detailed?id=50#toc212
• 076、useContext 让父子组件传值更简单:https://jspang.com/detailed?id=50#toc215
• 077、useReducer介绍和简单使用:https://jspang.com/detailed?id=50#toc218
• 078、useReducer代替Redux小案例-1:https://jspang.com/detailed?id=50#toc221
• 079、useReducer代替Redux小案例-2:https://jspang.com/detailed?id=50#toc225
• 080、useMemo优化React Hooks程序性能:https://jspang.com/detailed?id=50#toc228
• 081、useRef获取DOM元素和保存变量:https://jspang.com/detailed?id=50#toc231
• 082、自定义Hooks函数获取窗口大小:https://jspang.com/detailed?id=50#toc234

• 083、Next.js简介和创建项目:https://jspang.com/detailed?id=51#toc21
• 084、creact-next-app快速创建Next.js项目:https://jspang.com/detailed?id=51#toc26
• 085、Next.js的Page和Component的使用:https://jspang.com/detailed?id=51#toc210
• 086、路由-基础和基本跳转:https://jspang.com/detailed?id=51#toc213
• 087、路由-跳转时用query传递和接受参数:https://jspang.com/detailed?id=51#toc216
• 088、路由-六个钩子事件的讲解:https://jspang.com/detailed?id=51#toc220
• 089、在getInitialProps中用Axios获取远端数据:https://jspang.com/detailed?id=51#toc226
• 090、使用Style JSX编写页面的CSS样式:https://jspang.com/detailed?id=51#toc229
• 091、Lazy Loading实现模块懒加载:https://jspang.com/detailed?id=51#toc233
• 092、自定义Head 更加友好的SEO操作:https://jspang.com/detailed?id=51#toc236
• 093、Next.js框架下使用Ant Design UI:https://jspang.com/detailed?id=51#toc239
• 094、Next.js生产环境打包（完结）:https://jspang.com/detailed?id=51#toc242

更新完成

目前我的博客就是用的这个程序,预览页面

• 095、博客实战的课程介绍:https://jspang.com/detailed?id=52#toc21
• 096、项目前端基础开发环境搭建:https://jspang.com/detailed?id=52#toc25
• 097、制作博客公用头部并形成组件:https://jspang.com/detailed?id=52#toc210
• 098、完成首页主体的两栏布局:https://jspang.com/detailed?id=52#toc213
• 099、利用List组件制作博客列表:https://jspang.com/detailed?id=52#toc217
• 100、编写“博主介绍”组件:https://jspang.com/detailed?id=52#toc220
• 101、编写“通用广告”组件:https://jspang.com/detailed?id=52#toc224
• 102、博客列表页面快速制作:https://jspang.com/detailed?id=52#toc228
• 103、博客详细页面制作1-编写基本页面结构:https://jspang.com/detailed?id=52#toc231
• 104、博客详细页面制作2-解析Markdown语法:https://jspang.com/detailed?id=52#toc233
• 105、博客详细页面制作3-Markdown导航制作:https://jspang.com/detailed?id=52#toc238
• 106、中台搭建1-安装egg.js开发环境:https://jspang.com/detailed?id=52#toc241
• 107、中台搭建2-egg.js目录结构和约定规范:https://jspang.com/detailed?id=52#toc244
• 108、中台搭建3-RESTful API设计简介和路由配置:https://jspang.com/detailed?id=52#toc247
• 109、中台搭建4-Egg.js中连接mysql数据库:https://jspang.com/detailed?id=52#toc250
• 110、中台搭建5-数据库设计和首页接口制作:https://jspang.com/detailed?id=52#toc256
• 111、前中台结合1-前台读取首页文章列表接口:https://jspang.com/detailed?id=52#toc259
• 112、前中台结合2-文章详细页面接口制作展示:https://jspang.com/detailed?id=52#toc264
• 113、解决egg.js的跨域问题:https://jspang.com/detailed?id=52#toc268
• 114、重构前台博客详细页面1-marked+highlight:https://jspang.com/detailed?id=52#toc272
• 115、重构前台博客详细页面2-实现文章导航:https://jspang.com/detailed?id=52#toc276
• 116、前台文章列表页的制作1-接口模块化和读取文章分类:https://jspang.com/detailed?id=52#toc279
• 117、前台文章列表页的制作2-根据类别读取文章列表:https://jspang.com/detailed?id=52#toc284
• 118、让前台所有页面支持Markdown解析:https://jspang.com/detailed?id=52#toc288
• 119、后台开发01-开发环境搭建:https://jspang.com/detailed?id=52#toc290
• 120、后台开发02-页面路由配置:https://jspang.com/detailed?id=52#toc293
• 121、后台开发03-编写登录界面:https://jspang.com/detailed?id=52#toc296
• 121、后台开发04-UI框架搭建:https://jspang.com/detailed?id=52#toc2100
• 122、后台开发05-添加文章页面制作1:https://jspang.com/detailed?id=52#toc2103
• 123、后台开发06-添加文章页面制作2:https://jspang.com/detailed?id=52#toc2106
• 124、后台开发07-Markdown编辑器制作:https://jspang.com/detailed?id=52#toc2110
• 125、后台开发08-编写service登录接口:https://jspang.com/detailed?id=52#toc2115
• 126、后台开发09-实现前台登录操作:https://jspang.com/detailed?id=52#toc2119
• 127、后台开发10-中台路由守卫制作:https://jspang.com/detailed?id=52#toc2123
• 128、后台开发11-读取添加文章页面的类别信息:https://jspang.com/detailed?id=52#toc2127
• 129、后台开发12-添加文章的方法(上):https://jspang.com/detailed?id=52#toc2132
• 130、后台开发13-添加文章的方法(中):https://jspang.com/detailed?id=52#toc2137
• 131、后台开发14-添加文章的方法(下):https://jspang.com/detailed?id=52#toc2137
• 132、后台开发15-文章列表制作(上):https://jspang.com/detailed?id=52#toc2146
• 133、后台开发16-文章列表制作(中):https://jspang.com/detailed?id=52#toc2149
• 134、后台开发17-删除文章:https://jspang.com/detailed?id=52#toc2153
• 135、后台开发18-修改文章（上）:https://jspang.com/detailed?id=52#toc2157
• 136、后台开发19-修改文章（下）:https://jspang.com/detailed?id=52#toc2161
• 137、博客部署介绍和演示:https://jspang.com/detailed?id=52#toc2164