├── .gitignore ├── README.md ├── React-cn.md ├── image └── React-cn.png └── xmind └── react.xmind /.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | 3 | ._* 4 | 5 | .idea -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # fe-roadmap 2 | 3 | 前端必备技能清单，思维导图，持续更新... 4 | 5 | ## 已完成 6 | 7 | - [React](https://github.com/ConardLi/fe-roadmap/blob/master/React-cn.md) 8 | 9 | ## todo 10 | 11 | - 前端基础 12 | 13 | - CSS 14 | 15 | - 算法和数据结构 16 | 17 | - Redux 18 | 19 | - React Native 20 | 21 | - Mobx 22 | 23 | - Vue 24 | 25 | - 移动端 26 | 27 | - 客户端 28 | 29 | - ... 30 | 31 | # React 32 | 33 | ![React](./image/React-cn.png) -------------------------------------------------------------------------------- /React-cn.md: -------------------------------------------------------------------------------- 1 | > 图不清楚请右键保存到本地查看 2 | 3 | ![React](./image/React-cn.png) 4 | 5 | 6 | ## 【使用】 7 | 8 | **快速上手React，并了解其中的概念。** 9 | 10 | - [官方教程](https://react.docschina.org/tutorial/tutorial.html) 11 | 12 | - [React入门教程](http://www.ruanyifeng.com/blog/2015/03/react.html) 13 | 14 | - [React.js 小书](http://huziketang.mangojuice.top/books/react/) 15 | 16 | **React文章精读，问题解答。** 17 | 18 | - [React中文社区](http://react-china.org/) 19 | 20 | - [Segmentfault](https://segmentfault.com/t/react.js) 21 | 22 | - [掘金](https://juejin.im/tag/React.js) 23 | 24 | ## 【API】 25 | 26 | **全面浏览API** 27 | 28 | - [官方文档](https://react.docschina.org/) 29 | 30 | - [React](https://react.docschina.org/docs/react-api.html) 31 | 32 | - [Component](https://react.docschina.org/docs/react-component.html) 33 | 34 | - [ReactDOM](https://react.docschina.org/docs/react-dom.html) 35 | 36 | - [DOM](https://react.docschina.org/docs/dom-elements.html) 37 | 38 | - [合成事件](https://react.docschina.org/docs/events.html) 39 | 40 | - [ReactDOMServer](https://react.docschina.org/docs/react-dom-server.html) 41 | 42 | 43 | ## 【状态管理】 44 | 45 | **大型项目必备** 46 | 47 | ### Redux 48 | 49 | - [Redux快速入门](http://www.ruanyifeng.com/blog/2016/09/redux_tutorial_part_one_basic_usages.html) 50 | 51 | - [Redux中文文档](https://cn.redux.js.org/) 52 | 53 | - [Redux源码](https://github.com/reduxjs/redux) 54 | 55 | ### Mobx 56 | 57 | - [Mobx快速入门](https://www.zcfy.cc/article/mobx-ten-minute-introduction-to-mobx-and-react-4306.html?t=new) 58 | 59 | - [Mobx中文文档](https://cn.mobx.js.org/) 60 | 61 | - [Mobx源码](https://github.com/mobxjs/mobx) 62 | 63 | ## 【原理分析】 64 | 65 | **深入理解** 66 | 67 | - [React源码](https://github.com/facebook/react) 68 | 69 | - [React源码解析](https://juejin.im/post/5a84682ef265da4e83266cc4) 70 | 71 | - [React底层揭秘](https://github.com/Bogdan-Lyashenko/Under-the-hood-ReactJS) 72 | 73 | - [React Diff算法](https://zhuanlan.zhihu.com/p/20346379) 74 | 75 | ## 【多端应用】 76 | 77 | ### 移动端 78 | 79 | - [React Native](https://reactnative.cn/) 80 | 81 | ### 桌面端 82 | 83 | - [react-native-windows](https://github.com/Microsoft/react-native-windows) 84 | 85 | - [electron](https://github.com/electron/electron) 86 | 87 | - [electron-react-boilerplate](https://github.com/electron-react-boilerplate/electron-react-boilerplate) 88 | 89 | - [electron-react](https://github.com/ConardLi/electron-react) 90 | 91 | ## 【样式】 92 | 93 | ### CSS预处理 94 | 95 | - [Sass](https://sass-lang.com/) 96 | 97 | - [Less](https://github.com/less/less.js) 98 | 99 | - [stylus](http://stylus-lang.com/) 100 | 101 | ### UI库 102 | 103 | - [ant-design](https://github.com/ant-design/ant-design) 104 | 105 | - [react-bootstrap](https://github.com/react-bootstrap/react-bootstrap) 106 | 107 | 108 | ## 【国际化】 109 | 110 | - [React Intl](https://github.com/yahoo/react-intl) 111 | 112 | ## 【工具库】 113 | 114 | - [Rxjs](https://cn.rx.js.org/) 115 | 116 | - [moment](http://momentjs.cn/) 117 | 118 | - [Lodash](https://www.lodashjs.com/) 119 | 120 | ## 【网络请求】 121 | 122 | ### Rest 123 | 124 | - [fetch](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API) 125 | 126 | - [axios](https://github.com/axios/axios) 127 | 128 | 129 | ### GraphQL 130 | 131 | - [GraphQL](http://graphql.cn/learn/) 132 | 133 | 134 | ## 【性能优化】 135 | 136 | - [react-addons-perf](https://www.npmjs.com/package/react-addons-perf) 137 | 138 | - [性能优化](https://react.docschina.org/docs/optimizing-performance.html) 139 | 140 | - [高性能 React 组件](https://imweb.io/topic/577512fe732b4107576230b9) 141 | 142 | ## 【工程管理】 143 | 144 | ### 代码检测 145 | 146 | - [eslint](https://cn.eslint.org/) 147 | 148 | ### 构建 149 | 150 | - [npm](https://www.npmjs.com/) 151 | - [yarn](https://yarn.bootcss.com/) 152 | - [babel](https://www.babeljs.cn/) 153 | - [webpack](https://www.webpackjs.com/) 154 | 155 | ### 持续集成 156 | 157 | - [jenkins](https://github.com/jenkinsci/jenkins) 158 | 159 | ## 【服务端渲染】 160 | 161 | [ReactDOMServer](https://react.css88.com/docs/react-dom-server.html) 162 | 163 | [Next.js](https://github.com/zeit/next.js/) 164 | -------------------------------------------------------------------------------- /image/React-cn.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ConardLi/fe-roadmap/25fc7615620b863bae13819341ac8981de2f9cc4/image/React-cn.png -------------------------------------------------------------------------------- /xmind/react.xmind: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ConardLi/fe-roadmap/25fc7615620b863bae13819341ac8981de2f9cc4/xmind/react.xmind --------------------------------------------------------------------------------