xylinuxkernel/ReactNativeMaterials

React Native的中文参考资料，包括开源库，文字/视频资料，相关工具等

ReactNativeMaterials

React Native优秀博客，以及优秀的Github库列表（很多英文资料源自于awesome-react-native）

关于开源库类

• Star 100+ 🔥
• Star 200+ 🔥🔥
• Star 500+ 🔥🔥🔥
• Star 1000+ 🔥🔥🔥🔥
• Star 2000+ 🔥🔥🔥🔥🔥

关于博客和视频类

• 值得读读 ⭐️
• 建议阅读 ⭐️⭐️
• 强烈推荐 ⭐️⭐️⭐️

目录

• 网址
• 完整开源项目
• Libraries (Star 100+)
• 中文博客
• 英文博客
• 视频资料

##完整开源项目

• 官方Demo App
• f8app Facebook官方开发的，强烈推荐 🔥🔥🔥🔥🔥
• 30-days-of-react-native 写了30个小项目，来学习React Native，强烈推荐 🔥🔥🔥
• HackerNews-React-Native HackerNews的客户端 🔥🔥🔥🔥🔥
• react-native-gitfeed 一个github客户端 🔥🔥🔥🔥
• ZhiHuDaily-React-Native 知乎日报的客户端 🔥🔥🔥🔥🔥
• noder-react-native cnodejs.org的App 🔥🔥🔥🔥
• react-native-dribbble-app Dribbble app 🔥🔥🔥🔥
• Reading 一个值得借鉴的学习工程 🔥🔥🔥
• react-native-nba-app 查看NBA比赛信息和数据的APP 🔥🔥🔥🔥
• ReactNativeNews 一个简单的新闻客户端 🔥🔥
• react-native-demo 模仿天猫首页的Demo 🔥🔥
• ReactNativeRedditReader RedditReader 🔥🔥
• FinanceReactNative 金融股票类App 🔥🔥🔥
• react-native-nw-react-calculator mobile，desktop，website通用的代码写的计算器 🔥🔥🔥🔥🔥
• snowflake 用Redux, RN Router，Parse写的App。 🔥🔥🔥🔥🔥
• lumpen-radio WLPN 105.5 Chicago 🔥
• react-native-sudoku 数独游戏 🔥🔥🔥🔥
• TaskRabbit's Sample App Task Rabbit的Demo App
• PhotosReactNative 一个带图案锁屏的开源看图App
• movieapp 查看电影和电视节目的App 🔥🔥

##网址

• 源代码
• 官方文档
• React Native中文网
• StackOverFlow ReactNative相关问题
• React-China社区
• Use React Native 资讯站
• [Programming React Native](Programming React Native ) 一本入门教程的书
• CSDN React Native知识库
• Use React Native Blog
• Facebook Code Blog
• Qunar React Native 去哪儿定制版 React Native，更快、更好、更统一。

##Libraries

综合

• awesome-react-native 老外搜集的优秀的React Native文章，库（资料很全）🔥🔥🔥🔥🔥
• react-native-guide 一国内小哥搜集的React Native的参考资料 🔥🔥🔥🔥🔥
• React-native组件库js.coach 🔥🔥🔥🔥🔥
• React Native Package Manager 🔥🔥🔥🔥🔥
• react-native-desktop 为MacOS开发提供的React Native开发包 🔥🔥🔥🔥🔥
• tcomb-form-native 生成React native froms 🔥🔥🔥🔥
• React Native training Github Book，入门级资料 🔥🔥
• pepperoni-app-kit React Native App 开发的一组通用组件 🔥🔥🔥🔥

UI

