초보개발자의 소소한 기록

* Firebase 관련 수정 후 pod install --repo-update 시에 발생 # 현상 [!] The following Swift pods cannot yet be integrated as static libraries: The Swift pod `FirebaseCoreInternal` depends upon `GoogleUtilities`, which does not define modules. To opt into those targets generating module maps (which is necessary to import them from Swift when building as static libraries), you may set `use_modular_headers!` g..

* Animated.View 에서 interpolate 를 사용하여, 1번부터 4번까지 각 단계를 상단에 하나씩 추가하는 화면 구현. 1. 휴대폰번호 입력 2. 주민번호 입력 3. 통신사 입력 4. 이름 입력 # 현상 iOS 에서는 각 단계가 입력되었을 때 1 → 2 → 3 → 4 로 하나씩 항목이 정상적으로 추가되으나, android 에서는 1 → 2 항목 추가 시 화면의 레이아웃이 설정과 다르게 상단으로 이동함. # 해결 1 → 2 단계 이동 시 Keyboard 를 on 한 상태로 그대로 이동하였는데, 1단계가 완료되었을 때 Keyboard 를 숨기고, 2단계가 시작될 때 Keyboard를 다시 on 되도록 구성하니 해결됨. ... import { Keyboard } from 'react-nativ..

* react-native-table-component 사용하여 테이블 구현 시 발생한 에러 ERROR Warning: Failed prop type: Invalid prop `textStyle` of type `array` supplied to `Cell`, expected `object`. Cell@http://10.0.2.2:8081/index.bundle? ... in Row (at rows.js:55) in RCTView (at View.js:32) in View (at rows.js:51) in Rows (at Information.js:111) in RCTView (at View.js:32) ... # 해결 - node_modules > react-native-table-component >..

* firebase 설치 없이 간단하게 admob 적용이 가능해졌다. admob에서 app ID, ad unit ID는 생성했다는 전제 하에 정말 간단하게 적용이 가능하다. * reference : https://docs.page/invertase/react-native-google-mobile-ads 1. package 설치 yarn add react-native-google-mobile-ads 2. app ID 등록 - app.json 파일에 app id 등록 후 rebuild # project > app.json { ... "react-native-google-mobile-ads": { "android_app_id": "ca-app-pub-xxxxxxxx~xxxxxxxx", "ios_app_id":..

* android 에서만 앱 이름 변경 시, 정상적으로 빌드 성공 후 실행 시 app crashes without any error log # 원인 - '영문'에서 '한글'로 이름을 변경 했을 때, 휴대폰의 기본 언어 설정이 '한글'로 되어 있지 않으면 앱이 종료됨 # 해결 - strings.xml 변경 시 기본 앱이름은 영문으로 두고, 한글은 폴더를 별도로 추가해준다. # app.json { "name": "FindAnimal", "displayName": "한글 앱이름" } # android > app > srs > main > res > values > strings.xml english app name # android > app > srs > main > res > values-ko > str..

* react-native-webview 모듈 사용 시, dev 모드에서는 정상 호출되지만 release 모드에서 호출 시 에러 발생 # 원인 - android 에서만 에러 현상 발생 - https 호출은 정상이지만, http 호출 불가능 - dev 모드에서는 잘 되지만, release 모드로 앱 빌드 시 호출 불가능 즉, android는 release 모드에서 https 호출이 불가능했다. # 해결 - [android > app > src > main > AndroidManifest.xml] 파일에 android:usesCleartextTraffic="true" 옵션을 추가 ... ...

* 아래 블로그에 상세하게 설명되어 있으나, 몇 가지 추가 진행 사항을 통해 변경 완료함 # package 변경하기 - reference : http://asq.kr/ZWdfTnq1u - 블로그의 설명대로 변경하되, 그 외 기존 package 가 기재되어있는 모든 곳을 변경함 # Project 이름 변경하기 - reference : http://asq.kr/zwN4Cx58 - android 는 간단하게 변경 되었으나, ios 의 경우 아래 추가 절차가 필요함 1) schema 수정 시 Manage Scheme 에서 변경한 후, [Project > Scheme > Edit Scheme] 에서 Build 단계에 존재하는 기존 Targets 을 삭제한 후 새로운 Targets을 등록 ( 기존 Target 이름..

* react-native-webview 사용 시, android 에서만 app 이 죽어버리는 현상 # 원인 - 아래 소스 중 loading 을 추가하는 라인이 들어가지 않으면 정상적으로 ios / android 모두 잘 작동함 - loading 라인 추가 시, ios 는 정상적으로 동작하나, android 에서는 에러 로그 없이 앱이 충돌나서 종료됨 ... return ( {loading ? : null} // this line ); ... # 해결 - 특정 버튼을 클릭하면 navigation 을 통해 webview 를 띄워주는 화면으로 이동하는데, animationEnabled 옵션을 추가하여 해결 ...

* react-native-webview 를 사용하여 웹뷰 구현 시, 해당 웹뷰 내에서 신규 브라우저를 띄우고자 하는 경우 ios 는 default 값이 인앱으로 구현되나, android 는 default 값이 새로운 브라우저를 띄운다. 간단하게 setSupportMultipleWindows 옵션을 변경하는 것으로 인앱구동 가능 # 로딩 제어 관련 유용한 옵션들 - onLoad : Function that is invoked when the WebView has finished loading. - onLoadEnd : Function that is invoked when the WebView load succeeds or fails. - onLoadStart : Function that is invoke..

* rn-fetch-blob 설치 후 사용 시, 아래와 같은 warning 발생 WARN Require cycle: node_modules/rn-fetch-blob/index.js -> node_modules/rn-fetch-blob/polyfill/index.js -> node_modules/rn-fetch-blob/polyfill/Blob.js -> node_modules/rn-fetch-blob/index.js Require cycles are allowed, but can result in uninitialized values. Consider refactoring to remove the need for a cycle. WARN Require cycle: node_modules/rn-fetch-..