배민도 React Native 해요? - 우아콘 2023

 

최근에 앱 개발을 할 수 있으면 좋을 것 같다는 생각을 하고 있던 찰나 우아콘 세션 중 눈에 들어오는 세션이 있었다.

 

제목은 "배민도 React Native 해요?" 였고 배민 커넥트에서 React Native를 사용하고 있었다.

세션을 중심으로 적지만 아주 조금의 내가 느낀 점, 생각을 더해 글을 적어보려고 한다.

 

기술 부채

먼저 배민커넥트는 기존 Android 먼저 개발된 이후 iOS가 개발되었다고 한다.

각각 네이티브로 개발되어 있었고, 잘 작동하고 있었지만 리소스가 부족해 React Native로 앱 개발을 새로 했다고 한다.

 

이렇게 굴러가고 발표자가 처음에 이 프로젝트에 투입되었을 땐 몇 가지 장점들과 함께 만족하며 개발하고 있었다고 한다.

하지만, 개발할 수록 여러 가지 이슈들이 보였고 그 이슈들은 아래와 같다

 

이러한 문제 상황을 "한 손이 묶인 채로 하는 웹 개발" 이라고 표현했는데 앱 개발을 해본 적은 없지만 바로 와닿는 표현이었다.

 

개선

프로젝트를 개선하기 위해 여러가지 개선을 했다고 한다.

 

React

먼저 React를 개선했는데

• JavaScript -> TypeScript
• 클래스 컴포넌트 -> 함수형 컴포넌트
• 상태 관리 코드 간소화
• 소스 구조화

위와 같은 개선을 이루어 냈다고 한다.

(짧게 적어 놓았지만 하나 하나 뜯어보면 정말 아찔한 작업들이다..)

 

 

그리고 로직 중에 특정 라이프 사이클 메서드가 매우 길어진 경우가 있었는데,
이 문제를 해결하기 위해 클래스를 그림으로 표현하고 오른쪽처럼 개선을 이루어냈다고 한다.

 

네이티브

React 개선을 마무리하고 네이티브 먼지 털이를 진행했다고 한다.

• React Native 버전 업
• 서드파티 라이브러리 정리
• 커스텀 네이티브 최소화
• OS 별로 관리되던 리소스 병합

 

지도 개발

배민 커넥트는 좀 더 자세한 지도를 제공하기 위해 국내 지도를 사용했고, 이를 위해서는 각각 네이티브 코드가 필요한 상황이라고 한다.

 

그래서 기존에는 지도에 필요한 도메인 데이터를 싹다 props로 집어넣고 네이티브 코드가 가공해 사용했다고 한다.

이 코드는 편하긴 했지만 개발 비용, 수정에 대한 두려움 등 많은 이슈들로 지속 가능한 코드는 아니였다.

 

 

그래서 네이티브는 최소화하고 제어권은 최대한 React로 올려 사용해 수정하기 편하게 수정했다고 한다.

 

Etc..

특정 사례를 말해주진 않았지만 웹뷰도 일부 사용 중이고 적재적소에 활용 중이라고 한다.

또, flipper, sentry, storybook과 같은 tool도 도입해 사용 중이라고 함.

 

 

웹 개발자가 React Native 프로젝트를 하며 얻을 수 있는 능력에 대해서도 언급해 주었는데,

앱 개발이 가능하다는 점, 앱스러운 UX를 다룰 수 있다는 점, 있어 보인다는 점 등 얻어갈 수 있는 점도 언급해 주었다.

 

최근 앱 개발에 대한 관심이 있었는데 우아한 형제들에서 했던 React Native와 관련한여러 가지 시도, 팀에서 있었던 이슈, 해결 과정 등을 엿볼 수 있어서 좋았던 세션인 것 같다.

 

(아마 앱 개발을 해보고 다시 보면 더 공감되는 내용이 많을 것 같다)