# Awesome

## 最佳实践

* [React + Redux 最佳实践](https://github.com/sorrycc/blog/issues/1)
* [Redux 最佳实践-译](https://segmentfault.com/a/1190000005757189?utm_source=tuicool&utm_medium=referral)
* [Lean React](https://segmentfault.com/a/1190000005136764)

## React

> React

* [react](https://facebook.github.io/react/index.html)
* [react 中文文档](http://reactjs.cn/react/index.html)
* [react cheatsheets](http://ricostacruz.com/cheatsheets/react.html)
* [awesome-react](https://github.com/enaqx/awesome-react)
* [react-demos](https://github.com/ruanyf/react-demos)
* [A Compact React Cookbook](https://blog.oyanglul.us/javascript/react-cookbook-mini.html?hmsr=toutiao.io&utm_medium=toutiao.io&utm_source=toutiao.io)
* [React 入门实例教程](http://www.ruanyifeng.com/blog/2015/03/react.html)
* [React 入门教程](https://hulufei.gitbooks.io/react-tutorial/content/)
* [React 和 Webpack 小书](https://fakefish.github.io/react-webpack-cookbook/index.html)
* [React.js 最佳实践(2016)_链接修正版](https://segmentfault.com/a/1190000004685622)
* [精益 React 学习指南 （Lean React）序](https://segmentfault.com/a/1190000005136764)
* [react-ie8](https://github.com/xcatliu/react-ie8)
* [react-devtools](https://github.com/facebook/react-devtools)
* [react-monocle](https://github.com/team-gryff/react-monocle)
* [Immutable 详解及 React 中实践](https://github.com/camsong/blog/issues/3)
* [React-Tutorial-Collect](https://github.com/OXOYO/F2E-Tutorial-Collect/blob/master/React.md)
* [组件间的通信](http://reactjs.cn/react/tips/communicate-between-components.html)
* [React 组件之间如何交流](http://www.tuicool.com/articles/AzQzEbq)
* [react-howto](https://github.com/petehunt/react-howto)
* [webpack + react 优化：缩小js包体积](http://blog.csdn.net/code_for_free/article/details/51583737)
* [如何十倍提高你的webpack构建效率](http://blog.csdn.net/u011413061/article/details/51872412)
* [webpack 常用插件](http://www.tuicool.com/articles/auiMnuM)
* [webpack 插件： html-webpack-plugin](http://www.cnblogs.com/haogj/p/5160821.html)
* [webpack使用优化（基本篇）](https://github.com/lcxfs1991/blog/issues/2)

> React Router

* [react-router](https://github.com/reactjs/react-router)
* [react-router 官方文档](https://github.com/reactjs/react-router/tree/master/docs)
* [react-router 官方文档中文版](http://react-guide.github.io/react-router-cn/)
* [react-router cheatsheets](http://ricostacruz.com/cheatsheets/react-router.html)
* [React Router 使用教程](http://www.ruanyifeng.com/blog/2016/05/react_router.html)
* [react-router的实现原理](http://zhenhua-lee.github.io/react/history.html)

> React Redux

* [redux](https://github.com/reactjs/redux/)
* [redux 官方文档](http://redux.js.org/)
* [redux - 官方文档中文版](http://cn.redux.js.org/)
* [Leveling Up with React: Redux](https://css-tricks.com/learning-react-redux/)
* [An Introduction To Redux](https://www.smashingmagazine.com/2016/06/an-introduction-to-redux/)
* [Getting Started with Redux](https://egghead.io/courses/getting-started-with-redux)
* [Redux 使用说明文档](http://wenku.baidu.com/link?url=RbXh-mhYyO9npGndU1fytrD0SbnN94TogIpvOVnpuJvNgclZ4kCtj8oWoCIA2wDzxk-6_saUTJjHtVAygXzANvZe4iasqBB-O-YeZt2FQ7W)
* [全栈Redux实战](http://www.tuicool.com/articles/mqiyiq7)
* [解读redux工作原理](http://zhenhua-lee.github.io/react/redux.html)
* [Redux 最佳实践-译](https://segmentfault.com/a/1190000005757189)
* [Redux 介绍](https://segmentfault.com/a/1190000003503338)
* [利用redux和react-redux去cookie&localStorage进行登录状态验证的实践](https://segmentfault.com/a/1190000005607817)
* [深入到源码：解读 redux 的设计思路与用法](http://div.io/topic/1309)
* [redux cheatsheets](http://ricostacruz.com/cheatsheets/redux.html)
* [awesome-redux](https://github.com/xgrommx/awesome-redux)
* [redux-devtools](https://github.com/gaearon/redux-devtools)
* [《看漫画，学 Redux》 —— A cartoon intro to Redux](https://github.com/jasonslyvia/a-cartoon-intro-to-redux-cn)
* [Redux 核心概念](http://www.jianshu.com/p/3334467e4b32)
* [数据流管理架构之 Redux 介绍](http://www.alloyteam.com/2015/09/react-redux/)
* [通过三张图了解Redux中的重要概念](https://github.com/WilberTian/StepByStep-Redux)
* [使用Redux管理你的React应用](https://github.com/matthew-sun/blog/issues/18)
* [React和Redux的连接react-redux](https://leozdgao.me/reacthe-reduxde-qiao-jie-react-redux/)
* [redux-saga](http://yelouafi.github.io/redux-saga/)
* [Redux-saga 中文文档](http://leonshi.com/redux-saga-in-chinese/)
* [掌控 redux 异步](https://zhuanlan.zhihu.com/p/21398212)
* [compose redux sagas](https://zhuanlan.zhihu.com/p/21399936)

> React Router Redux

* [react-router-redux](https://github.com/reactjs/react-router-redux)
* [redux-router](https://github.com/acdlite/redux-router)

> React AJAX（2016-07-29 14:20）

* [request - 11830](https://github.com/request/request)
* [fetch - 9248](https://github.com/github/fetch)
* [superagent - 8162](https://github.com/visionmedia/superagent)
* [axios - 4997](https://github.com/mzabriskie/axios)
* [isomorphic-fetch - 2582](https://github.com/matthew-andrews/isomorphic-fetch)
* [reqwest - 1999](https://github.com/ded/reqwest)
* [react-refetch - 1964](https://github.com/heroku/react-refetch)
* [fetch-ie8 - 129](https://github.com/camsong/fetch-ie8)
* [react-ajax - 83](https://github.com/yuanyan/react-ajax)
* [nattyFetch - 33](https://github.com/Jias/natty-fetch)
* [react-superagent - 24](https://github.com/threepointone/react-superagent)
* [Fetch API: 异步请求新解决方案](http://zhenhua-lee.github.io/http/fetch.html)
* [【翻译】这个API很“迷人”——(新的Fetch API)](http://www.w3ctech.com/topic/854)
* [fetch API 简介](http://bubkoo.com/2015/05/08/introduction-to-fetch/)
* [传统 Ajax 已死，Fetch 永生](https://github.com/camsong/blog/issues/2)
* [Promise](https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Promise)
* [Generator 函数的含义与用法](http://www.ruanyifeng.com/blog/2015/04/generator.html)
* [async 函数的含义和用法](http://www.ruanyifeng.com/blog/2015/05/async.html)

> React Boilerplate（2016-08-02 13:18）

* [react-starter-kit - 9702](https://github.com/kriasoft/react-starter-kit)
* [react-boilerplate - 8503](https://github.com/mxstbr/react-boilerplate)
* [react-redux-universal-hot-example - 6806](https://github.com/erikras/react-redux-universal-hot-example)
* [react-redux-starter-kit - 5071](https://github.com/davezuko/react-redux-starter-kit)
* [react-slingshot - 4071](https://github.com/coryhouse/react-slingshot)
* [electron-react-boilerplate - 3225](https://github.com/chentsulin/electron-react-boilerplate)
* [frontend-boilerplate - 2784](https://github.com/tj/frontend-boilerplate)
* [react-static-boilerplate - 1537](https://github.com/kriasoft/react-static-boilerplate)
* [universal-react-boilerplate - 808](https://github.com/cloverfield-tools/universal-react-boilerplate)
* [react-production-starter - 776](https://github.com/jaredpalmer/react-production-starter)
* [react-babel-webpack-boilerplate - 610](https://github.com/ruanyf/react-babel-webpack-boilerplate)
* [redux-easy-boilerplate - 559](https://github.com/anorudes/redux-easy-boilerplate)
* [react-static-boilerplate - 12](https://github.com/koistya/react-static-boilerplate)

> React Tutorial

* [react-redux-links - 2739](https://github.com/markerikson/react-redux-links)
* [redux-tutorial -2189](https://github.com/happypoulp/redux-tutorial)
* [react-router-tutorial - 1400](https://github.com/reactjs/react-router-tutorial)
* [react-redux-tutorial - 883](https://github.com/lewis617/react-redux-tutorial)
* [redux-tutorial-cn - 286](https://github.com/react-guide/redux-tutorial-cn)
* [todo-redux-react-webpack - 50](https://github.com/sadams/todo-redux-react-webpack)

> React UI - Desktop App

* [](http://ireact.cn/)
* [material-ui - 集合 - 17157 ♥](https://github.com/callemall/material-ui)
* [react-canvas - 8540](https://github.com/Flipboard/react-canvas)
* [react-bootstrap - 集合 - 6241 ♥](https://github.com/react-bootstrap/react-bootstrap)
* [react-motion - 5199](https://github.com/chenglou/react-motion)
* [react-storybook - 4802](https://github.com/kadirahq/react-storybook)
* [ant-design - 集合 - 4196 ♥](https://github.com/ant-design/ant-design)
* [react-select - 3774](https://github.com/JedWatson/react-select)
* [react-dnd - 3178](https://github.com/gaearon/react-dnd)
* [redux-form - 2666](https://github.com/erikras/redux-form)
* [elemental - 集合 - 2627](https://github.com/elementalui/elemental)
* [react-grid-layout - 2123](https://github.com/STRML/react-grid-layout)
* [react-color - 2040](https://github.com/casesandberg/react-color)
* [react-helmet - 1698](https://github.com/nfl/react-helmet)
* [react-style - 1578](https://github.com/js-next/react-style)
* [react-templates - 1483](https://github.com/wix/react-templates)
* [react-tween-state - 1437](https://github.com/chenglou/react-tween-state)
* [rebass - 集合 - 1339](https://github.com/jxnblk/rebass)
* [react-dropzone - 1305](https://github.com/okonet/react-dropzone)
* [amazeui-react - 集合 - 971 ♥](https://github.com/amazeui/amazeui-react)
* [react-ui - 集合 - 825](https://github.com/Lobos/react-ui)
* [react-router-bootstrap - 647](https://github.com/react-bootstrap/react-router-bootstrap)
* [react-sticky - 293](https://github.com/captivationsoftware/react-sticky)
* [react-fa - 229](https://github.com/andreypopp/react-fa)
* [react-components - 集合 - 175](https://github.com/vaffel/react-components)
* [stardust - 86](https://github.com/TechnologyAdvice/stardust)
* [tree-view - 80](https://github.com/maxogden/tree-view)
* [material-components - 集合 - 70](https://github.com/garth/material-components)
* [react-component - 集合 - 64](https://github.com/cd-fe/react-component)
* [uxcore - 集合 - 47 ♥](https://github.com/uxcore/uxcore)
* [react-scifi - 35](https://github.com/nygardk/react-scifi)
* [dragon-ui - 集合 - 17](https://github.com/JeromeLin/dragon-ui)
* [react-custom-scrollbars](https://github.com/malte-wessel/react-custom-scrollbars)

> React UI - Mobile App

* [OnsenUI - 3010](https://github.com/OnsenUI/OnsenUI)
* [react-web - 1551](https://github.com/taobaofed/react-web)

> React UI - Client App

* [react-desktop - 4688](https://github.com/gabrielbull/react-desktop)
* [Structor - 3095](https://github.com/ipselon/structor)

> React 周边

* [Riot.js](http://riotjs.com/)
* [Vue.js](http://vuejs.org/)
* [enzyme - React Test](https://github.com/airbnb/enzyme)
* [Mock.js](http://mockjs.com/)
* [使用Mock.js进行独立于后端的前端开发](https://segmentfault.com/a/1190000003087224)
* [致我们终将组件化的Web](http://www.alloyteam.com/2015/11/we-will-be-componentized-web-long-text/)
* [css-modules](http://glenmaddern.com/articles/css-modules)
* [CSS Modules 用法教程](http://www.ruanyifeng.com/blog/2016/06/css_modules.html)
* [react-css-modules](https://github.com/gajus/react-css-modules)
* [postcss-modules-local-by-default](https://github.com/css-modules/postcss-modules-local-by-default)
* [React - 极客学院](http://www.jikexueyuan.com/course/reactjs/)
* [React 基础 - 宁浩网](http://ninghao.net/course/2967)
* [React - 霹雳渔](http://piliyu.com/)

> SVG

* [svg-sprite-loader](https://github.com/kisenka/svg-sprite-loader)
* [SVG 图标制作指南](https://zhuanlan.zhihu.com/p/20753791?refer=FrontendMagazine)

> React Native

* [React-Native学习指南](https://github.com/reactnativecn/react-native-guide)
* [React Native 中文版(含新增 Android 章节)](https://github.com/jikexueyuanwiki/react-native)

## ECMAScript 6

* [learn-es2015](http://babeljs.io/docs/learn-es2015/)
* [es6features](https://github.com/lukehoban/es6features)
* [ECMAScript 6入门](http://es6.ruanyifeng.com/)
* [JavaScript 标准参考教程（alpha）](http://javascript.ruanyifeng.com/)
* [React-Redux-ES6-Cookbook](https://github.com/nattatorn-dev/React-Redux-ES6-Cookbook)

## Babel

* [Babel](http://babeljs.io/)
* [babel](https://github.com/babel/babel)
* [babel-handbook](https://github.com/thejameskyle/babel-handbook)
* [Babel 手册](https://github.com/thejameskyle/babel-handbook/blob/master/translations/zh-Hans/README.md)

## Webpack

* [webpack](http://webpack.github.io/docs/)
* [webpack-howto](https://github.com/petehunt/webpack-howto)
* [webpack-demos](https://github.com/ruanyf/webpack-demos)
* [webpack-demo](https://github.com/css-modules/webpack-demo)
* [Webpack 中文指南](http://zhaoda.net/webpack-handbook/index.html)
* [Beginner Webpack Tutorial](https://github.com/AriaFallah/WebpackTutorial)
* [Webpack傻瓜式指南（一）](https://zhuanlan.zhihu.com/p/20367175)
* [Webpack: 为Web开发而生的模块管理器](http://hanjianwei.com/2014/09/10/webpack-package-manager-for-web/)
* [awesome-webpack](https://github.com/xiaoyu2er/awesome-webpack)
* [webpack 教程资源收集](https://github.com/callmeJozo/webpack-tutorial-collection)
* [Webpack傻瓜式指南](https://github.com/vikingmute/webpack-for-fools)
* [QQ 音乐技术团队分享之 Webpack 实用技巧高效实战](http://www.tuicool.com/articles/FBbMvaj)

## 其他

* [程序员的自我修养](https://leohxj.gitbooks.io/a-programmer-prepares/content/)
* [我由Angular转向React，为什么？](http://m.csdn.net/article/2015-02-13/2823956)
* [关于从 Backbone 转移到 React 的思考](http://www.tuicool.com/articles/IjAba2)

* [写给想做前端的你](https://segmentfault.com/a/1190000005085629)

---

# CSS 进阶路线

CSS 发展 | 概念

---|---

基础阶段 | [CSS](https://www.w3.org/Style/CSS/)

预处理阶段 | [Less](http://lesscss.org/)、[Sass](http://sass-lang.com/)、[Stylus](http://stylus-lang.com/)

后处理阶段 | [PostCSS](http://postcss.org/)

- | [You Don't Need JavaScript](https://github.com/you-dont-need/You-Dont-Need-Javascript)

CSS 架构 | 概念

---|---

1 级 | [DRY CSS](http://vanseodesign.com/css/dry-principles/)

2 级 | [SOLID CSS](http://blog.millermedeiros.com/solid-css/)

3 级 | [SMACSS](https://smacss.com/)

4 级 | [OOCSS](http://oocss.org/)

5 级 | [BEM](https://en.bem.info/methodology/key-concepts/)

6 级 | [CSS Modules](https://github.com/css-modules/css-modules)

每一阶段、级别的产物都可以解决特定的问题，不要跳着阅读哦~