• React-Native-Elements 一组开发RN的UI工具包（强烈推荐） 🔥🔥🔥🔥🔥
• apsl-react-native-button 定义了一个Button支持用Style来配置 🔥🔥
• react-native-action-button 支持多种点击事件的Button控件 🔥🔥
• react-native-button 另一个Button组件 🔥🔥
• ex-navigator 封装Navigator,以Route为中心的Navigator 🔥🔥
• gl-react-native React Native中使用OPENGL来实现复杂的图片和components渲染 🔥🔥🔥
• react-native-activity-view iOS上的分享和action sheets组件 🔥🔥
• react-native-app-intro 引导页 🔥🔥
• react-native-blur 添加模糊或者毛玻璃效果 🔥🔥🔥
• react-native-calendar 日历 🔥
• react-native-chart 绘图（折线图，柱状图，扇形图） 🔥🔥🔥
• react-native-circular-progress 圆形的显示进度的视图 🔥
• react-native-collapsible 可折叠的component 🔥
• React Native Drawer 抽屉效果，可 用来实现侧拉菜单 🔥🔥🔥
• react-native-dropdown下拉菜单 🔥
• ReactNativeEffectsView 封装了iOS 8上的UIVisualEffectViews，在React Native中实现毛玻璃效果 🔥
• react-native-gesture-password 手势解锁，支持iOS和Android 🔥
• react-native-gifted-form 在React Native中方便的使用表格 🔥🔥
• react-native-gifted-listview 下拉刷新和上拉加载的ListView 🔥🔥
• react-native-gifted-messenger 方便的实现聊天UI 🔥🔥🔥🔥
• react-native-grid-view 网格视图，类似iOS中的UICollectionView 🔥
• react-native-image-picker 用Native UI来选择图片或者拍照 🔥🔥🔥
• react-native-keyboard-spacer 适用于iOS的根据键盘自动调整输入框 🔥🔥
• react-native-keyboardevents 监听键盘显示/隐藏 🔥
• react-native-lightbox 图片全屏预览 🔥🔥🔥
• react-native-looped-carousel 视图轮播 🔥🔥
• react-native-mapbox-gl 地图 🔥🔥
• react-native-maps 地图 🔥🔥🔥🔥
• react-native-material-design material design 🔥🔥🔥
• react-native-material-kit 一组UI Components，为了介绍 Material Design 🔥🔥🔥🔥
• react-native-modalbox 用于模态显示的Component 🔥🔥
• react-native-orientation 监听设备旋转 🔥
• react-native-parallax parallax效果 🔥
• react-native-picker 选择器，可用于实现时间选择，区域选择 🔥
• react-native-popover 弹出气泡框的Component 🔥
• react-native-progress-hud ProgressHUD 🔥
• react-native-refresher 支持下拉刷新的listview 🔥🔥
• react-native-router类似Navigator的导航控制器 🔥🔥🔥🔥
• react-native-scrollable-tab-view 支持左右滚动的来切换tab的tableview 🔥🔥🔥🔥
• react-native-controllers 封装了 原生的iOS 导航栏，tabbar，抽屉效果等。 🔥🔥
• react-native-search-bar 封装iOS原生UISearchBar 🔥🔥
• react-native-spinkit 一组Activity指示器 🔥🔥
• react-native-splashscreen App载入视图，启动后自动隐藏 🔥
• react-native-svgkit 显示SVG格式图片 🔥🔥
• react-native-swipeout 类似TableViewCell的左滑删除，支持Component滑动 🔥🔥🔥
• react-native-swiper 视图轮播，上下/左右滑动组件,类似UICollectionView 🔥🔥🔥🔥
• react-native-tableview 封装iOS原生UITableview
• react-native-vector-icons 3000+支持自定义的图标 🔥🔥🔥🔥
• react-native-sglistview 为了解决React Native中ListView的内存问题 🔥
• react-native-invertible-scroll-view 逆向的ScrollView，从底部开始布局，适用于聊天等向上滑动来加载更多的情况 🔥
• react-native-viewpager 视图轮播，支持循环滚动，自定义视图。已做性能优化 🔥🔥🔥
• react-native-tab-navigator TabBar切换视图 🔥🔥
• react-native-loading-spinner-overlay 加载中的提示spinner 🔥,支持iOS/Android
• react-native-color-picker iOS/Android通用的颜色选择器
• react-native-pathjs-charts - 基于react-native-svg 和 paths-js写的iOS，Android通用的绘图库 🔥

文本相关

• react-native-markdown 支持markdown的component 🔥

工具

• react-native-mock 一个为ReactNative提供的测试框架 🔥🔥
• react-native-google-analytics google统计分析 🔥
• react-native-fabric 统计分析，崩溃分析等 🔥🔥
• react-native-macos 为mac OS服务的React Native
• react-native-wechat 调用微信相关，比如分享，登录，支付 🔥🔥
• reactotron 在终端检测React Dom和Reactive App 🔥🔥🔥
• react-native-windows Windows平台的RN工具 🔥🔥🔥
• react-native-webpack-server 用Webpack来编译React Native App
• aws-sdk-react-native AWS的官方SDK 🔥🔥

