10월 4주차

📌 기획자님 이해시키기

새로 들어오신 기획자분께서 다음과 같이 질문을 해주셨다.

코드를 짜는게 AOS, IOS에 상관없이 구현이 되는거에요? 뭘 하구있냐면, 버튼쪽 구현하는걸 보고 있는데, 보니까 버튼 구현할 때 파라미터로 컬러값 넣으면 안드로이드는 버튼 백그라운드가 바뀌고 IOS는 텍스트 컬러값이 바뀌더라고요? 그래서 혹시 저희가 개발하는거를 IOS 빌드할 때 그대로 입히나(?)하는 비개발자의 질문…입니다. 이해가 되시나요?

react-native의 특정 코드가 실행되는 플랫폼에 의존하는 것에 대해서 여쭤보신 것 같다(웹뷰로 구현하기 때문에 react-native에 대해 딥하게 들어가진 않아서 구체적으로 어떤 코드가 어떻게 영향을 받는진 잘 모르겠지만). 설명하는 것을 좋아하는 나에게 있어서 이 질문은 소소한 행복으로 다가왔다.🤩

어떻게 해야 쉽게 이해시킬 수 있을까 고민하다가 나온 답변은 아래와 같았다.

리액트 네이티브 + 리액트 두개를 이용해서 개발하고 있는데요. 리액트 네이티브만 사용해서 개발한다면 OO님이 말씀하신대로 컬러값을 넣었을 때 IOS나 AOS에 따라서 버튼 색깔이 적용되는 모습이 다를거에요.

그런데 리액트 네이티브와 리액트 두개를 이용하는 이유는, 이렇게 플랫폼에 따라서 다르게 취급해야 하는 코드를 작성하는게 너무 귀찮고 번거로우니까 그런거에요.

리액트 네이티브가 하는 역할은 우리가 만든 프로젝트를 앱을 통해서 보여줄 수 있게 만드는 역할밖에 없어요. 마치 어떤 영화 카세트 테이프를 넣느냐에 따라서 티비에 나오는 영화가 달라질 수 있잖아요?

여기서 티비가 리액트 네이티브고, 카세트 테이프가 리액트인거에요. 웹 화면에 대한 정보를 실제로 담고 있는 녀석이 카세트 테이프가 되는거죠. 그리고 단순한 웹 화면은 AOS와 IOS에 따라서 달라지지 않기 때문에, 앞서 말한 리액트 네이티브의 취약점을 보완할 수 있게 되는거에요.

물론 여기에는 카세트 테이프를 앱이 아닌 웹으로도 바로 접근할수 있다는 점은 생략됐지만,,, 나중에 천천히 알려주는 걸로 🫠