shubhamd99 / react-native-bridge-app Goto Github PK

A native module is a Java class that usually extends the ReactContextBaseJavaModule class and implements the functionality required by the JavaScript. Our goal here is to be able to write ToastExample.show('Awesome', ToastExample.SHORT); from JavaScript to display a short toast on the screen.

Create a new Java Class named ToastModule.java inside android/app/src/main/java/com/your-app-name/.

Register the Module - The last step within Java is to register the Module; this happens in the createNativeModules of your apps package. If a module is not registered it will not be available from JavaScript. Create a new Java Class named CustomToastPackage.java inside android/app/src/main/java/com/your-app-name/ folder.

Open the ./ios/ project folder. Open the .xcodeproj file or the .xcworkspace file in Xcode.

Create a header file Device.h by following the steps File -> New -> File -> Header File and then name the file Device.h and choose the targets. Create a new folder Device if you like to organize files in a folder like me.

Let modify our Device.h file.

Now let's create the corresponding implementation file Device.m in the same location.

Similar to Android's getName method, here we have RCT_EXPORT_MODULE() macro. If no name is explicitly provided, it will take the name of the module. Here the name of the module is 'Device'. In order to expose a method from native module to Javascript just write a method inside the RCT_EXPORT_METHOD macro. These methods can be accessed from NativeModules of the react-native package.

Simple CLI to build React Native libraries for different targets. Link - https://www.npmjs.com/package/@react-native-community/bob

To create new project with Bob, run the following: yarn add --dev @react-native-community/bob

Automatic Config with yarn: npx @react-native-community/bob create react-native-awesome-module