Awesome React Native: Native Modules

If this project has helped you out, please support us with a star 🌟

A curated list of Awesome React Native: Native Modules Guidelines/Components/News/Tools/Learning Materials. For general React Native libraries please have a look at awesome-react-native.

Content

• Introduction

  • Things you should know BEFORE you create a Native Module
  • Eligibility Criteria for creating a Native Module
  • Advantages of Native Module
  • Disadvantage of Native Module

• Setup

  • How to create a Native Module
  • How to add Native Module to your app

• Creating Native Modules

  • Android
  • iOS

• Tutorials

  • Blogs
  • Videos
  • Samples

• Native Modules

  • UI Libraries
  • Loaders & Animation Libraries
  • Alert, Prompt, Action & Dialog Libraries
  • Image, Audio, Video & Docs Libraries
  • Network Libraries
  • Motion Sensor Libraries
  • Widget Libraries
  • OS, System & File Manager Libraries
  • Security & Auth Libraries
  • Charts & Graph Libraries
  • Utility, Build & Publish Libraries

• Credits

• Contributors

• License

UI: Native Modules

• react-native-linear-gradient ★1710: A component for react-native.

  

• react-native-tableview ★921: Native iOS UITableView for React Native with JSON support and more.

  

• react-native-overlay ★588: A component that brings content inside to the front of the view regardless of its current position in the component tree.

  

• react-native-search-bar ★582: The high-quality iOS native search bar for react native.

  

• react-native-bottom-sheet-behavior ★554: React Native wrapper for Android BottomSheetBehavior.

  

• react-native-sketch ★363: A React Native component for touch-based drawing.

  

• react-native-signature-capture ★343: A simple modular component for react native (iOS) to capture a signature as an image.

  

• react-native-effects-view ★275: Use iOS8 UIVisualEffectViews's blur and vibrancy with ReactNative.

  

• react-native-text-input-mask ★188: Text input mask for React Native, Android and iOS.

  

• react-native-cardview ★153: CardView for react-native (All Android version and iOS).

  

• RCTAutoComplete ★148: React Native Component for MLPAutoCompleteTextField.

  

• react-native-shimmer ★137: Simple shimmering effect for any view in React Native.

  

• react-native-collapsing-toolbar ★130: React Native wrapper for Android CollapsingToolbarLayout.

  

• react-native-custom-segmented-control ★102: Custom version of the IOS SegmentedControl component.

  

• react-native-android-kit ★94: Android Native Kit for React Native

  

• react-native-material-palette ★74: Bringing Material Palette API to React Native.

  

• react-native-ios-drag-drop ★63: Support for the iOS 11+ inter-app drag and drop.

  

• react-native-android-activity ★37: A React Native component for android view pager with tabs.

  

• react-native-full-screen ★31: Full screen functionality for Android.

  

• react-native-tabbed-view-pager-android ★21: A React Native component for android view pager with tabs.

  

• react-native-material-shadows ★19: React Native: Native Material Shadows.

  

• react-native-gradient-blur-view ★10: React Native: Native Gradient with Blur Effect.

  

• react-native-android-bottom-navigation ★10: Native UI Component of Android's BottomNavigation for react-native.

  

• react-native-radio-button-android ★4: A React Native Radio using the stock android widget.

  

• react-native-android-slidingtabstrip ★3: React Native sliding tab strip implementation for Android.

  

Loaders & Animation: Native Modules

• react-native-spinkit ★1230: A collection of animated loading indicators for React Native.

  

• react-native-spruce ★215: React Native Bridge for Native Spruce Animation Library.

  

• react-native-shine-button ★87: React Native: Native Shine Button - Effects like shining.

  

• react-native-taptargetview ★66: React Native Bridge for Android KeepSafe/TapTargetView.

  

• react-native-iconic ★58: React Native - Native Animated Icons with different states.

  

• react-native-material-showcase-ios ★50: React Native Bridge for aromajoin/material-showcase-ios.

  

• react-native-download-button ★35: React Native: Native Download Button: with pretty cool animation.

  

• react-native-progresshub ★11: An implement of ProgressHUD for React-Native, similar to MBProgressHUD for iOS and KProgressHUD for Android.

  

• react-native-siri-wave-view ★8: React Native: Native Siri Wave View.

  

• react-native-dialog-progress ★1: A dialog showing a progress indicator for React Native.

  

Alter, Prompt, Action & Dialog: Native Modules

