rn-codemi-learning
Learning module from codemi for reusable purpose
Last updated a year ago by addingama .
ISC · Repository · Bugs · Original npm · Tarball · package.json
$ cnpm install rn-codemi-learning 
SYNC missed versions from official npm registry.

RN Codemi Learning Module

Warning

Please make sure the project RN Version is equal with this library (0.57.8)

Installation

  1. react-native init --version="0.57.8" project_name
  2. Open package.json, copy dependencies except react and react-native and paste it to project dependencies in package.json.
  3. copy devDependencies and paste it to project devDependencies
  4. npm install
  5. react-native link
  6. cd ios && pod init
  7. Update Podfile
      platform :ios, '9.0'
    
      target 'project_name' do
        # Uncomment the next line if you're using Swift or would like to use dynamic frameworks
        # use_frameworks!
        rn_path = "../node_modules/react-native"
        pod 'yoga', path: "#{rn_path}/ReactCommon/yoga/yoga.podspec"
        pod 'React', path: rn_path, subspecs: [
          'Core',
          'CxxBridge',
          'DevSupport',
          'RCTActionSheet',
          'RCTAnimation',
          'RCTGeolocation',
          'RCTImage',
          'RCTLinkingIOS',
          'RCTNetwork',
          'RCTSettings',
          'RCTText',
          'RCTVibration',
          'RCTWebSocket',
        ]
        pod 'DoubleConversion', :podspec => '../node_modules/react-native/third-party-podspecs/DoubleConversion.podspec'
        pod 'glog', :podspec => '../node_modules/react-native/third-party-podspecs/glog.podspec'
        pod 'Folly', :podspec => '../node_modules/react-native/third-party-podspecs/Folly.podspec'
        
    
        # Pods for codemi_apps
        pod 'Firebase/Core', '~> 5.14.0'
        pod 'Firebase/Messaging'
    
        pod 'RNSVG', :path => '../node_modules/react-native-svg'
        pod 'rn-fetch-blob',
          :path => '../node_modules/rn-fetch-blob'
    
        pod 'react-native-youtube', :path => '../node_modules/react-native-youtube'
    
        pod 'Fabric', '~> 1.7.13'
        pod 'Crashlytics', '~> 3.10.7'
    
    
        pod 'react-native-background-upload', :path => '../node_modules/react-native-background-upload'
    
        pod 'react-native-fast-image', :path => '../node_modules/react-native-fast-image'
    
        post_install do |installer|
          installer.pods_project.targets.each do |target|
              if target.name == "React"
                  target.remove_from_project
              end
          end
        end
    
        target 'project_nameTests' do
          inherit! :search_paths
          # Pods for testing
        end
    
      end
    
  8. pod install
  9. Update Gradle version on android/gradle/wrapper/gradle-wrapper.properties to 4.6
  10. Update android/build.gradle with this
      // Top-level build file where you can add configuration options common to all sub-projects/modules.
    
      buildscript {
          ext {
              buildToolsVersion = "27.0.3"
              minSdkVersion = 16
              compileSdkVersion = 27
              targetSdkVersion = 26
              supportLibVersion = "27.1.1"
          }
          repositories {
              google()
              jcenter()
              maven {
                  url 'https://maven.fabric.io/public'
              }
          }
          dependencies {
              classpath 'com.android.tools.build:gradle:3.2.0'
              classpath 'com.google.gms:google-services:4.0.1'
              classpath 'io.fabric.tools:gradle:1.25.4'
    
              // NOTE: Do not place your application dependencies here; they belong
              // in the individual module build.gradle files
          }
      }
    
      allprojects {
          repositories {
              mavenLocal()
              google()
              jcenter()
              
              maven {
                url 'https://maven.google.com/'
            }
              maven {
                  // All of React Native (JS, Obj-C sources, Android binaries) is installed from npm
                  url "$rootDir/../node_modules/react-native/android"
              }
              
          }
      }
    
      subprojects {
          afterEvaluate { project ->
              if (project.hasProperty("android")) {
                  android {
                      compileSdkVersion 27        // version of compile sdk used for project
                      buildToolsVersion '27.0.3'    // version of build tool used for project
                  }
              }
          }
      }
    
    
      task wrapper(type: Wrapper) {
          gradleVersion = '4.6'
          distributionUrl = distributionUrl.replace("bin", "all")
      }
    
  11. Update android/app/build.gradle with this
      android {
        ...
    
          defaultConfig {
            ...
            multiDexEnabled true
            vectorDrawables.useSupportLibrary = true
            ...
          }
          // add this line
          compileOptions {
            targetCompatibility JavaVersion.VERSION_1_8
          }
        ...
      }
    
      dependencies {
        // add all this dependencies
          implementation project(':react-native-fast-image')
          implementation('com.crashlytics.sdk.android:crashlytics:2.9.5@aar') {
              transitive = true
          }
          implementation project(':react-native-youtube')
          implementation 'com.android.support:multidex:1.0.2'
          implementation project(':react-native-svg')
          implementation project(':react-native-firebase')
          implementation project(':rn-fetch-blob')
          implementation project(':react-native-pdf')
          implementation project(':react-native-webview-bridge')
          implementation project(':react-native-linear-gradient')
          implementation project(':react-native-thumbnail')
          implementation project(':react-native-fs')
          implementation project(':react-native-orientation')
          implementation project(':react-native-video')
          implementation project(':react-native-image-picker')
          implementation (project(':react-native-camera')) {
              exclude group:"com.google.android.gms", module:"play-services-vision"
          }
          implementation "com.google.android.gms:play-services-vision:16.2.0"
          implementation project(':react-native-vector-icons')
          implementation project(':react-native-device-info')
          implementation fileTree(dir: "libs", include: ["*.jar"])
          implementation "com.android.support:appcompat-v7:${rootProject.ext.supportLibVersion}"
    
          // Firebase dependencies
          implementation "com.google.android.gms:play-services-base:16.0.1"
          implementation "com.google.android.gms:play-services-basement:16.0.1"
          implementation "com.google.firebase:firebase-core:16.0.4"
          implementation "com.google.firebase:firebase-messaging:17.3.4"
          implementation 'me.leolin:ShortcutBadger:1.1.21@aar'
          
          implementation "com.facebook.react:react-native:+"  // From node_modules
      }
    
  12. Update android/..../MainApplication.java with this
      import android.app.Application;
      import android.content.Context;
      import android.support.multidex.MultiDex;
    
      import com.BV.LinearGradient.LinearGradientPackage;
      import com.brentvatne.react.ReactVideoPackage;
      import com.facebook.react.ReactApplication;
      import com.dylanvann.fastimage.FastImageViewPackage;
      import com.inprogress.reactnativeyoutube.ReactNativeYouTube;
      import com.horcrux.svg.SvgPackage;
      import io.invertase.firebase.RNFirebasePackage;
      import com.facebook.react.ReactNativeHost;
      import com.facebook.react.ReactPackage;
      import com.facebook.react.shell.MainReactPackage;
      import com.facebook.soloader.SoLoader;
      import com.github.alinz.reactnativewebviewbridge.WebViewBridgePackage;
      import com.github.yamill.orientation.OrientationPackage;
      import com.imagepicker.ImagePickerPackage;
      import com.learnium.RNDeviceInfo.RNDeviceInfo;
      import com.oblador.vectoricons.VectorIconsPackage;
      import com.rnfs.RNFSPackage;
      import io.invertase.firebase.messaging.RNFirebaseMessagingPackage;
      import io.invertase.firebase.notifications.RNFirebaseNotificationsPackage;
      import io.invertase.firebase.fabric.crashlytics.RNFirebaseCrashlyticsPackage;
    
      import org.reactnative.camera.RNCameraPackage;
      import com.RNFetchBlob.RNFetchBlobPackage;
      import org.wonday.pdf.RCTPdfView;
    
      import java.util.Arrays;
      import java.util.List;
    
      import com.project_name.BuildConfig;
      import me.hauvo.thumbnail.RNThumbnailPackage;
    
      public class MainApplication extends Application implements ReactApplication {
    
        protected void attachBaseContext(Context base) {
          super.attachBaseContext(base);
          MultiDex.install(this);
        }
    
        private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) {
          @Override
          public boolean getUseDeveloperSupport() {
            return BuildConfig.DEBUG;
          }
    
          @Override
          protected List<ReactPackage> getPackages() {
            return Arrays.<ReactPackage>asList(
                new MainReactPackage(),
                  new FastImageViewPackage(), new ReactNativeYouTube(),
                new WebViewBridgePackage(), new LinearGradientPackage(),
                new RNThumbnailPackage(), new RNFSPackage(), new OrientationPackage(),
                new ReactVideoPackage(), new ImagePickerPackage(),
                new RNCameraPackage(), new VectorIconsPackage(), new RNDeviceInfo(),
                new RNFirebasePackage(), new RNFirebaseMessagingPackage(),
                new RNFetchBlobPackage(), new RCTPdfView(),
                new RNFirebaseNotificationsPackage(), new SvgPackage(),
                new RNFirebaseCrashlyticsPackage());
          }
    
          @Override
          protected String getJSMainModuleName() {
            return "index";
          }
        };
    
        @Override
        public ReactNativeHost getReactNativeHost() {
          return mReactNativeHost;
        }
    
        @Override
        public void onCreate() {
          super.onCreate();
          SoLoader.init(this, /* native exopackage */ false);
        }
      }
    
    

