썬이의 IT세상

문제점 보통 iOS 앱을 빌드하여 스토어에 등록하거나, testfilght에 올릴 때 위 이미지처럼 General > Identity > Version, Build 를 수정해서 올리곤 한다. 하지만 최근에 아카이브한 앱들이 아무리 빌드번호를 올려도 이전 번호로 고정이 되어 이슈가 있었는데, (Version만 올리고 빌드번호는 올리지 않아도 업데이트는 된다) 그래도 되던 기능이 안되고 이게 계속 올라가지 않으면 또 진짜 이슈로 번질 수 있기 때문에, 이를 해결하기 위한 방법을 적어본다. 해결 방법 평소 진행하던 방법대로 General > Identity > Version, Build 를 수정한 후에, 이에 따른 빌드번호(Build)를 info.plist의 Bundle version을 같이 맞춰주면 정상적으..

진행중인 프로젝트에 푸시 알림 등의 서비스를 이용하는 데 역시 Google Firebase만한 게 없다. 이런 Firebase를 앱과 연동하고 사용하기 위해 Firebase와 관련된 라이브러리를 npm install 한 후 ios 디렉토리에서 pod install을 하게 되면 간혹 아래와 같은 문제로 충돌이 나는 경우가 있다. [!] CocoaPods could not find compatible versions for pod "FirebaseCoreExtension": In snapshot (Podfile.lock): FirebaseCoreExtension (= 10.12.0) In Podfile: RNFBMessaging (from `../node_modules/@react-native-fireb..

시작하기 크로스 플랫폼 앱의 단점중 하나인 버튼 위치 1px만 옮겨도 앱을 업데이트 해야하는 굉장히 불편한 부분을 보완하고자 Code push 라는 어마어마한 서비스가 나왔는데, 이를 적용하고 테스트해보려면 실제로 스토어에 업데이트 된 앱이 있어야 하므로 사이드 프로젝트 겸 code push 테스트를 위한 앱을 만들어보고자 한다. 새로 만들어보는 김에, 이전 Private Box는 윈도우 환경에서만 개발했기에 RN으로 만들었음에도 안드로이드만 배포했었는데, 이번엔 Android/IOS 둘다 배포해보고자 한다. 개발 프레임워크 : React Native v0.72.1 사용 언어 : Typescript v4.8.4 프로젝트 생성 RN 타입스크립트 프로젝트를 간단한 명령어로 생성할 수 있다. 프로젝트를 생성하..

RN 으로 개발 중인 앱을 디버깅 할 때 나는 주로 XCode에서 실행하여 iOS 앱을 먼저 킨 후에 같이 켜진 터미널 창에서 안드로이드 앱을 열곤 하는데, 아무 이상 없이 잘 실행되던 디버깅 앱이 iPhone is busy fetching debug symbols for iPhone 창이 뜨면서 실행이 안되는 것이었다..! 이것저것 알아보던 중 역시 근본은 재부팅이었다. 내가 해결했던 방법은 아래와 같다. 1. XCode - Product - Clean BUild Folder 2. XCode 종료 후 다시 실행 3. 디버깅 할 iPhone 종료 후 다시 실행 - 이후 다시 실행시키니 정상 동작한다!

예전에 했던 프로젝트를 1달정도만에 XCode에서 빌드하려는데 Command PhaseScriptExecution failed with a nonzero exit code 에러로 IOS 빌드가 되지 않았다. 위와 같은 에러메시지는 하도 많이 봤지만 전에 했던 방법대로 해도 해결되지 않는 마법같은 에러.. 역시나 build clean & pod install 과 같은 명령어로는 해결되지 않았다. 열심히 찾아보던 도중 간단히 해결할 수 있는 방법을 찾았다! 프로젝트 루트/node_modules/react-native/scripts/find-node.sh 파일에 set -e 로 되어있는 부분을 set +e 로 변경해주고 빌드하면 바로 해결된다. - set -e + set +e

# 시작하기 앱을 개발하다 보면 리뷰 등의 기능에서 사용자 디바이스의 '카메라 앨범'을 불러와 사진 리스트를 출력해주어야 하는데, 해당 기능을 구현하는 데 사용해본 라이브러리 중 가장 대중적이고 편한 라이브러리인 react-native-camera-roll 라이브러리와 그 사용법, 그리고 flatlist를 통해 페이징 기능까지 구현해보자. # react-native-camera-roll 기본적으로 사용자의 카메라 앨범을 불러오려면 앱의 권한과 AOS/IOS 모두 설정을 해주어야 한다. npm 라이브러리 설치 명령어와 위 권한 관련 설정에 대해서는 도큐먼트를 잘 따라가면 순조롭게 진행된다. https://github.com/react-native-cameraroll/react-native-camerarol..

RN 으로 개발중인 앱에 html로 받아오는 데이터들 중 텍스트의 색상을 지정해주지 않은 태그들은 디바이스의 다크모드/라이트모드 설정에 따라 블랙/화이트로 유동적으로 변경되게 되는데, 우리 앱에서는 디바이스 테마를 따로 제어하지 않아서 흰 배경에서 나오는 html 소스들이 다크모드로 실행되면 텍스트 색상이 white이기에 어려움이 있었다. 그래서 생각해낸 해결방법 중 하나는 앱의 테마를 라이트모드로 고정하는 것인데, 그 방법은 아래와 같다. [Android] android > app > src > main > res > values > styles.xml 경로에서 style 부분을 다음과 같이 바꿔준다. [IOS] info.plist 파일의 태그 안에 UIUserInterfaceStyle Light 코드..

나는 RN을 개발할 때, 주로 Window 환경에서 Android로 개발한 후 디버깅 단계에서 iOS의 UI 등을 확인하곤 하는데, iOS의 노치 부분을 제어하기 위해 SafeAreaView로 감싼 Component임에도 노치 부분을 제어할 수 없는 몇몇 컴포넌트가 존재하곤 한다. 그래서 요즘 아주 흥미가 생긴 chatGPT에게 노치 부분을 제어하는 방법에 대해 물어봤다. https://k-taeyang.tistory.com/43 Controlling the Notch in React Native The notch is a feature on certain devices, such as the iPhone X and later, which contains the front-facing camera and..

The notch is a feature on certain devices, such as the iPhone X and later, which contains the front-facing camera and speaker. The notch can obstruct parts of the screen, making it necessary to control its behavior in a mobile application. In React Native, there are several ways to control the notch and ensure that your content is not obscured by it. Method 1: Use the SafeAreaView Component The ..