• react-native-picker ★870: A Native Picker with high performance.

  

• react-native-activity-view ★387: iOS share and action sheets for React Native.

  

• react-native-dialogs ★382: React Native wrappers for material-dialogs.

  

• react-native-tooltip ★176: A react-native wrapper for showing tooltips.

  

• react-native-snackbar ★172: Material-design "Snackbar" component for Android and iOS.

  

• react-native-bottom-action-sheet ★90: React Native: Native Bottom Action Sheet.

  

• react-native-popover-menu ★68: React Native: Native Popover Menu.

  

• react-native-action-sheet ★66: React native simple action sheet with native android (using the built-in AlertDialog).

  

• react-native-prompt-android ★53: A polyfill library for Alert.prompt on Android platform, working both on Android and iOS platform.

  

• react-native-custom-actsheet ★39: A custom ActionSheet for React Native.

  

• react-native-bem-check-box ★28: React Native bridge for awesome BEMCheckBox.

  

• react-native-nmrangeslider-ios ★24: React Native Slider component with two markers based on NMRangeSlider.

  

• react-native-tooltips ★18: React Native: Native Tooltip View.

  

• react-native-android-location-enabler ★11: Display a GoogleMap like android popup to ask for user to enable location services if disabled.

  

Image, Audio, Video & Docs: Native Modules

• react-native-camera ★4725: A Camera component for React Native. Also supports barcode scanning!.

  

• react-native-image-picker ★3446: A React Native module that allows you to use native UI to select media from the device library or directly from the camera.

  

• react-native-video ★2582: A

  

• react-native-svg ★2157: SVG library for React Native.

  

• react-native-image-crop-picker ★1790: iOS/Android image picker with support for camera, configurable compression, multiple images and cropping.

  

• react-native-sound ★1114: React Native module for playing sound clips.

  

• react-native-view-shot ★555: Snapshot a React Native view and save it to an image.

  

• react-native-youtube ★514: A component for React Native.

  

• react-native-image-resizer ★470: 🗻 Resize local images with React Native.

  

• react-native-photo-view ★464: Pinch-to-zoom view for React Native (both iOS and Android).

  

• react-native-camera-kit ★422: Advanced native camera and gallery controls and device photos API.

  

• react-native-video-processing ★353: Native Video editing/trimming/compressing 🎥 library for React-Native.

  

• react-native-pdf-view ★282: React Native PDF View.

  

• react-native-pdf ★216: A React Native PDF view module.

  

• react-native-voice ★195: React Native Voice Recognition library for iOS and Android (Online and Offline Support).

  

• react-native-doc-viewer ★176: React Native Doc Viewer (Supports file formats: xls,ppt,doc,xlsx,pptx,csv,docx,png,jpg,pdf,xml,binary ...).

  

• react-native-media-kit ★171: Video(and audio) component for react-native apps, supporting both iOS and Android. A unified and elegant player controller is provided by default. The API is similar with HTML video.

  

• react-native-html-to-pdf ★122: Convert html strings to PDF documents using React Native.

  

• react-native-document-picker ★119: Document Picker for React Native using Document Providers.

  

• react-native-image-tools ★109: Image editing software powered by Abode Creative SDK for iOS and Android.

  

• react-native-vlc-player ★60: VLC Player for React Native.

  

• ReactNativeBarcodeScanner ★58: Implemented a barcode scanner with support of react native technology.

  

• react-native-image-intent ★41: 🔬 Image intent receiver for React Native android.

  

• react-native-image-sequence ★38: Native implementation for creating frame based image animations.

  

• react-native-multiple-image-picker ★32: React Native Multiple Image Picker.

  

• react-native-quick-look ★30: React Native Component for iOS QuickLook Framework.

  

• react-native-thumbnail ★30: Get thumbnail from local media. Currently, it only supports for video.

  

• react-native-palette ★30: A library wrapping the Android Palette class to extract colors from an image.

  

• react-native-photoeditorsdk ★26: React Native module for PhotoEditor SDK.

  

• react-native-videoeditorsdk ★21: React Native module for VideoEditor SDK.

  

• react-native-compress ★15: Compress video for react native. Only for iOS, Android will be coming.

  

• react-native-pdf-lib ★11: Library for creating and editing PDFs in React Native.

  

Monetization: Native Modules

• https://github.com/sbugert/react-native-admob ★648: React Native Google Admob.

  