Usage

import App from 'rn-codemi-learning'


...

render () {
  return <App config={{
    domain: 'frontend.devel.pawonmburi.com',
    token: 'some random token'
  }}>
}

...

Properties

Contribute

Since symlink support is still lacking on React Native, I use the wml cli tool created by the nice folks at wix.

wml add /path/to/this/library/rn-codemi-learning /path/to/another/rn/project/Example/node_modules/rn-codemi-learning

Sample

wml add ~/Workspace/npm/rn-codemi-learning ~/Workspace/react-native/jm-click/node_modules/rn-codemi-learning

wml start

This script will watch your changes and automatically copy all files changed to project node modules directory.

Current Tags

  • 0.0.9                                ...           latest (a year ago)

7 Versions

  • 0.0.9                                ...           a year ago
  • 0.0.8                                ...           a year ago
  • 0.0.6                                ...           a year ago
  • 0.0.5                                ...           a year ago
  • 0.0.4                                ...           a year ago
  • 0.0.2                                ...           a year ago
  • 0.0.1                                ...           a year ago
Maintainers (1)
Downloads
Today 0
This Week 0
This Month 0
Last Day 0
Last Week 0
Last Month 14
Dependencies (69)
Dependents (1)

Copyright 2014 - 2017 © taobao.org |