🏍️ 바리바리 BariBari

'바리바리'는 라이더들을 위한 코스 관리 어플리케이션(iOS)입니다.

 

✓ 개발 인원 및 기간

• 기간: 2025.04.01 ~ 2025.04.07 [7일] (업데이트 진행 중)

• 인원: Goo [1명]

 

✓ 앱 소개

바이크 라이딩을 하다보면 예상치 못하게 예쁜 길을 마주할 때가 있습니다.
사진을 찍거나 지도에 기록할 틈도 없이 지나쳤던 그 길들을,
간단한 조작만으로 실시간 경로를 추적하고 저장할 수 있도록 도와줍니다.

 

✓ 앱 기술 스택

아키텍처/디자인 패턴

• MVVM + Input-Output
• Repository
• Router (API request routing)
• BaseView/BaseViewModel/BaseViewController

프레임워크

• UIKit
• WidgetKit
• MapKit
• CoreLocation
• PhotosUI

라이브러리

• 
  • 
• 
• 
  • 
  • 
• 
• 
• 

 

✓ 앱 주요 기능

🌕 라이트모드를 지원합니다.

🏞️ 이전에 기록했던 코스를 위젯에 표시합니다.

홈 화면에서 이전에 달렸던 코스 중 하나가 무작위로 표시됩니다.

🔝 서울 근교 대표 바이크 코스를 소개합니다.

분위기, 경로, 포인트를 한눈에 확인하고 오늘의 목적지를 쉽게 정해볼 수 있습니다.

📍 실시간으로 내 위치를 추적해 코스를 자동으로 기록할 수 있습니다.

다른 앱을 사용 중이거나 화면 잠금 시에도 백그라운드에서 작동합니다.

🗺️ 사진, 메모, 날짜, 경로와 함께 코스를 저장할 수 있습니다.

📂 원하는 코스 분위기나 테마에 따라 폴더로 분리하여 정리할 수 있습니다.

📦 보관함에서 저장한 코스의 기록과 출발지, 경유지, 도착지까지 언제든 다시 확인할 수 있습니다.

✍🏻 보관함의 코스 폴더는 수정 및 삭제할 수 있습니다.

✍🏻 보관함의 코스는 수정 및 삭제할 수 있습니다.

 

✓ 기술적 도전

RxSwift

• View와 ViewModel 간의 복잡한 이벤트 처리를 input, output 구조로 바인딩하여 코드의 가독성과 재사용성을 높였습니다.

• 여러 API 요청을 동시에 보내고, 결과를 모아서 처리해야하는 경우에 Single.zip(_:) 조합 연산과 flatMap, observe(on:) 연산자를 활용하여 비동기 → 동기 전환 이벤트 처리를 효율적으로 구성하였습니다.

위치 권한 제어

• CoreLocationManager을 통해 위치 권한 상태에 따른 예외 케이스를 세밀하게 고려하여 처리하였습니다.

• Info.plist 설정과 CLAuthorizationStatus의 변화에 따른 적절한 UI 피드백을 제공하여 사용자 경험을 안정적으로 제공할 수 있도록 구현하였습니다.

모델간 계층 분리

• API 구조 / DB 스키마 / UI 요구사항 변경이 발생하더라도 각 레이어의 데이터 모델 수정 범위를 최소화할 수 있도록 설계하였습니다.

• API ↔ View ↔ Realm 간의 흐름에서 DTO를 도입하여 서로의 구현에 종속되지 않도록 설계하였습니다.

컴포넌트 중심 설계

• 기능 단위 모듈화 및 역할 기반 책임 분리(SRP) 를 통해, 코드의 재사용성, 유지보수성, 확장성을 확보하였습니다.

• 지도와 위치 기반 기능은 CoreLocationManager를 통한 위치 처리 로직과, Custom MKMapView를 통한 시각화 컴포넌트를 분리함으로써, 위치 처리와 UI 포현 결합도를 낮추었습니다.

• 공통 UI 요소는 커스텀 컴포넌트로 추상화하여 앱 전체에 일관된 디자인과 코드 스타일을 적용할 수 있도록 하였습니다.

 

✓ 트러블슈팅

위치 권한 변경 시 지도 등 뷰에 반응이 없던 문제

