환경
node v12.0.0
프로젝트 생성
$ react-native init RestockReminder
Bash
복사
Metro 실행
npm start
Bash
복사
iOS 환경 설정
Flipper Disable
2021.02 기준 Flipper가 정상동작 하지 않아 iOS앱이 빌드되지 않는 이슈 있음.
// Podfile
target 'RestockReminder' do
config = use_native_modules!
use_react_native!(:path => config["reactNativePath"])
target 'RestockReminderTests' do
inherit! :complete
# Pods for testing
end
# Enables Flipper.
#
# Note that if you have use_frameworks! enabled, Flipper will not work and
# you should disable these next few lines.
#use_flipper! 👈 주석
#post_install do |installer| 👈 주석
# flipper_post_install(installer) 👈 주석
#end
end
Bash
복사
dependency 설치
pod install
Bash
복사
XCode 실행 및 Run
Android 환경 설정
바로 실행 가능
TypeScript 로 전환
dependenct 설치
npm install typescript @types/react @types/react-native
Bash
복사
확장자 변경
App.js 👉 App.tsx
index.js 👉 index.ts
Bash
복사
Firebase 연동
Firebase Project 생성
생략
Github Repository 생성
생략
Firebase 모듈 추가
npm install --save @react-native-firebase/app
npm install @react-native-firebase/analytics
Bash
복사
iOS Firebase 적용
firebase 프로젝트에서 생성한 ID 로 변경
pod install
Bash
복사
AppDelegate.m
#import "AppDelegate.h"
#import <React/RCTBridge.h>
#import <React/RCTBundleURLProvider.h>
#import <React/RCTRootView.h>
#import <Firebase.h> 👈
#ifdef FB_SONARKIT_ENABLED
...
@implementation AppDelegate
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
[FIRApp configure]; 👈
...
return YES;
}
@end
Objective-C
복사
Android Firebase 적용
package명 전체 찾아바꾸기
package 명 변경
// MainApplicatiino.java
import com.facebook.react.BuildConfig;
Java
복사