React Native

Android
본 가이드는 React Native 0.68.2 기준으로 작성되었습니다.
SDK가 지원하는 최소 버전은 Android API 19(Kitkat) 이상입니다.
플러그인 다운로드 
1) 플러그인을 다운로드 합니다.
​▶다운로드​
2) 프로젝트 폴더와 같은 경로에 압축을 해제합니다.
플러그인 적용하기 
명령어를 실행하여 플러그인을 설치합니다. 
fingerpush_reactnative_module 폴더를 상대 경로 참조하여 설치합니다.
react-native install ../fingerpush_reactnative_module
react-native 0.69 이상 버전에서는 install 명령어가 삭제됐습니다.
버전이 0.69 이상인 경우, yarn 패키지 매니저를 이용하여 설치합니다.
버전이 0.69 이상인 경우
yarn add ../fingerpush_reactnative_module/
FCM APP 생성
1) Android 패키지 이름 입력 후 앱을 등록합니다.
2) 'google-services.json' 파일 다운로드 후 프로젝트 앱 모듈 루트 디렉토리로 이동 시킵니다.
3) 플러그인을 사용하기 위해 build.gradle 파일을 수정합니다.
a. 프로젝트 레벨의 build.gradle 에 'com.google.gms:google-services' 라이브러리를을 추가합니다.
<project>/build.gradle
buildscript {
    ...
    
    dependencies {
        ...
        classpath 'com.google.gms:google-services:4.3.10'
    }
}
b. 앱 레벨의 build.gradle에 firebase-messaging, firebase-core, material 라이브러리를 추가합니다.
<project>/<app-module>/build.gradle
...
dependencies {
    ...
    implementation 'com.google.firebase:firebase-messaging:23.0.0'
    implementation 'com.google.firebase:firebase-core:18.0.3'
    implementation 'com.google.android.material:material:1.3.0'
}
apply plugin: 'com.google.gms.google-services'
4) 프로젝트 AndroidManifest.xml 파일을 아래 스크린샷과 같이 입력합니다.
AndroidManifest.xml
<application
    ...
    android:allowBackup="false"
    android:icon="@mipmap/ic_launcher"
    android:label="@string/app_name">
    
    ...
    <service android:name=".IntentService"
        android:exported="false">
        <intent-filter>
            <action android:name="com.google.firebase.MESSAGING_EVENT" />
        </intent-filter>
    </service>
</application>
핑거푸시 사용자관콘솔 APP 생성 
1) 핑거푸시 사용자 콘솔에서 '앱 등록' 버튼을 누른 뒤 앱을 생성합니다.
2) '앱 설정' 메뉴로 이동하면 App Key, App Secret을 확인할 수 있습니다.
3) 핑거푸시의 App Key, App Secret를 프로젝트의 시작 위치에 아래 사용한 함수와 같이 입력 후 저장합니다.
4) 핑거푸시 사용자 콘솔의 앱 설정 화면에 FCM에서 발급된 '서버 키' 를 입력합니다.
Android API Reference
Android API 는 아래 링크에서 확인 할 수 있습니다.
Android API Reference
iOS
본 가이드는 React Native 0.68.0 기준으로 작성되었습니다.
최소 버전 iOS 10 이상 
플러그인 다운로드
1) 플러그인을 다운로드합니다.
​▶다운로드​
2) 프로젝트 폴더와 같은 경로에 압축을 해제합니다.
플러그인 적용하기 
1) 명령어를 실행하여 플러그인을 설치합니다. 
fingerpush_reactnative_module 폴더를 상대 경로 참조하여 설치합니다.
react-native install ../fingerpush_reactnative_module
2) 프로젝트 내 iOS 폴더에서 'pod install' 을 호출합니다.
cd ios
pod install
AppDelegate.m 파일 교체
1) '생성한 프로젝트의 AppDelegate.m' 파일을 'fingerpush_reactnative_module/example/ios/FingerpushExample/AppDelegate.m' 로 교체합니다.
2) 교체한 AppDelegate.m 파일의 moduleName을 프로젝트명으로 변경합니다.
핑거푸시 사용자 콘솔APP 생성 
1) 핑거푸시 사용자 콘솔에서 '앱 등록' 버튼을 누른 뒤 앱을 생성합니다.
2) '앱 설정' 메뉴로 이동하면 App Key, App Secret을 확인할 수 있습니다.
3) 핑거푸시의 App Key, App Secret를 프로젝트의 시작 위치에 아래 사용한 함수와 같이 입력 후 저장합니다.
푸시 기능 추가
1) Signing & Capabilities에서 Bundle Identifier와 Provisioning Profile을 수정합니다.
2) Capability 추가 선택 -> Background Modes의 Remote notifications, Push Notifications 추가합니다.
iOS API  Reference 
iOS API 는 아래 링크에서 확인 할 수 있습니다.
iOS API Reference
예제 파일 적용 및 푸시 메시지 확인
1) 프로젝트 폴더 내의 App.js 파일을 예제 파일과 같이 변경합니다.
예제 파일은 'fingerpush_reactnative_module > example > src > App.tsx' 에서 확인하실 수 있습니다.
2) setDevice 함수를 통해 앱을 핑거푸시 서버에 등록합니다.
3)디바이스가 정상적으로 등록됐다면 핑거푸시 사이트에서 확인 가능하고, 푸시 메시지를 수신할 수 있습니다.

Last modified 1mo ago