• 문제 상황

  • 사용자가 앱 실행 중 위치권한을 변경(백그라운드 → 거부) 했을 때, CoreLocationManager는 권한 변경을 감지했지만 MKMapView등 뷰에는 변경된 권한에 대한 UI 피드백이 반영되지 않는 문제가 발생하였습니다.

  • 위치를 추적하여 기록 중이었다거나, 보관함에서 이전에 기록했던 경로를 확인 중이었다면 현재 작업을 중단하고 화면 이동 또는 설정 화면으로 이동을 유도하는 기능이 필요했습니다.

• 원인 분석

  • CoreLocationManager를 통한 위치 처리 로직과, Custom MKMapView를 통한 시각화 컴포넌트를 완전히 분리한 상태였기 때문에, 권한 변경 시 별도의 notification이나 콜백 처리가 필요한 상황이었습니다.

• 해결 방법

  • didChangeAuthorization 내부에서 위치 권한 상태를 감지하여, 위치 권한 변경 시 rootViewController에 위치 권한 허용을 유도하는 permissionAlert를 띄워주었습니다.

  • cancel Action handler 에는 현재 추적 중인 경로가 있다면 UserDefault에 임시 저장되도록 하여 유저에게 안정적인 UX를 제공하였습니다.

  • setting Action hanler 에는 설정 화면으로 이동하는 로직을 구현하여 위치 권한을 허용하도록 유도하였습니다.

• 결과

  • 앱 실행 중 권한 변경 시에 적절한 UI 피드백을 제공하고, 기록 중이었던 정보를 안전하게 보관하여 UX와 기능 안정성이 개선되었습니다.

 

여러 API 요청 결과를 UI에 안정적으로 반영하는 흐름 설계

• 문제 상황

  • 사용자가 코스를 저장할 때에, 출발지 / 경유지(5개) / 도착지의 위경도에 따른 주소값을 받아오는 API 요청을 동시에 보내고 그 결과를 모아서 Realm 저장하는 구조를 구성하였습니다.

  • 하지만 출발지 / 경유지(5개) / 도착지의 위경도를 배열로 관리하고 있었고, API 요청이 비동기로 동작하기 때문에 위경도 순서가 일관되지 않은 상태로 Realm에 저장되거나 일부 경유지 데이터가 누락되는 문제가 발생하였습니다.

• 원인 분석

  • 각 위경도 값에 대한 API 요청이 비동기로 개별 처리되면서, 응답이 도착하는 순서가 달라졌고 그로 인해 원래의 위치 배열 순서와 매핑되지 않은 주소 데이터가 Realm에 저장 되거나 누락되었습니다.

• 해결 방법

  • 각 API 요청을 하나의 Single로 감싸고, Single.zip(\_:) 조합 연산자를 통해 여러 요청의 결과를 하나의 Single로 묶어 응답 순서를 보장하고, 모든 요청이 완료된 후에 다음 로직으로 진행하도록 하였습니다.

  • 사용자의 저장 버튼 입력 스트림에는 flatMapLatest를 적용하여 가장 최신의 저장 요청만 유효하게 처리되도록 구성하였습니다.

  • 결과가 UI에 안전하게 반영되도록 .observe(on: MainScheduler.instance)를 추가하여, UI 업데이트를 Main Thread에서 처리하도록 명시하였습니다.

  사용자 저장 버튼 탭
     ↓
  Observable 스트림 (코스 정보)
     ↓
  flatMapLatest → 유효성 검사 (코스에 누락된 정보 없는 지)
     ↓
  Observable 스트림 (저장 가능한 코스 정보)
     ↓
  flatMap → API 요청 (requestMultiple / Single.zip)
     ↓
  결과(Result<Success, Error>) Observable로 반환
     ↓
  MainScheduler (UI 스레드)
     ↓
  bind → 성공 시 Realm 저장 및 UI 피드백 or 실패 시 UI 피드백
  

• 결과

  • 모든 위경도 값에 대한 주소 요청 결과를 순서대로 보장받을 수 있게 되면서, 출발지부터 도착지까지의 주소 데이터 일관성이 유지되었습니다.

  • 전체적으로 API 요청 흐름과 UI 반영 흐름이 명확해졌고, 비동기 순서 오류를 효율적인 Rx 패턴 조합으로 안정화할 수 있었습니다.

 

✓ Credits/Thanks

🙏🏻 Thanks to Unsplash API

• 이 앱은 Unsplash Image API 를 활용하여 바이크 이미지를 가져옵니다.