├── .gitignore ├── resource └── download │ ├── UIExplorer.zip │ ├── (深入浅出ES6)ES6-in-depth.pdf │ └── (JavaScript Promise迷你书(中文版))javascript-promise-book.pdf ├── LICENSE └── README.md /.gitignore: -------------------------------------------------------------------------------- 1 | .idea 2 | _site 3 | node_modules 4 | npm-debug.log 5 | .DS_Store 6 | */.DS_Store 7 | */*/.DS_Store 8 | *.sh 9 | -------------------------------------------------------------------------------- /resource/download/UIExplorer.zip: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/crazycodeboy/react-native-awesome/HEAD/resource/download/UIExplorer.zip -------------------------------------------------------------------------------- /resource/download/(深入浅出ES6)ES6-in-depth.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/crazycodeboy/react-native-awesome/HEAD/resource/download/(深入浅出ES6)ES6-in-depth.pdf -------------------------------------------------------------------------------- /resource/download/(JavaScript Promise迷你书(中文版))javascript-promise-book.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/crazycodeboy/react-native-awesome/HEAD/resource/download/(JavaScript Promise迷你书(中文版))javascript-promise-book.pdf -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2016 Jia PengHui 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # React Native 学习资源精选仓库(汇聚知识,分享精华) 2 | 3 | [![](https://jaywcjlove.github.io/sb/ico/awesome.svg)](#目录) [![](https://jaywcjlove.github.io/sb/lang/chinese.svg)](https://github.com/crazycodeboy/react-native-awesome) [![](https://jaywcjlove.github.io/sb/lang/english.svg)](https://github.com/jondot/awesome-react-native) 4 | 5 | React Native Awesome 汇集了各类react-native学习资料、工具、组件、开源App、资源下载、以及相关新闻等,只求精不求全。 6 | 7 | >如果你是一名React Native爱好者,或者有一颗热爱钻研新技术的心,喜欢分享技术干货、项目经验、以及你在React Naive学习研究或实践中的一些经验心得等等,欢迎投稿[《React Native Awesome》](https://github.com/crazycodeboy/react-native-awesome)。 8 | 如果你是一名Android、iOS、或前端开发人员,有者一颗积极进取的心,欢迎关注[《React Native Awesome》](https://github.com/crazycodeboy/react-native-awesome)。本项目汇集了各类React Native学习资料、工具、组件、开源App、以及相关新闻等。 9 | 10 | 11 | ## 目录 12 | 13 | * [资源网站](#资源网站) 14 | * [React.js](#reactjs) 15 | * [React Native](#react-native) 16 | * [教程](#教程) 17 | * [React.js](#reactjs-1) 18 | * [React Native](#react-native-1) 19 | * [文档手册](#文档手册) 20 | * [布局相关](#布局相关) 21 | * [开发调试](#开发调试) 22 | * [发布部署](#发布部署) 23 | * [ES6&ES7](#es6es7) 24 | * [项目实践&教程](#项目实践教程) 25 | * [系列教程](#系列教程) 26 | * [开源APP](#开源app) 27 | * [组件](#组件) 28 | * [UI](#ui) 29 | * [Navigation](#navigation) 30 | * [ViewPager](#viewpager) 31 | * [ListView&ScrollView](#listviewscrollview) 32 | * [Text&Rich Content](#text-rich-content) 33 | * [弹框](#弹框) 34 | * [Material Design](#material-design) 35 | * [TabLayout](#tablayout) 36 | * [框架](#框架) 37 | * [库](#库) 38 | * [工具](#工具) 39 | * [视频](#视频) 40 | * [新闻&讨论](#新闻讨论) 41 | * [一次学习,随处可写](#一次学习随处可写) 42 | * [资源下载](#资源下载) 43 | 44 | 45 | ## 资源网站 46 | 47 | ### React.js 48 | 49 | * [React官网](https://facebook.github.io/react/) 50 | * [React-China社区](http://react-china.org/) 51 | 52 | ### React Native 53 | 54 | * [React Native 官方文档](https://facebook.github.io/react-native/) 55 | * [React Native 中文版 - 极客学院](http://wiki.jikexueyuan.com/project/react-native/) 56 | * [React Native 中文版 - reactnative.cn](http://reactnative.cn/) 57 | * [React Native中文社区](http://bbs.react-native.cn/) 58 | * [React Native组件库网站](https://js.coach/react-native) 59 | * [Use React Native 资讯站](http://www.reactnative.com/) 60 | 61 | ## 教程 62 | 63 | ### 项目实践&教程 64 | 65 | * [最新版React Native+Redux打造高质量上线App](http://coding.imooc.com/class/304.html)![ hot](http://www.devio.org/img/ico/ico_hot.gif) 66 | * [Redux开发实用教程](http://www.imooc.com/article/281446)![ new](http://www.devio.org/img/ico/ico_new.gif) 67 | * [React Native+react-navigation+redux开发实用教程](http://www.imooc.com/article/283337)![ new](http://www.devio.org/img/ico/ico_new.gif) 68 | * [React Native+Redux开发实用教程](http://www.imooc.com/article/283047)![ new](http://www.devio.org/img/ico/ico_new.gif) 69 | * [React Native开发之必备React基础](http://www.imooc.com/article/279228) 70 | * [『React Navigation 3x系列教程』createDrawerNavigator开发指南](http://www.imooc.com/article/273065) 71 | * [『React Navigation 3x系列教程』createMaterialTopTabNavigator开发指南](http://www.imooc.com/article/271652) 72 | * [『React Navigation 3x系列教程』之createBottomTabNavigator开发指南](http://www.imooc.com/article/269529) 73 | * [『React Navigation 3x系列教程』之React Navigation 3x开发指南](http://www.imooc.com/article/267857) 74 | * [『React Navigation 3x系列教程』之createStackNavigator开发指南](http://www.imooc.com/article/268381) 75 | * [React Native 混合开发(Android篇)](http://www.devio.org/2018/08/26/React-Native-Hybrid-Android/) 76 | * [React Native 混合开发(iOS篇)](http://www.devio.org/2018/08/26/React-Native-Hybrid-iOS/) 77 | * [React Native年度报告(2017-2018)](http://www.devio.org/2018/02/26/React-Native-Annual-Report-2017-2018/) 78 | * [React Native0.50+开发指导](http://www.devio.org/2017/12/12/React-Native0.50-Development-Guide-Chinese-update-instructions/) 79 | * [React Native 开发适配心得](http://www.devio.org/2017/10/06/How-to-develop-a-React-Native-application-for-Android-and-iOS-dual-platforms/) 80 | * [React Native 集成分享第三方登录功能分享第三方登录模块开发(iOS)](http://www.devio.org/2017/09/30/React-Native-integration-share-third-party-login-function-ios/) 81 | * [React Native 集成分享第三方登录功能分享第三方登录模块开发(Android)](http://www.devio.org/2017/09/10/React-Native-integration-share-third-party-login-function/) 82 | * [教你轻松在React Native中集成统计的功能)](http://www.devio.org/2017/09/03/React-Native-Integrated-analysis-function/) 83 | * [React Native免费自学视频](http://www.imooc.com/learn/808) 84 | * [快速创建React Native App](http://www.devio.org/2017/07/12/quickly-create-react-native-app/) 85 | * [手把手教你构建运行React Native官方Examples](http://www.devio.org/2017/06/01/Construction-of-React-Native-Official/) 86 | * [ReactNative For Android 项目实战总结](https://mp.weixin.qq.com/s?__biz=MzI1MTA1MzM2Nw==&mid=401483604&idx=1&sn=399cdf7e13fe6125108de1bfd045f2cf&scene=1&srcid=0228wE75TF9Zqzny7mt7ZS3J&key=710a5d99946419d9b9d0a316ddb898594e9089b1b29a8759cca5ff2407c204f72876180e08fd6c60d3816da7e4c39053&ascene=0&uin=Mjc3OTU3Nzk1&devicetype=iMac+MacBookPro10%2C1+OSX+OSX+10.10.5+build%2814F27%29&version=11020201&pass_ticket=m2YLRqjCZ5S4CHXKqIpGbkf59t1oYvRDZ6krGXEuDfWlQcoVj1p2g8gzHOEYrM9U) 87 | * [Moles:携程基于React Native的跨平台开发框架](https://mp.weixin.qq.com/s?__biz=MzA3ODg4MDk0Ng==&mid=2651112408&idx=1&sn=32c2636a2653fe9391b44de514261cbf&scene=0&key=77421cf58af4a653dcba21da5c024ac89779f9441ef063c83a81320190267d73448404f84638ac9741a1c60d023e7e88&ascene=0&uin=Mjc3OTU3Nzk1&devicetype=iMac+MacBookPro10%2C1+OSX+OSX+10.10.5+build%2814F1808%29&version=11020201&pass_ticket=x3C%2Bf%2BjqNCVt%2FGoLAeJ5hccBYdZiUgf8Rr%2FLW%2Bpr4auXqEdjgM%2Fbrnmu6Qu%2B3N7N) 88 | * [构建 Facebook F8 2016 App / React Native 开发指南](http://f8-app.liaohuqiu.net/) 89 | * [React Native 从入门到原理](http://www.jianshu.com/p/978c4bd3a759#) 90 | * [Mac(OSX)平台搭建React Native开发环境](http://www.devio.org/2016/05/20/React-Native-development-environment-build-mac-platform/) 91 | * [Windows平台搭建React Native开发环境](http://www.devio.org/2016/05/20/React-Native-development-environment-build-Windows-platform/) 92 | 93 | ### React.js 94 | 95 | * [React速学教程(上)](http://blog.csdn.net/fengyuzhengfan/article/details/52185921) 96 | * [React速学教程(中)](http://blog.csdn.net/fengyuzhengfan/article/details/52201554) 97 | * [React速学教程(下)](http://blog.csdn.net/fengyuzhengfan/article/details/52233582) 98 | * [React入门教程](https://hulufei.gitbooks.io/react-tutorial/content/introduction.html) 99 | 100 | ### React Native 101 | 102 | #### 布局相关 103 | 104 | * [React Native布局详细指南](http://blog.csdn.net/fengyuzhengfan/article/details/52090154) 105 | * [React Native布局篇](https://segmentfault.com/a/1190000002658374) 106 | * [Flex 布局语法教程](http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html) 107 | * [React Native探索(二):布局篇](http://www.infoq.com/cn/articles/react-native-layout) 108 | 109 | 110 | #### 开发调试 111 | 112 | * [React Native调试技巧与心得](http://blog.csdn.net/fengyuzhengfan/article/details/52106496) 113 | * [教你轻松修改React Native端口(如何同时运行多个React Native、8081端口占用问题)](http://www.devio.org/2017/08/18/Modify-the-React-Native-listening-port/)![ new](http://www.devio.org/img/ico/ico_new.gif) 114 | 115 | #### 发布部署 116 | 117 | * [React Native应用部署/热更新-CodePush最新集成总结](http://blog.csdn.net/fengyuzhengfan/article/details/52003798) 118 | * [React Native发布APP之签名打包APK](http://blog.csdn.net/fengyuzhengfan/article/details/51958848) 119 | * [ReactNative增量升级方案](http://bbs.reactnative.cn/topic/276/reactnative%E5%A2%9E%E9%87%8F%E5%8D%87%E7%BA%A7%E6%96%B9%E6%A1%88) 120 | * [React Native: Android 的打包](http://www.liaohuqiu.net/cn/posts/react-native-android-package/) 121 | * [ReactNative之原生模块开发并发布——iOS篇](http://www.liuchungui.com/blog/2016/05/02/reactnativezhi-yuan-sheng-mo-kuai-kai-fa-bing-fa-bu-iospian/) 122 | * [ReactNative之原生模块开发并发布——android篇](http://www.liuchungui.com/blog/2016/05/08/reactnativezhi-yuan-sheng-mo-kuai-kai-fa-bing-fa-bu-androidpian/) 123 | 124 | 125 | 126 | ### ES6&ES7 127 | 128 | * [ES6的新特性,以及ES6与ES5的区别](http://blog.csdn.net/fengyuzhengfan/article/details/52233582) 129 | * [深入浅出ES6(十三):类 Class](http://www.infoq.com/cn/articles/es6-in-depth-classes/) 130 | * [ES6新特性:使用export和import实现模块化](http://www.cnblogs.com/diligenceday/p/5503777.html) 131 | * [ES6令人激动的特性](http://www.infoq.com/cn/news/2015/07/JavaScript-Promises-Generator?utm_campaign=infoq_content&utm_source=infoq&utm_medium=feed&utm_term=global) 132 | * [ES6 学习笔记](https://segmentfault.com/a/1190000002904199) 133 | * [React on ES6+](https://babeljs.io/blog/2015/06/07/react-on-es6-plus) 134 | * [React/React Native 的ES5 ES6写法对照表](http://bbs.reactnative.cn/topic/15/react-react-native-%E7%9A%84es5-es6%E5%86%99%E6%B3%95%E5%AF%B9%E7%85%A7%E8%A1%A8) 135 | * [深入浅出ES6](http://www.infoq.com/cn/es6-in-depth/) 136 | 137 | 138 | 139 | ### 系列教程 140 | 141 | * [React Native项目实战视频教程](http://coding.imooc.com/class/304.html)![ hot](http://www.devio.org/img/ico/ico_hot.gif) 142 | * [React Native免费自学视频](http://www.imooc.com/learn/808) 143 | * [React Native 学习笔记](https://github.com/crazycodeboy/RNStudyNotes) 144 | * [React Native高手进阶-专栏](http://blog.csdn.net/column/details/react-native-advance.html) 145 | * [React Native高手进阶-专题](http://www.jianshu.com/collection/b6da4107b30d) 146 | * [React Native 每日一学(Learn a little every day)](https://github.com/crazycodeboy/RNStudyNotes/tree/master/React%20Native%20%E6%AF%8F%E6%97%A5%E4%B8%80%E5%AD%A6) 147 | 148 | ## 开源APP 149 | 150 | >它山之石可以攻玉。 151 | 152 | * [GitHubPopular](https://github.com/crazycodeboy/GitHubPopular):基于React Native的查看、阅读、收藏GitHub上 最受欢迎的开源项目的APP,不仅如此,它还是一款GitHub Trending的客户端。 153 | * [React Native官方Demo](https://github.com/facebook/react-native/tree/master/Examples):React Native官方Demo,汇集了各种组件,API的使用Examples。 154 | * [Facebook F8 App ](https://github.com/fbsamples/f8app):基于React Native 的2016 F8大会APP。 155 | * [HackerNews-React-Native](https://github.com/iSimar/HackerNews-React-Native):Hacker 新闻客户端。 156 | * [react-native-nw-react-calculator](https://github.com/benoitvallon/react-native-nw-react-calculator):基于React Native的计算器,iOS/Android、Web、桌面多端。 157 | * [react-native-dribbble-app](https://github.com/catalinmiron/react-native-dribbble-app):基于React Native的Dribbble客户端。 158 | * [noder-react-native](https://github.com/soliury/noder-react-native):Noder-cnodejs客户端。 159 | * [ZhiHuDaily-React-Native](https://github.com/race604/ZhiHuDaily-React-Native):知乎日报Android版。 160 | * [react-native-gitfeed](https://github.com/xiekw2010/react-native-gitfeed):一款基于React Native的GitHub客户端。 161 | 162 | * [FinanceReactNative](https://github.com/7kfpun/FinanceReactNative):Finance - 股票报价app。 163 | * [React-Native-Gank](https://github.com/Bob1993/React-Native-Gank):Gank.io客户端。 164 | * [leanote-ios-rnLeanote](https://github.com/leanote/leanote-ios-rn):Leanote for iOS(云笔记)。 165 | * [shopping-react-native](https://github.com/bigsui/shopping-react-native) :购物app-界面。 166 | * [react-native-nba-app](https://github.com/wwayne/react-native-nba-app):This is why we play。 167 | * [react-native-gitosc](http://git.oschina.net/rplees/react-native-gitosc):使用React Native重写的OSChina的Git@OSC客户端。 168 | * [reading](https://github.com/attentiveness/reading):iReading App。 169 | 170 | 171 | ## 组件 172 | 173 | ### UI 174 | 175 | - [react-native-vector-icons ★2281](https://github.com/oblador/react-native-vector-icons):用于 React Native的可定制的图标资源库,支持 NavBar/TabBar, image source 以及样式。 176 | 177 | ### Navigation 178 | 179 | * [react-native-router-flux](https://github.com/aksonov/react-native-router-flux):一款很火的导航组件。 180 | * [react-native-navbar](https://github.com/react-native-community/react-native-navbar):一款用于React Native上的可定制的导航条。 181 | * [react-native-tab-navigator](https://github.com/exponentjs/react-native-tab-navigator):一款兼容Android、iOS的TabBar组件。 182 | * [react-native-drawer-layout](https://github.com/iodine/react-native-drawer-layout):抽屉组件。 183 | * [react-native-drawer](https://github.com/root-two/react-native-drawer):另一款抽屉组件。 184 | 185 | 186 | 187 | ### ViewPager 188 | 189 | * [react-native-swiper](https://github.com/leecade/react-native-swiper):一款轮番滑动的组件。 190 | * [react-native-looped-carousel](https://github.com/appintheair/react-native-looped-carousel):滚动轮播组件。 191 | 192 | 193 | ### ListView&ScrollView 194 | 195 | * [react-native-refreshable-listview](https://github.com/jsdf/react-native-refreshable-listview):下拉刷新组件。 196 | * [react-native-swipe-list-view](https://github.com/jemise111/react-native-swipe-list-view):滑动删除组件。 197 | * [react-native-swipeout](https://github.com/dancormier/react-native-swipeout):iOS样式的划动删除组件。 198 | * [react-native-sortable-listview](https://github.com/deanmcpherson/react-native-sortable-listview):拖拽排序组件。 199 | * [react-native-draggablelist](https://github.com/hzzcc/react-native-draggablelist):拖排序组件。 200 | * [react-native-SortableList](https://github.com/hayeah/react-native-SortableList):拖拽排序组件。 201 | 202 | 203 | ### Text&Rich Content 204 | 205 | * [react-native-htmlview](https://github.com/jsdf/react-native-htmlview):HTML显示组件,渲染HTML text 。 206 | 207 | ### 弹框 208 | 209 | * [react-native-easy-toast](https://github.com/crazycodeboy/react-native-easy-toast):一款用于React Native上消息提示弹框组件,使用方便,支持定义Toast,支持iOS,Android。 210 | * [react-native-modal](https://github.com/brentvatne/react-native-modal):模态框,作者已经将该组件添加到React Native,所以开发者可以直接使用[Modal](https://facebook.github.io/react-native/releases/0.31/docs/modal.html); 211 | * [react-native-popover](https://github.com/jeanregisser/react-native-popover):一款类似Android popupwindow的弹出框组件。 212 | 213 | 214 | ### Material Design 215 | * [mrn](https://github.com/binggg/mrn):Material Design组件库。 216 | * [react-native-material-design](https://github.com/react-native-material-design/react-native-material-design):一款用于React Native上的材料设计UI组件库。 217 | 218 | 219 | ### TabLayout 220 | 221 | 222 | * [react-native-scrollable-tab-view](https://github.com/skv-headless/react-native-scrollable-tab-view):一款用于React Native上TabLayout组件。 223 | 224 | 225 | ## 框架 226 | 227 | * [NativeBase](https://github.com/GeekyAnts/NativeBase):一款融合了ES6用于在React Native上创建创建高质量的Android&iOS APP的框架。 228 | * [tcomb-form-native](https://github.com/gcanti/tcomb-form-native):强大的表单处理控件,支持 JSON 模式,可插拔的外观和感觉。 229 | 230 | ## 库 231 | 232 | * [react-native-launch-image](https://github.com/reactnativecn/react-native-launch-image):用在React Native上手动关闭iOS启动界面(Launch Screen)的工具。[详细说明](http://reactnative.cn/post/2199) 233 | * [RNShareSDK](https://github.com/kengsir/RNShareSDK):一款基于原生平台ShareSDK的ReactNative插件,方便RN开发者集成各大社交平台的分享和授权功能。 234 | 235 | 236 | ## 工具 237 | 238 | ### IDE 239 | 240 | * [Nuclide](https://nuclide.io/):Nuclide 是 Facebook 推出的一套基于 Atom 的开发工具集。用于开发基于 Hack 的 Web 应用。提供自动完成和 JavaScript 类型检查,内建 React 开发支持,并支持 Facebook 最新的 React Native 库,支持 Facebook 的 Flow JavaScript 类型检查器。 241 | * [WebStorm](https://www.jetbrains.com/webstorm/):JetBrains公司出品的用于前端开发的IDE,WebStorm有着JetBrains公司IDE的优良血统,是前端工程师的一个开发神器。另外,AndroidStudio也是基于JetBrains的IDE,这对于习惯了AndroidStudio的开发者来说,WebStorm无疑是一个最佳的选择。 242 | 243 | ### 其他 244 | * [CodePush](https://microsoft.github.io/code-push/):CodePush 是微软提供的一套用于热更新 React Native 和 Cordova 应用的服务。 245 | * [Redux](https://github.com/reactjs/redux/):用于JavaScript apps上的一款可预见的状态管理框架。 246 | * [redux-react-native-i18n](https://github.com/derzunov/redux-react-native-i18n) An i18n solution with plural forms support for React Native apps on Redux 247 | 248 | 249 | ## 视频 250 | 251 | * [React Native+Redux实战视频](http://coding.imooc.com/class/304.html) 252 | * [React Native项目实战视频](http://coding.imooc.com/class/304.html) 253 | * [React Native免费自学视频](http://www.imooc.com/note/808?sort=last&page=1) 254 | * [React.js Conf 2016](https://www.youtube.com/playlist?list=PLb0IAmt7-GS0M8Q95RIc2lOM6nc77q1IY) 255 | 256 | ## 新闻&讨论 257 | 258 | * [ReactJS 真的好吗?](https://www.zhihu.com/question/33631170) 259 | 260 | 261 | ## 一次学习,随处可写 262 | * [react-native-macos](https://github.com/ptmt/react-native-macos):使用React Native和Cocoa组建macOS桌面应用。 263 | * [react-native-web](https://github.com/necolas/react-native-web):使用React Native组建Web应用。 264 | 265 | 266 | ## 资源下载 267 | 268 | * [(深入浅出ES6)ES6-in-depth](https://raw.githubusercontent.com/crazycodeboy/react-native-awesome/master/resource/download/(%E6%B7%B1%E5%85%A5%E6%B5%85%E5%87%BAES6)ES6-in-depth.pdf) 269 | * [JavaScript Promise迷你书(中文版)](https://raw.githubusercontent.com/crazycodeboy/react-native-awesome/master/resource/download/(JavaScript%20Promise%E8%BF%B7%E4%BD%A0%E4%B9%A6(%E4%B8%AD%E6%96%87%E7%89%88))javascript-promise-book.pdf) 270 | * [React Native API 电子书 for mac@UIExplorer](https://raw.githubusercontent.com/crazycodeboy/react-native-awesome/master/resource/download/UIExplorer.zip) 271 | 272 | 273 | 274 | --------------------------------------------------------------------------------