React Native vs Android / Swift

왜 React Native 가 좋은가?

 

Android / Ios Native 를 Java, Kotlin, Swift 를 통해서 개발한다고 생각해보자.

단순히 한 화면에서 다른 화면으로 전환하며 데이터 전달을 한다고 할 때 간단히 보면 아래와 같다.

논리적으로나 복잡도에서나 react native 가 가장 단순하고 논리적이라 할 수 있다.

또한 안드로이드나 Swift 네이티브의 경우 구현을 하려면 꽤나 성가신 것을 알 수 있다.

간단한 화면 전환에서 데이터 전달을 함에 있어 인텐트, 액티비티, 세그웨이, 뷰컨트롤러 등의 고차원적 개념과

이를 각 문법에 맞게 그들 특유의 방식에 맞추어 공을 들여 구현해야 하고 또한 이런 간단한 의도를 코드로 구현하고자

함에 있어 여러가지 고려하고 생각해야할 것들이 많아 상당히 성가시고 개발보다는 공부에 치중하게 만든다.

공부할 량이 많아지면 암기할 사항도 많아지고 내가 원하는 결과물을 구현하는 것보다 개발공부에 더욱 치중하게 만든다.

개발공부는 해야하지만 결국 우리의 목적은 원하는 비즈니스 로직을 효율적으로 빠르고 안정적으로 구현하는 것이다.

네이티브는 매우 심화된 부분의 표현 그리고 최신 네이티브 OS 의 신기술 적용에 있어 대단한 이점이 있는 것은 사실이다.

하지만 각 네이티브의 개발의 레퍼런스는 아직도 MVC 패턴에 맞춘 개발 방식과 쓰레드 기반의 개발 방식을 기본적으로

하고 있으며 최신의 Reactive 한 방식의 개발 방식까지 고려하며 제대로 된 개발을 하려면 Android 또는 Swift 중

한가지만을 수년동안 개발한 경력자 정도가 되어야 가능할 것으로 보인다. 리액트 네이티브는 리액트의 개발 방식을 

따르기에 react-dom 의 개발 방식과 로직 그리고 라이브러리 마저도 많은 부분 그대로 가져다 사용할 수 있으며 또한

UI 개발에 있어서는 react 의 개발 방식은  MVVM 과 함수형 프로그래밍을 적용한 최적의 방식이라고 할 수 있다.

json 과 같은 데이터 구조 형식 그리고 type 을 가진 javascript 언어의 개발 편의성 그리고 javascript 진영의 가벼운

패키지 매니저 시스템은 개발 생산성에 있어 말 할 필요도 없이 높다. 이러한 모든 측면을 고려했을 때 리액트 네이티브가

실제 개발에 있어서 제일 좋은 것으로 보인다. Flutter 도 있지만 코딩이나 개발방식 그리고 생산성 그리고 성능에 있어

모두 좋긴하지만 웹 개발과의 개발방식 공유가 안되며 플러터 자체만을 위한 공부를 해야하는데 그럴 바엔 리액트 쪽이

더욱 좋아보인다. 그리고 리액트 네이티브 쪽이 더 많은 성숙한 라이브러리들이 존재하고 개발 방식, 개발 언어, 친숙성 등이

더욱 보편적이고 좋아보인다. 플러터의 모바일 쪽의 개발 방식 측면에서만 보면 잘 만들어진 것은 맞는 듯 하다. 하지만

분명 이 둘은 대립적인 관계에 있다고 볼 수 있다. 왜냐하면 Android / Ios 네이티브는 기본적으로 조금씩은 학습해야 하지만

React Native 와 Flutter 는 둘 중 하나만 선택하는 관계에 있다고 볼 수 있기 때문이다. 무언가 완성도 있는 그리고 개발이 

주축이 되는 대기업 정도의 규모가 아니라면 Android / Ios 네이티브 보다 리액트 네이티브를 기본으로 선택하고 각 네이티브

도 필요에 따라 만들어 가는 방식이 가장 현실적으로 좋은 선택이라 할 수 있다.

 

case: Android

  intent = new Intent(MainActivity.this, SecondActivity.class);

  intent.putExtra("key", "value");

  onActivityResult(int requestCode, int resultCode, Intent data) { ... }

  startActivity(intent); 또는 startActivityForResult(intent, REQUEST_ACT);

  SecondActivity 에서 intent.putExtra("result_msg", "결과 반환값"); setResult(RESULT_OK, intent);

  finish();

 

case: Swift

  첫번째 화면: prepare(for segue: UIStoryboardSegue, sender: Any?) {

    // 이동할 화면의 txtSent 변수에 접근해 값을 셋팅하고 화면 전환한다.

    if let firstView = segue.destination as? SecondViewController { firstView.txtSent = "Sent!" }

  }

  두번째 화면: var txtSent = ""; viewDidLoad() { super.viewDidLoad(); lblReceived.text = txtSent }

 

case: React Native, react-navigation

  첫번째 스크린: navigation.navigate('SecondScreen', { hello1: 'Hello1', hello2: 'Hello2' });

  두번째 스크린: const { params } = props.route; params.hello1; params.hello2;