教程主要会分为六个部分进行讲解,在简要的基础知识准备和开发环境搭建之后,我会分别对 React/Redux/react-router 的关键知识点进行讲解,之后还会介绍到如何在 React 应用中编写样式,在最后一个部分,我们将一同实现一个运用上述 React 技术栈实现的 Todolist 应用。
互联网上什么都有,杂乱无章。信息太多,相当于没有信息,选择太多,相当于没有选择。React 的中文资源比较少,大多数都已经过时,使用的是一两年前的版本,跟不上官方的版本更迭,且有一些中文资料由于翻译的不准确存在一些知识性的错误,很有可能会误导初学者。
中文的学习资源还是太少,而且良莠不齐。国内前端学习者普遍英文水平还不够,况且现在前端发展这么快,等学好英语考过四六级,说不定 React 已经过气了。
另外,网上还没有综合 React 技术栈所有库的最新版本的教程和代码示例。一些教程虽然非常优秀,但随着 React 及相关库的新版本发布,这些教程已经过期,甚至提供的示例代码已经不能正常运行了。
我在准备教程的过程中查阅大量资料,综合了国内外所有优秀的 React 学习资源,萃取其中最精华的知识点,选择最为流行的 React 技术栈,立足最新版本的官网文档,在帮助新手入门上手的同时,也会对一些重要的知识概念进行讲解,满足初级、中级各个学习阶段和水平的同学。
全部采用当前发布的正式版本库进行教学,确保我用起来是这个样子,你学完之后用起来也是这个样子。
想要学习本教程的同学最好对 Javascript 基础知识、ES6 新特性等相关内容掌握了解。熟悉 Javascript 中变量、对象、函数等基本概念,ES6 中 const/class/箭头函数 /解构赋值等新语法的基本使用。
本教程使用的框架版本及软件依赖
框架及库
软件及工具
教程连载发布在我的博客和公众号上:
正在或准备学习 React 的同学可以参考交流一下。
1 tmxklzp 2017-08-30 21:47:42 +08:00 via Android 为余大打 call |
![]() | 2 paledream 2017-08-30 21:50:17 +08:00 最近在学 React,感觉 React 本身不难,难的是 Redux 后理解起来比较绕 |
![]() | 3 liruifengv 2017-08-30 21:50:24 +08:00 via Android 才知道原来博客比公众号早 |
4 fytriht 2017-08-30 22:12:10 +08:00 via iPad 这个目录..... 不如直接看官方文档? |
![]() | 5 KeepPro 2017-08-30 22:20:31 +08:00 via Android 我也感觉。redux 比较绕。最近尝试想用 mobx 作为替代 |
6 feibilanceon OP ![]() @fytriht 内容以及侧重点是不一样的,而且有代码示例,另外官方文档也是我们翻译的,可以在 https://doc.react-china.org 查看。 |
![]() | 7 tyrealgray 2017-08-30 22:26:42 +08:00 如果说是 react 系列的话,感觉可以把 flow 这个库也加上。 |
![]() | 8 codermagefox 2017-08-30 22:27:51 +08:00 已收藏,希望楼主不要断更,萌新前端准备从你的教程入手了. |
9 feibilanceon OP @tyrealgray 嗯,有精力的话,mobx 之类的也会聊聊。 |
10 feibilanceon OP @codermagefox 保证不会断更的。 |
![]() | 11 83f420984 2017-08-30 23:27:41 +08:00 via Android 谢谢,正好在学,收藏了 |
![]() | 12 hamalz 2017-08-31 02:14:15 +08:00 求换背景颜色,黄色有点辣眼睛 |
13 TabGre 2017-08-31 07:57:03 +08:00 via iPhone 原来是我博伦大哥啊 |
![]() | 14 zyc841584303 2017-08-31 08:21:41 +08:00 redux 比较蛋疼 |
![]() | 15 yongjing 2017-08-31 08:50:41 +08:00 楼主的网站 ico 跟 chrome CL1024 插件相似度好高呀 |
16 KnightYoung 2017-08-31 12:55:37 +08:00 提个建议,你的 blog 是否设置了延时滚动?个人感觉体验不是很好,感觉会有一些掉帧.是不是可以考虑去掉? |
17 feibilanceon OP @KnightYoung 嗯,回头我调整一下 |
![]() | 18 t1518968889 2017-09-01 00:02:01 +08:00 via Android 好黄~不忍直视~ |