系统相关

• react-native-device-info 获取设备信息 🔥🔥
• react-native-barcodescanner 扫码 🔥
• react-native-contacts 访问通讯录 🔥
• react-native-fs 访问本地文件系统 🔥🔥
• react-native-push-notification 本地和远程通知 🔥🔥
• react-native-touch-id 调用TouchID认证 🔥
• react-native-fcm - firebase cloud messaging 和 local notification 🔥🔥

Web相关

• react-native-safari-view 封装iOS中的 Safari View Controller 🔥
• react-native-webview-android 封装了Android中的Webview 🔥
• react-native-webrtc A WebRTC module for React Native. 🔥🔥

##动画

• react-native-animatable 封装了很多动画，强烈推荐 🔥🔥🔥🔥

数据存储

• react-native-sqlite-storage iOS／Android上的Sqlite3封装 🔥🔥
• react-native-store 封装了react-native AsyncStorage 🔥🔥
• realm-js 用JS来调用Realm 🔥🔥🔥🔥
• react-native-fetch-blob 更容易的访问文件和交换数据（本地，网络） 🔥🔥🔥

多媒体

• react-native-camera 相机组件 🔥🔥🔥🔥
• react-native-video 视频组建 🔥🔥🔥🔥
• react-native-image-crop-picker 图片选择器，支持对图片进行切割 🔥
•  react-native-video-processing 视频编辑，调整，滤镜 ###其他
• react-native-css 用CSS的方式对Component进行Style 🔥🔥
• react-native-extended-stylesheet 对stylesheet进行扩展 🔥🔥

##中文资料

###宏观介绍

• [如何评价 React Native？(知乎)] (https://www.zhihu.com/question/27852694)
• 跨平台开发时代的 (再次) 到来？（ Xamarin，NativeScript 和 React Native 对比） ⭐️⭐️
• React Native概述：背景、规划和风险 ⭐️⭐️
• 使用React Native一年后的感受 ⭐️⭐️
• React Native通信机制详解 ⭐️⭐️⭐️
• [深入ReactNative]第一篇 通讯及消息循环代码剖析 ⭐️⭐️⭐️
• 旅行喵 React Native 技术实践 ⭐️⭐️⭐️

###技术细节

• react组件间通信 ⭐️⭐️
• React Native 之 JSBridge ⭐️⭐️
• ReactNative iOS源码解析（一）⭐️⭐️⭐️
• ReactNative iOS源码解析（二） ⭐️⭐️⭐️

###我的博客

• IDE(Atom+Nuclide）搭建和简单使用 ⭐️⭐️⭐️
• FlexBox入门图解 ⭐️⭐️
• React Native开发之动画(Animations)⭐️⭐️

##英文资料

###宏观介绍

• React Native: Bringing modern web techniques to mobile ⭐️⭐️
• React Native and WebRTC ⭐️
• Writing Android Components ⭐️
• Android Performance ⭐️⭐️
• A Dynamic Crazy Native Mobile Future Powered by Javascript ⭐️

JS相关

• es6features 详细介绍了ES6的新特性，RN是支持ES6的，所以强烈建议阅读 ⭐️⭐️⭐️

###技术细节

• Routing and Navigation in React Native ⭐️⭐️
• Unit Testing React Native with Mocha and Enzyme ⭐️⭐️⭐️
• Routing and Navigation in React Native ⭐️⭐️
• Unit Testing React Native with Mocha and Enzyme ⭐️⭐️⭐️
• test-driving-react-native-applications ⭐️⭐️⭐️
• react-native-tutorial-part-1-hello-react ⭐️⭐️
• Creating "Droppable" Components with Animated and PanResponder ⭐️⭐️⭐️
• Basics of using react-native-router-flux
• How to Use the ListView Component⭐️⭐️

##视频资料 Tips:部分视频资料来自Youtubu，可以用Lantern翻墙

• React.js Conf 2016 ⭐️⭐️⭐️
• React Conf 2015: Introducing React Native ⭐️⭐️⭐️
• React Conf 2015: A Deep Dive into React Native ⭐️⭐️⭐️
• F8 2015: React Native and Relay ⭐️⭐️
• Let's build a React Native app in 20 minutes ⭐️
• Pluralsight.com: Build iOS Apps with React Native ⭐️