[React Native] Flipper Firebase MMKV Debbuger 관계

React Native는 디버깅에 필요한 다양한 도구와 라이브러리가 있으나 호환성이 맞지 않아 문제가 생기는 경우가 많다.

 

너무 충돌이 많은데 매번 시도하다가 까먹어서 여기에 남긴다.

 

우선 MMKV먼저 설명하겠다.

 

[MMKV]

MMKV : AsyncStorage보다 훨씬 빠르고, 동기로 동작하는 매우 매력적인 라이브러리다.

https://github.com/mrousavy/react-native-mmkv

GitHub - mrousavy/react-native-mmkv: ⚡️ The fastest key/value storage for React Native. ~30x faster than AsyncStorage!

 

 

이 친구를 쓰면, 매우 편리해진다. 코드의 양과 로직도 비약적으로 단순해진다. Async Await을 사용하지 않아도 되기 때문이다. 연쇄적으로 storage에서 데이터를 불러오기 위해, useEffect 등을 쓸 필요도 감소하게 된다.

 

그러나 단점이 있다. 이 MMKV를 사용하면, 크롬에서 디버깅을 할 수 없게 된다. Remote Debugger를 사용할 수 없기 때문이다.

https://github.com/mrousavy/react-native-mmkv/issues/245

Do we support chrome debugger? · Issue #245 · mrousavy/react-native-mmkv

 

그럼 무엇을 써야할까? 일반 터미널 콘솔을 보거나, 아니면 Flipper를 사용을 시도할 수 있다.

 

[Flipper]

https://fbflipper.com/

Extensible mobile app debugger | Flipper

Facebook에서 만든 디버그 툴인데 매우 유용하다. 크롬 디버거보다 더 자세히 편리하게 사용할 수 있다.

 

그러나 이것을 사용하면 iOS에서 Firebase를 사용할 수 없다.  이것은 매우 충격적이다.

firebase를 사용하기 위해서는 podfile에 use_frameworks!를 넣어야 한다.

그러나 Flipper는 use_frameworks를 지원하지 않는다.

https://github.com/facebook/flipper/issues/4855

Question: Why doesn't flipper support "use_frameworks"? · Issue #4855 · facebook/flipper

 

정리하면 다음과 같다.

 

[정리]

MMKV를 사용하면, 크롬 디버거를 쓸 수 없고, Flipper를 써야한다.

Flipper를 사용하면, Firebase를 사용할 수 없다.

 

MMKV 사용 여부	Firebase 사용 여부	Chrome 사용가능?	Flipper 사용가능?
O	O	❌	❌
O	X	❌	✅
X	O	✅	❌
X	X	✅	✅

 

 

나의 프로젝트는 MMKV를 포기할 수 없다. Firebase도 포기할 수 없다. 그러므로 chrome, Flipper 둘 다 쓸 수 없다.

대안책으로 MMKV를 Dev환경에서는 사용하지 않고, Map으로 대체하는 것이다.. 그런데 이것이 디버깅에 활용을 할 수 있을지는 의문이 든다.

 

그냥 기존처럼 터미널로 디버깅하는 감각을 키우는 게 좋을 것 같다.