Read More

creating module for react-native

The module is a very important thing in our development, By using module we split our problems into many parts or we can generalize our problems into a specific form.  In this blog, I will focus on how to create a module in the react-native project and how to implement it on our existing project manually.

Native Module Setup

Native modules are usually distributed as npm packages, apart from the typical javascript files and resources they will contain an Android library project. This project is, from NPM’s perspective similar to any other media asset, meaning there isn’t anything unique about it from this point of view.

React native Community recommends us the third party tool library to create a basic structure of module without any worry for module structure.

Library Name– “create-react-native-module”

Installation- 

Requirements: Node 8.0+

Packages required to be installed globally if the recommended example app is generated:

React Native CLI installation –

To install this tool package-

Creating a module by using this tool-

This will create the folder react-native-mobikul-toast in which the library will be created in.

Now install dependencies by running this command in the newly created library.

 

How to look its folder structure-

 

Options with creating modules by this tool-

The alternative of this tool- 

 

After this, we will be able to continue to Native Modules (iOS) or Native Modules (Android) to add in some code. Make sure to read the README.md within our MobikulToast  Directory for platform-specific instructions on how to include the project.

How to use this module in our existing Applications?

We can use this library via uploading on npm server and then install it like other library-

or we can use manually- For manual use follow the following process.

We need to add our “react-native-mobikul-toast”  module folder to node_modules.

For Android Setup-

Include our module setup in our setting.gradle file as like another npm library

Add module dependency in our app-level build.gradle file

For iOS Setup-

Add this module dependency in our existing project Podfile in iOS application

 

This is all my prospect to create a module and how to use our module to our existing Application. If you have any queries for this blog please comment.

NOTE- I will explain how to use library functions for our application in my next blog. It will come soon and link provides in this blog.

Thanks for reading my blog.

References-
https://github.com/brodybits/create-react-native-module

https://facebook.github.io/react-native/docs/getting-started

 

 

. . .

Comment

Add Your Comment

Be the first to comment.

css.php
Hire Us!
Brief us about your requirements and we'll get back to you.
Woo! Hooy!
We have just recieved your project brief and our expert will contact you shortly.
Send Again
Close