Table of contents

• [Setup] Create the calculator folder and the package.json
• [Native Module] Create the JS import
• [Native Module] Create the iOS implementation

Steps

[Setup] Create the calculator folder and the package.json

1. mkdir calculator
2. touch calculator/package.json
3. Paste the following code into the package.json file

{
    "name": "calculator",
    "version": "0.0.1",
    "description": "Showcase Turbomodule with backward compatibility",
    "react-native": "src/index",
    "source": "src/index",
    "files": [
        "src",
        "android",
        "ios",
        "calculator.podspec",
        "!android/build",
        "!ios/build",
        "!**/__tests__",
        "!**/__fixtures__",
        "!**/__mocks__"
    ],
    "keywords": ["react-native", "ios", "android"],
    "repository": "https://github.com/<your_github_handle>/calculator",
    "author": "<Your Name> <your_email@your_provider.com> (https://github.com/<your_github_handle>)",
    "license": "MIT",
    "bugs": {
        "url": "https://github.com/<your_github_handle>/calculator/issues"
    },
    "homepage": "https://github.com/<your_github_handle>/calculator#readme",
    "devDependencies": {},
    "peerDependencies": {
        "react": "*",
        "react-native": "*"
    }
}

[Native Module] Create the JS import

1. mkdir calculator/src
2. touch calculator/src/index.js
3. Paste the following content into the index.js

// @flow
import { NativeModules } from 'react-native'

export default NativeModules.Calculator;

[Native Module] Create the iOS implementation

1. mkdir calculator/ios
2. Create an ios/RNCalculator.h file and fill it with the following code:

   #import <Foundation/Foundation.h>
   #import <React/RCTBridgeModule.h>
   
   @interface RNCalculator : NSObject <RCTBridgeModule>
   
   @end

3. Create an ios/RNCalculator.m file and replace the code with the following:

   #import "RNCalculator.h"
   
   @implementation RNCalculator
   
   RCT_EXPORT_MODULE()
   
   RCT_REMAP_METHOD(add, addA:(NSInteger)a
                           andB:(NSInteger)b
                   withResolver:(RCTPromiseResolveBlock) resolve
                   withRejecter:(RCTPromiseRejectBlock) reject)
   {
       NSNumber *result = [[NSNumber alloc] initWithInteger:a+b];
       resolve(result);
   }
   
   @end

4. In the calculator folder, create a calculator.podspec file
5. Copy this code in the podspec file

require "json"

package = JSON.parse(File.read(File.join(__dir__, "package.json")))

Pod::Spec.new do |s|
  s.name            = "calculator"
  s.version         = package["version"]
  s.summary         = package["description"]
  s.description     = package["description"]
  s.homepage        = package["homepage"]
  s.license         = package["license"]
  s.platforms       = { :ios => "11.0" }
  s.author          = package["author"]
  s.source          = { :git => package["repository"], :tag => "#{s.version}" }

  s.source_files    = "ios/**/*.{h,m,mm,swift}"

  s.dependency "React-Core"
end