• https://github.com/dooboolab/react-native-iap ★318: React Native In App Purchase.

  

Network: Native Modules

• react-native-push-notification ★2509: React Native Local and Remote Notifications.

  

• react-native-fetch-blob ★1940: A project committed to making file access and data transfer easier, efficient for React Native developers.

  

• react-native-webrtc ★1321: A WebRTC module for React Native.

  

• react-native-mapbox-gl ★1278: A Mapbox GL react native module for creating custom maps.

  

• react-native-ble-plx ★586: React Native BLE library.

  

• react-native-payments ★552: Accept Payments with Apple Pay and Android Pay using the Payment Request API.

  

• react-native-ble-manager ★456: React Native BLE communication module.

  

• react-native-cookies ★442: Cookie manager for React Native.

  

• react-native-ibeacon ★310: 📡 iBeacon support for React Native.

  

• react-native-mail ★266: A wrapper on top of MFMailComposeViewController from iOS and Mail Intent on android.

  

• react-native-bluetooth-serial ★204: Port of BluetoothSerial for React Native.

  

• react-native-speech ★199: A text-to-speech library for React Native.

  

• react-native-gcm-android ★170: GCM for React Native Android.

  

• react-native-background-upload ★168: Cross platform http post file uploader with android and iOS background support.

  

• react-native-network-info ★153: React Native library for getting information about the devices network.

  

• react-native-ble ★151: Central role BLE for react native noble api surface.

  

• react-native-android-sms-listener ★136: Allows you to listen for incoming SMS messages using React Native.

  

• react-native-browser ★87: Full-featured web browser module for React Native apps, based on TOWebViewController.

  

• react-native-print ★84: Print documents using React Native.

  

• react-native-geo-fencing ★74: Native modules to determine if a location is within defined geographical boundaries using Google Geometry library.

  

• react-native-link-preview ★61: Javascript module that allows to extract URL information from text.

  

• react-native-callkit ★60: iOS 10 new CallKit framework for React Native.

  

• react-native-android-speech ★45: This simple React Native module for Android Text To Speech functionality.

  

• react-native-fused-location ★43: Finest location for react-native on Android using the new Fused API.

  

• react-native-kontaktio ★35: React Native (iOS and Android) library for Kontakt.io beacons (and all other beacons).

  

• react-native-nfc-ios ★32: Easy to use CoreNFC for React Native.

  

• react-native-carrier-info ★25: React Native module bridge to obtain information about the user’s home cellular service provider.

  

• react-native-media-meta ★18: Get media file metadata in your React Native app.

  

• react-native-android-geolocation ★18: React Native Module to use Android Geolocation via Google Play API.

  

• react-native-region-monitor ★6: A simple and easy to use geographical region monitoring API for React Native. This works for iOS, and Android is there but needs testing.

  

• react-native-google-pay: Accept Payments with Google Pay for React Native apps.

  

• react-native-apay: Accept Payments with Apple Pay for React Native apps.

  

Motion Sensor: Native Modules

• react-native-gesture-handler ★484: New declarative API for gesture handling in react-native.

  

• react-native-motion-manager ★203: CMMotionManager wrapper for react-native.

  

• react-native-sensor-manager ★146: Native sensors access for react-native.

  

• react-native-proximity ★128:📱 A React Native wrapper that provides access to the proximity sensor on iOS and Android.

  

Widget: Native Modules

• react-native-android-widget-poc ★70: React Native Android widgets bridged to JS, a proof of concept.

  

OS, System & File Manager: Native Modules

• react-native-device-info ★2101: Device Information for React Native iOS and Android.

  

• react-native-fs ★1795: Native filesystem access for react-native.

  

• react-native-i18n ★1249: React Native + i18n.js.

  

• react-native-config ★1177: Bring some 12 factor love to your mobile apps.

  

• react-native-share ★960: Share Social , Sending Simple Data to Other Apps.

  

• react-native-notifications ★882: React Native Notifications.

  

• react-native-contacts ★635: React Native Contacts.

  

• react-native-keychain ★593: Keychain Access for React Native.

  

• react-native-quick-actions ★508: A react-native interface for 3D Touch home screen quick actions.

  

• react-native-background-timer ★349: Emit event periodically (even when app is in the background).

  

• react-native-background-job ★322: Schedule background jobs in React Native that run your JavaScript when your app is in the background/killed.

  

• react-native-social-share ★306: Use the iOS and Android native Twitter and Facebook share popup with React Native.

  

