├── Gemfile ├── .travis.yml ├── starify.sh ├── Gemfile.lock ├── CONTRIBUTING.md ├── dedup.rb ├── validate.rb └── README.md /Gemfile: -------------------------------------------------------------------------------- 1 | source 'https://rubygems.org' 2 | 3 | gem 'nokogiri' 4 | gem 'parallel' 5 | gem 'kramdown' 6 | gem 'httparty' 7 | 8 | -------------------------------------------------------------------------------- /.travis.yml: -------------------------------------------------------------------------------- 1 | language: ruby 2 | rvm: 3 | - 2.2 4 | script: bundle exec ruby dedup.rb && bundle exec ruby validate.rb 5 | sudo: false 6 | 7 | -------------------------------------------------------------------------------- /starify.sh: -------------------------------------------------------------------------------- 1 | #!/bin/sh 2 | # gem install jill 3 | jill -s --star-in README.md --star-out README_STARRED.md 4 | mv README_STARRED.md README.md 5 | -------------------------------------------------------------------------------- /Gemfile.lock: -------------------------------------------------------------------------------- 1 | GEM 2 | remote: https://rubygems.org/ 3 | specs: 4 | httparty (0.13.7) 5 | json (~> 1.8) 6 | multi_xml (>= 0.5.2) 7 | json (1.8.3) 8 | kramdown (1.8.0) 9 | mini_portile (0.6.2) 10 | multi_xml (0.5.5) 11 | nokogiri (1.6.6.2) 12 | mini_portile (~> 0.6.0) 13 | parallel (1.6.1) 14 | 15 | PLATFORMS 16 | ruby 17 | 18 | DEPENDENCIES 19 | httparty 20 | kramdown 21 | nokogiri 22 | parallel 23 | 24 | BUNDLED WITH 25 | 1.10.6 26 | -------------------------------------------------------------------------------- /CONTRIBUTING.md: -------------------------------------------------------------------------------- 1 | # Contribution Guidelines 2 | 3 | Please ensure your pull request adheres to the following guidelines: 4 | 5 | - Search previous suggestions before making a new one, as yours may be a duplicate. 6 | - Suggested packages should be tested and documented. 7 | - Make an individual pull request for each suggestion. 8 | - Use the following format: `[PACKAGE](LINK) - DESCRIPTION.` 9 | - New categories, or improvements to the existing categorization are welcome. 10 | - Keep descriptions short and simple, but descriptive. 11 | - End all descriptions with a full stop/period. 12 | - Check your spelling and grammar. 13 | - Make sure your text editor is set to remove trailing whitespace. 14 | 15 | Thank you for your suggestions! 16 | -------------------------------------------------------------------------------- /dedup.rb: -------------------------------------------------------------------------------- 1 | require 'parallel' 2 | require 'nokogiri' 3 | require 'open-uri' 4 | require 'kramdown' 5 | 6 | BASE_URI = ENV['BASE_URI'] || 'https://github.com/jondot/awesome-react-native' 7 | 8 | doc = Nokogiri::HTML(Kramdown::Document.new(open('README.md').read).to_html) 9 | links = doc.css('a').to_a 10 | puts "Deduping #{links.count} links..." 11 | 12 | map = {} 13 | dups = [] 14 | 15 | links.each do |link| 16 | uri = URI.join(BASE_URI, link.attr('href')) 17 | if map[uri] 18 | dups << link 19 | end 20 | map[uri] = link 21 | end 22 | 23 | unless dups.empty? 24 | puts "\nDuplicate links:" 25 | dups.each do |link| 26 | puts "- #{link}" 27 | puts `grep -nr '#{link.attr('href')}' README.md` 28 | end 29 | puts "\nDone with errors." 30 | exit(1) 31 | end 32 | 33 | puts "\nDone." 34 | -------------------------------------------------------------------------------- /validate.rb: -------------------------------------------------------------------------------- 1 | require 'parallel' 2 | require 'nokogiri' 3 | require 'open-uri' 4 | require 'httparty' 5 | require 'kramdown' 6 | 7 | def check_link(uri) 8 | code = HTTParty.head(uri, :follow_redirects => false).code 9 | return code >= 200 && code < 400 10 | end 11 | 12 | BASE_URI = ENV['BASE_URI'] || 'https://github.com/jondot/awesome-react-native' 13 | 14 | doc = Nokogiri::HTML(Kramdown::Document.new(open('README.md').read).to_html) 15 | links = doc.css('a').to_a 16 | puts "Validating #{links.count} links..." 17 | 18 | invalids = [] 19 | Parallel.each(links, :in_threads => 4) do |link| 20 | begin 21 | uri = URI.join(BASE_URI, link.attr('href')) 22 | check_link(uri) 23 | putc('.') 24 | rescue 25 | putc('F') 26 | invalids << "#{link} (reason: #{$!})" 27 | end 28 | end 29 | 30 | unless invalids.empty? 31 | puts "\n\nFailed links:" 32 | invalids.each do |link| 33 | puts "- #{link}" 34 | end 35 | puts "Done with errors." 36 | exit(1) 37 | end 38 | 39 | puts "\nDone." 40 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Awesome React Native 2 | 3 | Build Status 4 | 5 | A curated list of awesome articles, tutorials and resources dealing 6 | with React Native. 7 | 8 | Inspired by [awesome-go](https://github.com/avelino/awesome-go), which was in turn inspired by [awesome-python](https://github.com/vinta/awesome-python). 9 | 10 | Many thanks to everyone on the [contributor list](https://github.com/jondot/awesome-react-native/graphs/contributors) :) 11 | 12 | # Content 13 | 14 | - [Articles](#articles) 15 | - [Internals](#internals) 16 | - [Components](#components) 17 | - [Utilities](#utilities) 18 | - [Seeds](#seeds) 19 | - [Libraries](#libraries) 20 | - [Examples](#examples) 21 | - [Frameworks](#frameworks) 22 | - [Tutorials](#tutorials) 23 | - [Books](#books) 24 | - [Videos](#videos) 25 | - [Releases](#releases) 26 | 27 | ## Articles 28 | 29 | Content published on the Web. 30 | 31 | ### Routing 32 | 33 | - [Routing and Navigation in React Native](http://blog.paracode.com/2016/01/05/routing-and-navigation-in-react-native/) 34 | - [What's up with NavigatorIOS, Navigator, and ExperimentalNavigator?](https://github.com/facebook/react-native/issues/6184), and [this](https://github.com/ericvicenti/navigation-rfc/blob/master/Docs/NavigationOverview.md), and [this](https://github.com/facebook/react-native/tree/master/Examples/UIExplorer/NavigationExperimental) 35 | 36 | ### Assorted 37 | 38 | - [Avoiding the Keyboard](https://shift.infinite.red/avoiding-the-keyboard-in-react-native-56d05b9a1e81#.g1lwixck6) 39 | - [React Native: Bringing modern web techniques to mobile](https://code.facebook.com/posts/1014532261909640/react-native-bringing-modern-web-techniques-to-mobile/) 40 | - [First impressions using React Native](http://jlongster.com/First-Impressions-using-React-Native) 41 | - [Wrapping Cocoapods for React Native](https://shift.infinite.red/beginner-s-guide-to-using-cocoapods-with-react-native-46cb4d372995#.wzp2qq1hn) 42 | - [60 fps on the mobile web](http://engineering.flipboard.com/2015/02/mobile-web/) 43 | - [Parse and React (incl. Native)](http://blog.parse.com/2015/03/25/parse-and-react-shared-chemistry/) 44 | - [React Native: Initial Thoughts (opinion)](http://unredacted.redalemeden.com/2015/initial-thoughts-about-react-native/) 45 | - [A Dynamic Crazy Native Mobile Future Powered by Javascript](https://medium.com/@clayallsopp/a-dynamic-crazy-native-mobile-future-powered-by-javascript-70f2d56b1987) 46 | - [ReactNative NES & More](http://moduscreate.com/react-native-has-landed/) 47 | - [React Native Installation and Setup](https://github.com/checkraiser/beginning-react-native/blob/master/1.Installation_and_setup.md) 48 | - [Diary of Building an iOS App with React Native](http://herman.asia/building-a-flashcard-app-with-react-native) 49 | - [Reflecting on React Native development](http://habd.as/reflecting-on-react-native-development/) 50 | - [React-Native layout examples](http://browniefed.com/blog/2015/06/07/react-native-layout-examples/) 51 | - [React Native in Production](https://medium.com/@clayallsopp/react-native-in-production-2b3c6e6078ad) - notes from Clay Allsop 52 | - [React Native for Android](https://code.facebook.com/posts/1189117404435352/) and [issues](http://facebook.github.io/react-native/docs/known-issues.html) 53 | - [An iOS Developer on React Native](https://medium.com/ios-os-x-development/an-ios-developer-on-react-native-1f24786c29f0) 54 | - [React Native and WebRTC](https://webrtchacks.com/reacting-to-react-native-for-native-webrtc-apps-alexey-aylarov/) 55 | - [Building 3 React Native Apps in One Summer](https://medium.com/@rpastorelle/building-3-react-native-apps-in-one-summer-dcd0c31454ff) 56 | - [How to bridge a Swift view](http://browniefed.com/blog/2015/11/28/react-native-how-to-bridge-a-swift-view/) 57 | - [Building a Native SoundCloud Android app with Redux](https://wiredcraft.com/blog/native-soundcloud-android-app/) - discussing redux, code reuse and performance on Android. 58 | - [React Native Twitter exploding heart](http://browniefed.com/blog/2015/11/07/react-native-how-to-create-twitter-exploding-hearts/) - hardcore animations with Animation and ReactART 59 | - [Using AI to discover UI components](https://www.youtube.com/watch?v=_iiKl0BB6ho) - fun image processing / AI assisted process to discover and generate React Native UI 60 | - [Writing Android Components](https://medium.com/@sejoker/writing-android-component-for-react-native-e34802bf3377) 61 | - [React Native and Fastlane](https://weluse.de/blog/react-native-deployment-with-fastlane.html) - small tweaks required to rig Fastlane with React Native 62 | - [Unit Testing React Native with Mocha and Enzyme](https://blog.formidable.com/unit-testing-react-native-with-mocha-and-enzyme-51518f13ba73) 63 | - [React Native's Layout Animation is Awesome](https://medium.com/@Jpoliachik/react-native-s-layoutanimation-is-awesome-4a4d317afd3e) 64 | 65 | ## Internals 66 | 67 | Content focusing about React Native under the hood. 68 | 69 | - [Performance](https://facebook.github.io/react-native/docs/performance.html#common-sources-of-performance-problems) 70 | - [Android Performance](https://facebook.github.io/react-native/docs/android-ui-performance.html) 71 | - [React Native Debugger Internals](https://medium.com/@shaheenghiassy/deep-diving-react-native-debugging-ea406ed3a691) 72 | - [Dirty-up and execute top-down](http://blog.vjeux.com/2015/javascript/dirty-up-and-execute-top-down.html) - @vjeux on React's optimizations for background color, layout, and more 73 | - [React Packager README.md](https://github.com/facebook/react-native/blob/master/packager/README.md) 74 | - [React Native Bridge](http://tadeuzagallo.com/blog/react-native-bridge/) 75 | - [Optimizing React Native](https://www.youtube.com/watch?v=0MlT74erp60) 76 | - [Supported Babel/Javascript Features](https://github.com/facebook/react-native/blob/master/babel-preset/configs/main.js) 77 | 78 | ## Components 79 | 80 | Components and native modules. For more search [JS.COACH](https://js.coach/react-native). 81 | 82 | ### UI 83 | 84 | - [apsl-react-native-button ★120](https://github.com/APSL/react-native-button) - React Native button component with rounded corners. 85 | - [autoresponsive-react-native ★45](https://github.com/xudafeng/autoresponsive-react-native) - A Magical Layout Library For React 86 | - [ex-navigator ★358](https://github.com/exponentjs/ex-navigator) - Route-centric navigation built on top of React Native's Navigator 87 | - [react-native-ya-navigator ★6](https://github.com/xxsnakerxx/react-native-ya-navigator) - Yet another react native navigator component 88 | - [gl-react-native ★670](https://github.com/ProjectSeptemberInc/gl-react-native) - use OpenGL for performant effects on images and videos 89 | - [k-react-native-swipe-unlocker ★14](https://github.com/leowang721/k-react-native-swipe-unlocker) - A simple swipe unlock for React Native 90 | - [metpro-react-native-progress ★13](https://github.com/imartingraham/react-native-progress) - Progress indicators and spinners for React Native using ReactART. 91 | - [react-native-accordion ★118](https://github.com/naoufal/react-native-accordion) - An Accordion Component for React Native 92 | - [react-native-action-button ★193](https://github.com/mastermoo/react-native-action-button) - A customizable Float Button Component for React Native 93 | - [react-native-actionsheet-native ★1](https://github.com/slowpath/react-native-actionsheet) - Android ActionSheet support for React Native 94 | - [react-native-activity-view ★176](https://github.com/naoufal/react-native-activity-view) - iOS share and action sheets for React Native 95 | - [react-native-adbannerview ★29](https://github.com/Purii/react-native-adbannerview) - React Native Bridge for ADBannerView 96 | - [react-native-alphabetlistview ★40](https://github.com/sunnylqm/react-native-alphabetlistview) - A Listview with a sidebar to jump to sections directly, based on johanneslumpe's react-native-selectablesectionlistview 97 | - [react-native-android-blurryoverlay ★26](https://github.com/kwaak/react-native-android-blurryoverlay) - A react native android package to show a blurry overlay. 98 | - [react-native-android-circles ★6](https://github.com/kwaak/react-native-android-circles) - A react native android package to show a circle progress view. 99 | - [react-native-android-iconify ★27](https://github.com/lwhiteley/react-native-android-iconify) - icons for react native android using android-iconify 100 | - [react-native-android-statusbar ★64](https://github.com/NishanthShankar/react-native-android-statusbar) - A react native android package to control the status bar. 101 | - [react-native-awesome-button ★56](https://github.com/larsvinter/react-native-awesome-button) - A React Native component rendering a button supporting showing different appearances and functionality given the passed props 102 | - [react-native-autolink ★16](https://github.com/joshswan/react-native-autolink) - Autolinking component for React Native 103 | - [react-native-autocomplete ★71](https://github.com/nulrich/RCTAutoComplete) - React Native Component for MLPAutoCompleteTextField 104 | - [react-native-autocomplete-input ★11](https://github.com/l-urence/react-native-autocomplete-input) - Pure javascript autocomplete input for react-native 105 | - [react-native-avatar-gravatar ★1](https://github.com/niborb/react-native-gravatar) - React Native Gravatar component 106 | - [react-native-better-mapview ★3](https://github.com/ModusCreateOrg/react-native-better-mapview) - A better React Native implementation for iOS MapKit MapView 107 | - [react-native-blur ★400](https://github.com/Kureev/react-native-blur) - React Native Blur component 108 | - [react-native-button ★223](https://github.com/ide/react-native-button) 109 | - [react-native-cache-image ★29](https://github.com/remobile/react-native-cache-image) - A cache-image for react-native 110 | - [react-native-cacheable-image ★3](https://github.com/jayesbe/react-native-cacheable-image) - A filesystem cacheable image component for react-native 111 | - [react-native-calendar-android ★19](https://github.com/chymtt/ReactNativeCalendarAndroid) - A simple material-themed calendar for react native android 112 | - [react-native-calendar ★88](https://github.com/christopherdro/react-native-calendar) - Calendar Component for React Native 113 | - [react-native-canvas ★52](https://github.com/lwansbrough/react-native-canvas) - A Canvas element for React Native 114 | - [react-native-carousel ★158](https://github.com/nick/react-native-carousel) - Simple carousel component for react-native 115 | - [react-native-carousel-control ★30](https://github.com/machadogj/react-native-carousel-control) - React Native Carousel control with support for iOS and Android. 116 | - [react-native-chart ★297](https://github.com/onefold/react-native-chart) - react-native-chart is a simple module for adding line charts, area charts, or bar charts to your React Native app. 117 | - [react-native-charts ★32](https://github.com/PrazAs/react-native-charts) - Delightfully-animated data visualization. 118 | - [react-native-checkbox ★21](https://github.com/sconxu/react-native-checkbox) - Checkbox component for React native 119 | - [react-native-circle-checkbox ★7](https://github.com/ParamoshkinAndrew/ReactNativeCircleCheckbox) - Circle checkbox component for React Native 120 | - [react-native-circle-progress ★20](https://github.com/guodong000/react-native-circle-progress) - A custom Circle Progress Indocator for React Native 121 | - [react-native-circle-view ★24](https://github.com/nucleartux/react-native-circle-view) - circle progress for react native android using CircleView 122 | - [react-native-circular-progress ★107](https://github.com/bgryszko/react-native-circular-progress) - React Native component for creating animated, circular progress with ReactART 123 | - [react-native-collapsible ★132](https://github.com/oblador/react-native-collapsible) - Animated collapsible component for React Native using the new Animated API with fallback. Good for accordions, toggles etc 124 | - [react-native-countdown ★6](https://github.com/buhe/react-native-countdown) - react native countdown button 125 | - [react-native-country-picker ★2](https://github.com/tofugear/react-native-country-picker) - React Native Country Picker 126 | - [react-native-create-new-file-ios ★0](https://github.com/rhaker/react-native-create-new-file-ios) - A react-native interface for creating a blank new file on ios. File must not already exist. 127 | - [react-native-custom-actsheet ★23](https://github.com/guodong000/react-native-custom-actsheet) - A custom ActionSheet for react-native 128 | - [react-native-dashed-border ★17](https://github.com/chirag04/react-native-dashed-border) - A element for react-native 129 | - [react-native-date ★34](https://github.com/nucleartux/react-native-date) - React Native date and time pickers for Android 130 | - [react-native-timepicker ★6](https://github.com/milasevicius/react-native-timepicker) - React Native timepicker for iOS 131 | - [react-native-device-display ★55](https://github.com/kkjdaniel/react-native-display-view) - A simple way to create dynamic views through device and display detection, allowing the creation of adaptable and universal apps. 132 | - [react-native-dialogs ★135](https://github.com/aakashns/react-native-dialogs) - React Native wrappers for https://github.com/afollestad/material-dialogs 133 | - [react-native-double-buffer ★1](https://github.com/alinz/react-native-double-buffer) - Simple React Native Double Buffer View 134 | - [react-native-draggable-drawer ★12](https://github.com/llanox/react-native-draggable-drawer) - DraggableDrawer component for React Native. 135 | - [react-native-drawer ★489](https://github.com/rt2zz/react-native-drawer) - React Native Drawer 136 | - [react-native-dropbox-chooser ★9](https://github.com/tinycreative/react-native-dropbox-chooser) - React Native dropbox chooser module 137 | - [react-native-dropdown-android ★47](https://github.com/chymtt/ReactNativeDropdownAndroid) - Simple wrapper for Android's Spinner to use with react-native 138 | - [react-native-drop-refresh ★3](https://github.com/Obooman/RCTRefreshControl) - A pull down to refresh control for react native. 139 | - [react-native-dropdown ★114](https://github.com/alinz/react-native-dropdown) - A better Select dropdown menu for react-native 140 | - [react-native-effects-view ★158](https://github.com/voronianski/react-native-effects-view) - ReactNative Component that makes easy to use iOS8 UIVisualEffect 141 | - [react-native-emoji ★32](https://github.com/jorilallo/react-native-emoji) - Emoji component for React Native 142 | - [react-native-fading-slides ★12](https://github.com/chagasaway/react-native-fading-slides) - Simple looped fading slides carousel for React Native 143 | - [react-native-flex-label ★4](https://github.com/eccolabs/react-native-flex-label) - A text label for React Native that handles multiple lines of text with ellipses truncation as well as vertical alignment within it's view container. 144 | - [react-native-floating-labels ★43](https://github.com/mayank-patel/react-native-floating-labels) - Reusabe floating lable component for react native 145 | - [react-native-fm-form ★6](https://github.com/peter4k/react-native-fm-form) - Generate list view form of React Native in few line of codes 146 | - [react-native-form-flux ★1](https://github.com/aksonov/react-native-form-flux) - React Native Form management using Flux architecture 147 | - [react-native-form ★53](https://github.com/julianocomg/react-native-form) - A simple react-native component to wrap your form fields! 148 | - [react-native-form-generator ★23](https://github.com/MichaelCereda/react-native-form-generator) - Generate amazing React Native forms in a breeze 149 | - [react-native-fontbase ★1](https://github.com/frostney/react-intl-native) - Defining font sizes in React Native 150 | - [react-native-fs-modal ★28](https://github.com/kirkness/react-native-fs-modal) - React native full screen modal component. 151 | - [react-native-full-screen ★1](https://github.com/Anthonyzou/react-native-full-screen) - React Native FullScreen api and element 152 | - [react-native-gesture-password ★85](https://github.com/spikef/react-native-gesture-password) - A gesture password component for React Native 153 | - [react-native-gesture-recognizers ★78](https://github.com/johanneslumpe/react-native-gesture-recognizers) - Gesture recognizer decorators for react-native 154 | - [react-native-gestures ★52](https://github.com/kiddkai/react-native-gestures) - composable gesture system in react native 155 | - [react-native-gifted-form ★256](https://github.com/FaridSafi/react-native-gifted-form) - Form component for react-native 156 | - [react-native-gifted-listview ★281](https://github.com/FaridSafi/react-native-gifted-listview) - A ListView that embed some recurrents features like pull-to-refresh, infinite scrolling and more for Android and iOS React-Native apps 157 | - [react-native-gifted-messenger ★598](https://github.com/FaridSafi/react-native-gifted-messenger) - Ready-to-use chat interface for iOS and Android React-Native apps 158 | - [react-native-gmaps ★56](https://github.com/teamrota/react-native-gmaps) - React Native Android Google Maps implementation. 159 | - [react-native-gravatar ★1](https://github.com/lwhiteley/react-native-gravatar) - react-native wrapper for gravatar-api 160 | - [react-native-grid-view ★124](https://github.com/lucholaf/react-native-grid-view) - React Native Grid/Collection View component 161 | - [react-native-grid ★7](https://github.com/thewei/react-native-grid) - The 24-column grid component for react-native 162 | - [react-native-ichart ★8](https://github.com/AdonRain/react-native-ichart) - ichart for react-native 163 | - [react-native-icons](https://github.com/corymsmith/react-native-icons), [video](https://www.youtube.com/watch?v=TEdM7IwTT1g#t=50) 164 | - [react-native-idle-timer ★12](https://github.com/marcshilling/react-native-idle-timer) - An Objective-C bridge that allows you to enable and disable the screen idle timer in your React Native app 165 | - [react-native-image-button ★3](https://github.com/remobile/react-native-image-button) - A image-button for react-native 166 | - [react-native-image-container ★0](https://github.com/frostney/react-native-image-container) - Image container for React Native 167 | - [react-native-image-picker ★537](https://github.com/marcshilling/react-native-image-picker) - A React Native module that allows you to use the native UIImagePickerController UI to select a photo from the device library or directly from the camera. 168 | - [react-native-imagewand ★3](https://github.com/NorthFoxz/react-native-imagewand) - image wand for react native 169 | - [react-native-invertible-scroll-view ★117](https://github.com/exponentjs/react-native-invertible-scroll-view) - An invertible ScrollView for React Native 170 | - [react-native-item-cell ★22](https://github.com/APSL/react-native-item-cell) - React Native default style iOS item cell 171 | - [react-native-keyboard-spacer ★104](https://github.com/Andr3wHur5t/react-native-keyboard-spacer) - Plug and play react-Native keyboard spacer view. 172 | - [react-native-keyboardevents ★167](https://github.com/johanneslumpe/react-native-keyboardevents) - Monitors keyboard show/hide notifications 173 | - [react-native-layout ★17](https://github.com/jerolimov/react-native-layout) - Semantic JSX layout components for react-native 174 | - [react-native-lightbox ★353](https://github.com/oblador/react-native-lightbox) - a very Slick and modern mobile lightbox implementation 175 | - [react-native-link ★5](https://github.com/650Industries/react-native-link) - A link component, similar to