본문 바로가기

react native12

React Native 통합 앱 프로필별 데이터 분기 처리 해결 방법 (Normalizer, Controller 분리) React Native로 여러 종류의 프로필(관광지 목록, 산행 코스, 파일 데이터 등)을 하나의 통합 앱으로 묶어 운영하다 보면, 화면보다 데이터 처리 쪽이 먼저 복잡해지기 시작합니다.겉보기에는 리스트나 상세 화면 구조가 다 비슷해 보여서 공통 컴포넌트로 묶었는데, 막상 API 원본 데이터 필드를 보면 어떤 건 title이고 어떤 건 mntnNm이라서 화면 컴포넌트 내부에 조건문이 덕지덕지 붙곤 합니다. 저의 경우도 처음에는 대수롭지 않게 컴포넌트 안에 분기 처리를 넣었다가, 프로필이 늘어날수록 새 기능을 추가할 때마다 기존 코드가 깨지는 회귀 문제를 겪었습니다.화면 컴포넌트가 원본 API 구조를 너무 많이 알면 유지보수가 불가능해집니다. 이를 해결하기 위해 원본 데이터 차이는 Normalizer에서 .. 2026. 5. 21.
[React Native] 멀티 프로필 통합 앱에서 화면 라우팅 깔끔하게 관리하는 방법 (Route Registry) React Native로 여러 프로필(또는 다양한 서비스 flavor)을 하나의 앱으로 통합해서 운영하다 보면, 가장 먼저 복잡해지고 꼬이는 게 바로 화면 라우팅(Routing)입니다.어떤 프로필은 지도 화면이 메인이고, 어떤 프로필은 리스트 화면 중심이며, 또 다른 프로필은 간단한 설정이나 안내 화면만 있으면 되는 경우가 있죠. 이 차이를 화면 코드 곳곳에 if (profile === 'A') 같은 조건문으로 처리하다 보면, 나중에 새 프로필을 추가할 때마다 꼭 어디선가 사이드 이펙트(회귀 오류)가 터집니다. 화면 컴포넌트 안에 프로필별 분기 코드가 늘어나면 나중에는 어떤 화면이 어느 앱에서 열려야 하는지 추적하기도 힘들어지더군요.저의 경우도 이 문제로 고생을 좀 하다가, 라우팅 정책을 한곳으로 모으는.. 2026. 5. 21.
React Native 통합 앱에서 프로파일별 딥링크와 푸시 라우팅 안전하게 검증하기 하나의 코드베이스로 여러 브랜디드 앱이나 프로파일을 빌드하는 통합 앱을 운영하다 보면, 딥링크와 푸시 알림 처리가 생각보다 까다로워집니다. 어떤 앱(프로파일)에서는 지도 상세 화면이 잘 열려야 하지만, 다른 앱에서는 지도 기능 자체가 아예 빠져 있을 수 있기 때문입니다.저의 경우도 처음에는 단순히 외부 URL을 파싱해서 화면 이동만 시켜주면 끝날 줄 알았는데, 이래저래 운영을 하다 보니 특정 프로파일에서 열리면 안 되는 화면이 열리거나 params 타입이 안 맞아 앱이 뻗는 문제가 발생하곤 했습니다.외부에서 들어오는 값은 언제든 바뀔 수 있고 오류가 섞이기 쉽기 때문에, 무작정 navigation.navigate()에 던지면 위험합니다. 나중에 또 까먹을까 봐 안전하게 라우팅을 검증하는 흐름을 정리해 둡.. 2026. 5. 20.
React Native 통합 앱 프로파일별로 단말기 권한 분리해서 요청하기 하나의 코드베이스로 여러 개의 앱 프로파일을 분리해서 빌드하다 보면 꼭 권한 문제가 발목을 잡습니다. 어떤 앱은 지도가 들어가서 위치 권한이 필요한데, 어떤 앱은 알림 기능만 있으면 되거든요.처음에는 귀찮아서 공통 초기화 함수 하나 만들고 앱 켤 때 필요한 권한을 한꺼번에 다 띄우도록 짜놓기 쉽습니다. 저도 처음엔 그렇게 편하게 가려 했습니다. 하지만 실제로 앱을 운영하고 스토어 심사를 넣다 보면 바로 문제가 터집니다. 지도가 없는 앱인데 위치 권한을 물어보니 사용자는 당황하고, 구글이나 애플 심사에서도 불필요한 권한 요구로 리젝트 먹기 딱 좋습니다.나중에 제가 다시 보거나 작업할 때 까먹지 않으려고, 기능 플래그(Feature Flag)와 권한 정책(Permission Policy)을 분리하고 기능 진.. 2026. 5. 20.
[React Native] 통합 앱 프로파일별 Feature Flag 설계 기법 (딥링크, 권한 처리 오류 막기) 하나의 코드 베이스로 여러 프로파일의 앱을 묶어서 운영하다 보면, 앱마다 기능을 다르게 켜고 꺼야 할 때가 많습니다. 어떤 앱은 지도가 들어가고, 어떤 앱은 단순 공지사항 알림판 역할만 하기도 하죠.처음에는 단순히 화면에서 버튼 하나 숨기면 끝날 줄 알았는데, 이래저래 운영하다 보니 UI만 막는다고 해결될 일이 아니었습니다. 메뉴에서는 숨겼는데 딥링크로 뚫고 들어오거나, 쓰지도 않는 위치 권한 팝업이 갑자기 뜨는 등 신경 쓸 게 한두 가지가 아니더군요.나중에 제가 또 까먹지 않으려고, 실무에서 놓치기 쉬운 통합 앱 Feature Flag 설계 기준을 코드로 정리해 둡니다.UI만 숨기면 터지는 문제들Feature Flag 기준이 흐트러지면 운영 중에 아래와 같은 귀찮은 일들이 터집니다.메뉴에서는 숨겼는데,.. 2026. 5. 20.
React Native 통합 앱 여러 프로파일 진입점 복잡할 때 정리하는 방법 (Composition Layer) 이래저래 React Native로 통합 앱을 운영하다 보면, 하나의 코드베이스에서 여러 프로파일(브랜드별 또는 업체별 앱)을 관리해야 할 때가 있습니다. 프로파일별로 파일은 잘 나눠놨는데, 막상 앱이 시작되는 진입점(App.tsx 등)에서 코드가 다시 복잡해지더군요.저의 경우도 처음에는 파일만 분리해두면 구조가 다 정리된 줄 알았습니다. 그런데 막상 앱 시작 흐름을 짜다 보니 현재 프로파일 조회하고, 컨트롤러 고르고, 라우트 접근 기준 체크하고, 예외 처리(Fallback)까지 연결하느라 진입점 코드가 금방 지저분해졌습니다.이 부분을 한 곳에서 정리하지 않으면 화면이나 네비게이션 코드가 다시 복잡해집니다. 자꾸 까먹어서 나중에도 바로 참고하려고 정리해 둡니다.내가 겪은 문제 (조립 진입점이 없을 때)시작.. 2026. 5. 20.