본문 바로가기

전체 글173

[React Native 에러 해결] Invariant Violation: Tried to register two views with the same name RNAdMobBannerView 1. 에러 상황 앱에 구글 애드몹 위해 2개의 라이브러리를 테스트하며 설치/삭제하던 중 위 에러를 만났습니다. 구글링을 해보니 외부 라이브러리를 쓰시는 분들께서 종종 만나는 에러로 보입니다. 2. 해결 방법 여러 방법이 있는 것 같습니다. 그 중에서도 저는 npm dudpe 를 통해 해결했습니다. (참조 링크) 지금까지 npm 명령어는 npm init / npm start / npm run android 이 정도만 써왔었는데.. 저건 뭘까...! 해서 찾아보니, 중복된 패키지들을 정리해주는 명령어라고 합니다. 가끔 사용해주면 용량도 줄어든다고 하네요! 2022. 1. 11.
[React Native / Android 에러해결] app:mergeDebugJavaResource, app:mergeDebugNativeLibs 1. 에러 상황 react-native-firebase/firestore 라이브러리를 설치하고 안드로이드 앱을 실행하니 아래의 에러가 발생했습니다. React Native Firebase의 공식 문서를 보면 아래처럼 app:mergeDexDebug 에러가 발생하면 링크를 참조해 해결하라고 알려줍니다. mergeDexDebug는 아니지만 일단 따라해봤습니다. 역시! 해결되지 않았습니다..ㅎㅎ 2. 해결방법 1) 안드로이드 캐시 삭제 https://lonelychicken.tistory.com/2 위 블로그를 보고 캐시 삭제를 해보았습니다. 안드로이드 스튜디오에서 프로젝트를 열고, File > Invalidate Cache를 눌러줍니다. 결과: 아쉽게도 제 에러는 해결되지 않았습니다 ㅠㅠ 2) app/bui.. 2022. 1. 10.
[React Native / Android 에러 해결] INSTALL_FAILED_UPDATE_INCOMPATIBLE: Package signatures do not match previously installed version; ignoring! 1. 에러 원인 테스트하려는 기기에 설치된 앱과 테스트하려고 실행한 앱의 signature가 맞지 않아서 그렇습니다. 제 경우, 설치된 앱은 플레이스토어에서 다운받은 앱이었습니다. 2. 해결 방법 설치된 앱을 삭제하고 다시 실행시키면 테스트앱이 잘 설치될에요 :) 2022. 1. 10.
[React Native] __DEV__ 개발 모드 활성화 개발 모드와 실제 서버와 구분해서 테스트해야할 때가 종종 있습니다. 저의 경우, 개발 모드에서 애드몹의 실제 광고 ID를 갖고 테스트하면 광고계정이 삭제되기때문에 테스트용 ID를 넣어줘야 하는데요. 개발할때 바꾸고, 출시용으로 번들 압축할 때 바꾸고하는게 여간 귀찮은 일이 아니었습니다. React Native에는 기본적으로 __DEV__ 를 입력하면 개발 모드를 true, false값으로 반환해줍니다. 따로 라이브러리를 import하거나 선언할 필요 없이 사용하고 싶은 곳에 __DEV__ 를 입력해주면 돼요. 개발 모드는 안드로이드&iOS 시뮬레이터, usb 연결한 실제 기기일때 true값을 반환해줍니다. 그리고 앱 번들로 제출한 배포버전에서는 false로 됩니다. 간단한 예시로 아래 코드처럼 테스트해보.. 2022. 1. 10.
[React Native / Android] 안드로이드 뒤로가기, BackHandler 안녕하세요. 이번 포스팅에서는 안드로이드 뒤로가기 버튼에 대한 이벤트 핸들러를 다뤄보겠습니다. 저희 앱은 메인 화면에서 뒤로가기를 누르면 '앱을 종료할까요?' 라는 모달 팝업이 뜨는데요. 이번에 로그인 페이지를 새롭게 추가하니까, 로그인 페이지에서 뒤로가기를 눌러도 앱 종료 모달이 뜨는거 아니겠습니까? 메인화면에서 로그인 페이지로 이동했으니 스택이 쌓였고, 로그인페이지에서 뒤로가기를 누르면 다시 이전 스크린으로 가야 정상인데 말이죠. 이번 포스팅에서는 안드로이드 뒤로가기 버튼인 Backhandler 이벤트를 사용하는 방법과, 최상단 스크린이 아닌 곳에서는 뒤로가기가 되도록 하는 법을 알아보겠습니다. 1. BackHandler 사용법 아래 코드를 import 합니다. import {BackHandler} .. 2022. 1. 9.
[React Native] Firebase auth와 애플 로그인 연동하는 방법 안녕하세요. 이번 포스팅에는 firebase auth에 apple 로그인을 연동하는 방법을 알아볼게요. 2020년 4월부터 IOS 앱에 소셜로그인(구글, 페이스북, 카카오톡, 네이버, 트위터 등) 기능을 추가하려면 "반드시" 애플 로그인도 추가해야합니다. 제가 운영중인 앱(바로보카)도 소셜로그인 기능이 있어서 애플 버튼도 추가해주었습니다. 저는 아래 2개의 공식문서를 보면서 진행했어요. 언제나 그렇듯이, 공식 문서가 있다면 가장 먼저 공식 문서를 읽는게 좋습니다! 공식문서에 가장 최신 방법이 정확하게 나와있어요 :) React Native Firebase Apple Login 공식문서 > RN 애플 로그인 라이브러리 > 1. 환경설정 1단계 : 선행조건 확인 라이브러리 깃헙 사이트에 애플로그인 버튼 작업.. 2022. 1. 9.