React Native Firebase Dev 환경 분리하기 이번 프로젝트에서 개발환경을 설정 중 dev 환경과 prod 환경을 분리하기로 결정을 하여 Front, Back 모두 분리를 시작했습니다. API Endpoint와 그 외 다른 설정들은 env를 통해 관리가 가능 했지만 firebase 설정 파일의 경우 어떻게 분리를 해야 하지? 하여 이번 포스트를 작성하게 되었습니다. Firebase dev 모드 추가하기 가장 먼저 Firebase 설정에서 앱 추가를 통해 dev 환경에서 사용될 iOS, Android 프로젝트 추가가 필요 합니다. 기존의 환경 분리 이전의 Firebase setting이 완료 되어있음을 가정하고 프로젝트를 추가하는 방식에 대해서는 따로 설명을 하지 않도록 하겠습니다. iOS ..
eas local build error 해결하기 어느 날 갑자기 잘 사용하고 있던 eas-cli에서 문제가 발생했습니다. 어제는 잘되던 게 오늘은 안된다? 정말 사람 힘들게 하는 거 같습니다. 해결하고 나서 약 3일동안 이것 때문에 고생을 했던걸 생각하면 정말 어이가 없네요… 일단 해결 방법부터 설명하겠습니다 해결 방법 일단 저의 문제는 Developer Relations Intermediate Certificate가 제 Mac에서 날라간 점이었습니다. 이 인증서는 다음의 링크를 통해서 받을 수 있습니다. https://www.apple.com/certificateauthority/AppleWWDRCAG3.cer 만약 다른 인증서가 필요하시다면 여기에서 받아볼 수 있습니다. WWDR Intermediat..
이번 포스트에서는 webview 환경에서 카메라를 다루는 법에 대해서 적어볼까 합니다. 요즘 진행 중인 프로젝트에서 원래는 React Native 기반으로만 프로젝트를 진행하려고 하였는데 React Native 환경에서 영상을 촬영 시 화면이 검은색으로 변한 뒤에 영상 촬영이 시작되는데 이 부분에 대해서는 서비스를 출시할 때 매우 크리티컬 한 부분이라고 생각하여서 차라리 카메라/사진 촬영 쪽을 영상으로 옮기고 문제를 해결하자 하고 webview를 사용하게 되었습니다. 23년 9월 15일 기준으로 현재 문제를 확인하고 해결하였다고는 하는데 완전한 해결은 또 아닌가 봅니다 😂 https://github.com/expo/expo/issues/23130 [iOS] Preview flickering and dar..
이번 포스트에서는 React Native에서 Native 모듈을 만드는 법에 대해서 다뤄보려고 합니다. 사이드 프로젝트를 하는데 공유하기 기능인 Share Intent의 경우 지원하는 라이브러리들이 모두 2년 전 라이브러리들이고 제대로 업데이트가 되지 않아서 작동을 제대로 안 하더라고요 😂 Android와 IOS 중에서 Android는 그나마 쉬운 편이라 일단 IOS부터 다뤄보도록 하겠습니다. 일단 들어가기 앞서서 Native 모듈을 사용할 수 있는 환경은 다음과 같습니다. 1. Expo prebuild 환경(android, ios 폴더 존재) 2. Pure React Native 환경 그리고 공유하기에 이용한 데이터는 웹 페이지에서 URL을 공유하는 기능을 만들어볼 것입니다. 다른 사진 공유나 영상 공..
이번 포스트에서는 React Native Webview에서 페이지 전환 애니메이션에 대해서 다뤄보려고 합니다. 처음에 검색해서 얕봤다가 되게 고생한 기능 중에 하나네요 😂 웹 보다 사용자 경험이 좋다고 느껴지는 앱에서 웹뷰를 사용하게 되는 이유는 당연하게도 배포에 대한 부담이 적기 때문이라고 볼 수 있습니다. 앱의 문제가 생기거나 A, B 테스트를 해야 하는 상황에서 사람이 직접 검수하는 스토어 심사를 기다리면 너무나도 비효율 적이기 때문에 많이 채택이 되는 이유라고 볼 수 있습니다. 그러나 이 웹뷰를 통해서 앱을 개발했을 때 중요한 포인트 중 하나가 과연 Native 스러운가?를 빼놓을 수 없습니다. 좋은 앱을 만들어두고 사용자 경험을 해치는 걸 원하는 client 개발자는 없겠죠. 그럼 이번에 어떤 ..
전에 RN을 이용해서 프로젝트를 진행해 본 경험이 있는데 너무나도 많은 오류를 봐서 손 놓고 있었는데 요번 프로젝트에서도 webView와 firebase OAuth를 이용할 일이 생겨서 다시 손을 잡게 되었습니다... 이번 포스트에서는 firebase + expo auth를 이용해서 소셜 로그인을 구현하는 방법을 다뤄보려고 합니다. 좀 더 프로젝트 setting을 편하게 가져가보려다가 역시나 많은 오류를 만났기에 😂 그럼 같이 차근차근 해나 가볼까요? 환경은 expo : ~48.0.15 react-native : 0.71.1 react : 18.2.0 입니다. 요번에 expo sdk48에서 새로운 기능으로 expo-router가 새로 나와 프로젝트에 적용해 본 버전입니다. 기본적인 expo 설치의 경우 ..
react-native-vector-icons 아이콘 페이지로 이동 ios 6.0 부터는 link를 이용한 수동적인 방법이 다음 R/N release 에서는 더 이상 지원하지 않는다고 나온다. npx react-native link react-native-vector-icons npx react-native unlink react-native-vector-icons 결론적으로 열심히 구글링... 해결법 1. Podfile을 열고 코드 추가 cd ios && code Podfile && cd.. pod 'RNVectorIcons', :path => '../node_modules/react-native-vector-icons' 8번째 줄에 추가 2. info.plist 열고 코드..