Last Updated on September 10, 2020
Table of Contents
1. Native Modules
2. Native Bridge component
- Native Bridge Android
- Native Bridge iOS
In this blog post, I will get you through both Android as well as iOS.
Define Native Modules
Native Module Steps:
Let’s understand the native modules with examples.
Create the Exit App
We will create an ExitApp demo using react-native CLI. In this example, button press to exit the app using the native language.
Hopefully, your project runs successfully.
Native Bridge component
This tool comes handy for React Native Developer to bridge the native component
1. React Native Bridge Android
Create a new java class, ExitModule, and ExitModulePackage.
So it is a class that extends ReactContextBaseJavaModule.
So it is a class that extends ReactPackage.
Registering new JS modules that can be accessed from native modules or from other parts.
The native code requires JS modules from the package that doesn’t automatically be included as a part of the JS bundle, so there should be a corresponding piece of code on the JS side that will require the implementation of that JS module so that it gets bundled.
ExitPackage add in MainApplication.java
2. React Native Bridge iOS
Create new file ExitModule in Xcode File/New/File/Cocoa Touch Class
RCTBridgeModule use in native land to talk with React Native
Your class must also include the RCT_EXPORT_MODULE() macro. RCT is the short name for React and includes it in your Objective-C code.
RCT_EXPORT_METHOD supports this standard JSON object types:
- NSString (string)
- NSInteger, float, double, CGFloat, NSNumber(number)
- BOOL, NSNumber(boolean)
- NSArray (array)
- NSDictionary (object)
- RCTResponseSenderBlock (function)
Now run the app
To access the code of this blog post can be accessed here .
We are a globally renowned React Native Development company; we let you outsource React Native developers from us to gain a competitive advantage fulfilling your varied business objectives.