미리보기

스마트 에어 베개 앱 잠드림 서비스

• 디바이스 스캔, 베개 컨트롤 스크린 개발

• BLE 디바이스 스캔, 연결 상태 관리, 데이터 송·수신 개발

• BLE 디바이스 스캔 로직 5초 -> 3초로 성능 개선

필터 단말기 연동 앱 세이프윙 서비스

• 디바이스 스캔 스크린, 와이파이 데이터 송신 모달 개발

• BLE 디바이스 스캔, 연결 상태 관리, 데이터 송·수신 개발

• 필터 단말기와 공유기 연결 개발

• BLE 디바이스 연결 성능 개선

개발 주요 사항

• react-native-ble-plx 라이브러리를 이용하여 BLE 앱 개발

• 프로토콜 데이터를 송수신 시 Base64 인코딩 및 디코딩 처리

• MMKV를 이용한 프로토콜 데이터 저장 및 로딩

• Zustand를 이용한 디바이스 정보 상태 관리

• Appstate 변경 시 블루투스 상태(on/off) 감지 및 설정 기능 구현

문제 발생 및 해결 과정

1. 디바이스 탐색 속도 개선

   • 문제: 블루투스 모듈을 탑재한 주변 기기까지 탐색하여 스마트 에어 베개 탐색 시간 지연 발생

   • 해결: 기기명을 ZAMDREAM로 변경하고, 앱에서 해당 이름의 기기만 탐색하도록 구현

   • 결과: 기기 탐색 시간 5초 -> 3초 감소(40% 개선)

2. 프로토콜 데이터 송신 이슈 대응

   • 문제: 알파벳+숫자 조합의 프로토콜 데이터 송신 시 디바이스 수신 오류 발생

   • 해결: 고유 알파벳 조합으로 프로토콜 데이터 규칙을 정의하여 데이터 송신 구현

3. 디바이스 셧다운 에러 대응

   • 문제: 프로토콜 데이터 전송 중 디바이스 연결 끊김 시 앱에서 상태 감지 불가 문제 발생

   • 해결: 에러 발생 시 프로토콜 전송 전 연결 상태를 확인하고, Modal을 통해 연결 끊김 안내 구현

개발 주요 사항

• AsyncStorage 를 활용하여 CRUD 구현

• Recoil 를 사용하여 데이터 상태 관리

• Google Admob를 사용하여 사용자 전면 광고 노출

문제 발생 및 해결 과정

• Recoil와 AsyncStorage 연동 개선

  • 문제: Recoil와 AsyncStorage 연동하면서 빌드는 정상적으로 되지만 렌더링이 안되는 이슈 발생

  • 원인

    • Promise 방식인 setSelf() 함수는 Recoil 내부에서 비동기 처리가 끝날 때까지 상태가 업데이트되지 않음

    • 그동안 UI는 undefined 상태일 가능성이 높아, React Native에서 렌더링이 제대로 되지 않을 수 있음

  • 해결

    • loadPersisted() 함수로 비동기 로직을 분리

    • trigger === 'get' 조건식을 사용하여 초기화 시점에서만 데이터를 불러오도록 최적화

      • 관련 블로그

개발 주요 사항

• BluetoothGatt 클래스를 이용하여 BLE 연동 및 서비스·특성 탐색 구현

• writeCharacteristic 메소드를 활용한 프로토콜 데이터 송신 처리

• WifiManager API 를 활용하여 Wifi SSID 데이터 조회 및 출력

문제 발생 및 해결 과정

디바이스 연결 지연 문제 대응

• 문제: GATT 신호 감지 및 디바이스 검색은 정상적으로 수행되지만, 연결이 즉시 이루어지지 않는 문제 발생

• 해결: GATT 스캐닝 종료 후 100ms 대기 후 디바이스 연결 시도 구현

개발 주요 사항

• Jetpack Compose 를 이용하여 선언형 UI/UX 구현

• Retrofit 을 이용하여 Restful API 구현

• SharedPrefrences 를 활용하여 자동 로그인 구현

• ViewModel 를 이용하여 데이터 상태 관리

• Repository 와 DataSource 상호작용을 추상화하여 데이터 접근 로직을 캡슐화

• Dagger & Hilt 를 활용한 의존성 주입 기능 구현

• Module 을 활용한 모듈화 기능을 통해 의존성을 감소시킴

문제 발생 및 해결 과정

1. api 통신 속도 개선

   • 문제: 리스트 CRUD 요청 시 데이터 응답 속도 및 컴포저블 렌더링 속도 저하

   • 원인: api 함수를 컴포저블 함수 내에서 구현하여 데이터 상태 관리 및 api 통신 속도 저하

   • 해결: 데이터 상태 관리, 데이터 접근 로직 캡슐화, 위존성 주입 등 MVVM 디자인 패턴 도입으로 api 통신 속도 개선

   • 결과: api 응답 속도 약 5초 → 1초 이내 감소(80% 감소)

2. 빌드 속도 개선

   • 문제: 앱 빌드 시 약 15초 이상의 시간이 소모

   • 원인: MVVM 패턴에 맞게 의존성 규칙을 정했지만 많은 양의 코드와 복잡한 구조로 인한 빌드 시간 증가

   • 해결: 도메인 지식을 캡슐화하는 방향으로 결정하여, Module을 활용해 기능 단위를 분리하고, 기능 간에 공통으로 사용되는 모듈을 추가적으로 분리함.

   • 결과: 빌드 시간 약 15초 → 약 10초 이내 감소(33% 감소)