• react-native-share-extension ★286: React Native as an engine to drive share extension.

  

• react-native-google-cast ★217: A library that unifies both android and iOS chromecast sdk.

  

• react-native-branch-deep-linking ★215: NPM module for integrating Branch deep linking with React Native apps.

  

• react-native-keep-awake ★210: Keep the screen from going to sleep. iOS and Android.

  

• react-native-keyboard-manager ★165: Library that allows to prevent issues of keyboard sliding up and cover on React-Native iOS projects.

  

• react-native-zip-archive ★115: Zip archive utility for react-native.

  

• react-native-unified-contacts ★104: Your best friend when working with the latest and greatest Contacts Framework in iOS 9+ in React Native.

  

• react-native-discovery ★75: Discover nearby devices using BLE.

  

• react-native-share-menu ★74: A module for React Native that adds your app to the share menu of the device.

  

• React-Native-Calendar-Reminders ★59: React Native Module for IOS Calendar Reminders.

  

• react-native-phone-picker ★52: React Native component for select phone number from address book.

  

• react-native-exit-app ★40: Exit,close,kill,shutdown app completely for React Native on iOS and Android.

  

• react-native-app-info ★39: Get app version from NSBundle.

  

• react-native-search-api ★23: The SearchApi module gives you a general React Native interface to interact with the iOS Search API, Core Spotlight.

  

• react-native-battery ★20: Plugin for react native that adds an listener for the battery status of a device.

  

• react-native-get-music-files ★14: React Native package to get music files from local and sd for iOS and Android.

  

• react-native-android-packagemanager ★12: Call some PackageManager APIs from React Native.

  

• react-native-dimmer ★4: A plugin that allows you to enable (eventually lock the device) and disable the screen dim in your React Native app. Works in both iOS and Android.

  

• react-native-sms-retriever: SMS Retriever API for Android.

  

Security & Auth: Native Modules

• react-native-google-signin ★768: Google Signin for your react native applications.

  

• react-native-permissions ★670: Check and request user permissions in ReactNative (iOS and Android).

  

• react-native-touch-id ★601: React Native authentication with the native Touch ID popup.

  

• react-native-oauth ★447: A react-native wrapper for social authentication login for both Android and iOS.

  

• react-native-fingerprint-scanner ★172: Provide Touch ID Fingerprint Scanner for React Native (Compatible with both Android and iOS).

  

• react-native-auth0 ★128: React Native toolkit for Auth0 API.

  

• react-native-privacy-snapshot ★102: Obscure passwords and other sensitive personal information when a react-native app transitions to the background.

  

Chart & Graph: Native Modules

• react-native-charts-wrapper ★648: A React Native charts wrapper (support android & ios).

  

• react-native-svg-charts ★154: 📈 One library to rule all charts for React Native 📊.

  

Utility, Build & Publish: Native Modules

• react-native-code-push ★4150: React Native module for CodePush.

  

• react-native-exception-handler ★246: A react native module that lets you to register a global error handler that can capture fatal/non fatal uncaught exceptions.

  

• react-native-awesome-card-io ★235: A complete and cross-platform card.io component for React Native (iOS and Android).

  

• react-native-hockeyapp ★105: HockeyApp integration for React Native with Android and iOS support.

  

• rn-apple-healthkit ★95: A React Native package for interacting with Apple HealthKit.

  

• react-native-cordova ★35: A cordova plugin bridge for react-native.

  

Credits

• All the contributors of above listed Native Module libraries.
• Icons used by aha-soft

✨ Credits

🤔 How to contribute

Have an idea? Found a bug? Please raise to ISSUES. Contributions are welcome and are greatly appreciated! Every little bit helps, and credit will always be given.

💫 Where is this library used?

If you are using this library in one of your projects, add it in this list below. ✨

📜 License

This library is provided under the Apache License.

AwesomeReactNativeNativeModules @ prscX

💖 Support my projects

I open-source almost everything I can, and I try to reply everyone needing help using these projects. Obviously, this takes time. You can integrate and use these projects in your applications for free! You can even change the source code and redistribute (even resell it).

However, if you get some profit from this or just want to encourage me to continue creating stuff, there are few ways you can do it:

• Starring and sharing the projects you like 🚀

• If you're feeling especially charitable, please follow prscX on GitHub.

  

  Thanks! ❤️
  prscX.github.io
  </ Pranav >