본문 바로가기

.Net/Xamarin

Cordova vs React Native vs Xamarin 비교

2017년 4월 29일 업데이트


최근 React Native 개발을 경험 할 기회가 생겨 React Native내용을 일부 업데이트합니다.


----------------------------------------------------------------------------------

아래 글은 조금 민감 할 수도 있는 글이기에 몇가지 사항을 미리 밝힙니다.

저는 Cordova, React Native에 대한 개발 경험을 갖고 있지 않습니다. 

일부 학습을 목적으로 정보 수집 및 주변 개발 경험자를 통해 의견을 정리 한 것입니다. 

사실 관계가 다른 부분이 있다면 의견 주시면 수정하도록 하겠습니다.


또한 아래 글을 단순 번역 한 것은 아니지만 제 개인적 의견을 통해 각색 및 편집된 내용들이 입니다.

http://noeticforce.com/mobile-app-development-cordova-vs-react-native-vs-xamarin


안녕하세요. 김승진입니다.


모바일 앱을 만들기 위한 방법은 여러가지 방법이 있습니다.  가장 기본은 디바이스별 특화된 기술을 배우는 것입니다. 

iOS 또는 Android 제조사의 개발 기술을 배우는 것이 가장 첫번째 일 것입니다. 

예를 들면 iOS(Swift, objective C), Android(Java), Windows(.Net) 등의 특정 프로그래밍 언어와 도구에 익숙해 지는 것입니다.  

하지만 모바일 시장의 극심한 변화에 따라 한마리 토끼만 잡는 것은 좋은 전략이 아닐 수 있습니다. 

 

최근 전세계 모바일 시장의 60% 이상을 차지하는 Android 시장은 Oracle의 Google에 대한 JAVA 지적재산권 침해 소송에 따라 위축 되고 있습니다. 삼성도 Galaxy 와 별도로 Tizen이라는 별도의 OS를 개발하고 있습니다. 시장이 변하고 있습니다. 

 

이에 모바일 크로스 플랫폼 개발 전략이 될 수 있는 3가지 기술에 대해 알아 보도록 하겠습니다.  

 

  • Cordova 기반의 하이브리드  개발 

  • React Native 기반의  개발 

  • Xamarin 기반의  개발


올바른 개발 방법의 선택은 매우 중요합니다. 한번 시작된 개발 방법은 업데이트, 버그패치개발 리소스, 생산성 등  기능 이상의 범위에서 영향을 미치게 됩니다. 또한 결정적으로 한번 선택한 개발 방법은 돌아 갈 수 없습니다.(전면 새롭게 개발 하면 가능합니다.) 

 

개발 방법을 선택하는 중요한 변수는 아래와 같습니다. 

 

  • 개발팀의 기술 역량/경험 

  • 개발팀의 전략 및 비젼 

  • 앱의 특화된 요구사항 

  • 사용자 그룹의 특징(스마트폰 비율 등) 


    1. Cordova 기반의 하이브리드  개발 

Cordova 기반의 개발은 Javascript, HTML5, CSS를 기반으로 개발 할 수 있어서 웹 개발자들에게 인기 있는 옵션 중 하나입니다. 

Javascript, HTML5, CSS만으로도 개발이 가능하지만 Ionic, Kendo UI, jQuery Mobile 등의 프레임워크를 활용하면 개발 시간을 줄일 수 있습니다. 

 

Cordova는 각 디바이스의 구성요소를 컨트롤 할 수 있는 JavaScript API  제공합니다. 

Cordova는 JavaScript, CSS, WebView가 포함된 HTML를 함께 컴파일하여 앱을 만듭니다. 

 

JavaScript API는 디바이스의 구성요소와 앱을 연결해 주는 다리 역할을 합니다. 

웹 개발자인 경우 신기술을 배우지 않고도 기존 기술을 최대한 활용하여 개발 및 유지 관리 할  수 있다는 점이 매력적입니다.. 

 

또한 중요한 점은 앱이 OS가 WebView 안에서 실행된다 것이다. 

 

이것은 큰 장점이자 큰 단점이 될 수 있습니다. 

디바이스 종속성이 없다는 이야기인데 디바이스의 특수한 기능을 활용하는데 제약이 있거나 성능을 최대한 활용 할 수 없다는 의미이기도 합니다. 반면 오래된 디바이스에서도 성능 영향을 최소화된 상태에서 실행 될 수 있다는 점입니다. 

 

    2. React Native 기반의  개발 

React Native는 iOS와 Android 기반의 모바일 앱을 개발 할 수 있는 최고의 옵션 중 하나입니다. 

Facebook에서 만들어진 오픈소스 프레임워크입니다. 현재(2017년 4월) 기준으로 0.43버전으로 으로 정식 버전이 아니기 때문에 여러가지 변화가 많이 있습니다.

 

React Native 가 소개된지 오래되지 않았지만 이미 세계의 많은 개발자와 조직이 크로스플랫폼 모바일 개발 방법으로 활용하고 있습니다. 

예로는 SoundCloud Pulse, Discovery VR, FaceBookAds Manager, Bit Wallet, Squad, Myntra and Running 이 있습니다. 


React Native 역시 JavaScript 기반이지만 배우는데 약간의 시간을 투자해야 합니다. 사실 ECMAScript6 기준이기 때문에 과거의 JavaScript와 비교하기는 어려울 것으로 보입니다.(개인적으로는 TypeScript를 지원하지 않는 것이 아쉽습니다.)


또한 React에 대한 이해가 필요합니다. React는 웹 어플리케이션 프레임워크입니다. 

React Native는 React의 확장이며 동일한 철학을 사용합니다. 

 

React 프레임워크 외에도 JSX 이해해야 합니다. 

JSX를 학습하고 나면 React Native UI 구성요소를 쉽게 쓸 수 있습니다. 

 

XCode, iOS Simulator와 Android를 빌드하기 위한 명령줄 도구를 이용합니다. 

또한 Flux와 Redux같은 아키텍쳐 프레임워크 지식은  개발의 구성 및 속도를 높이는데 도움이 됩니다. 


React Native는 JavaSciprt를 이용하여 프로그래밍하지만 실제 XCode와 Andorid Studio를 통해 각 OS의 네이티브 코드를 확인 할 수 있게 됩니다.(결과적으로 코드 제너레이트 방식과 유사) 단순한 App을 개발 할 때는 상관이 없겠지만 복잡하고 각 네이티브 특성에 맞춰진 기능 들은 개별 네이트브에서 해결해야 하는 경우도 있습니다.


여기서 가장 큰 장점은 대중적인 JavaScript 기반으로 모바일 크로스 디바이스가 개발이 가능하다는 점입니다. 

 

이 부분 역시 규모가 큰 프로젝트에서 고민스러운 부분이 있습니다. 

 

    3. Xamarin 기반의  개발 


개발 철학은 React Native와 비슷합니다. 

다만 JavaScript 대신 C# 을 사용한다는 점이 큰 차이입니다. 


처음에는 React Native와 비슷한 철학을 갖고 있다고 생각했는데 2가지 기술을 모두 경험해 본 결과 다릅니다.

단순 C#과 JavaScript 언어를 쓴다는 차이 뿐 아니라 기술 아키텍쳐 측면에서 많이 다르다고 할 수 있습니다.


React Native는 JavaScript로 개발을 하고 각 네이티브에 특수하기 올려진 브릿지를 통해 네이티브로 변환되는 구조라면

Xamarin은 각 네이티브에 대응되는 모든 객체가 C#라이브러리로 랩핑되어 있고 컴파일 시 네이티브 고유의 바이너리로 변환됩니다. 따라서 아무리 복잡한 구현을 한다 할지라도 C# 언어의 문법적 특성을 유지하며 개발 할 수 있습니다.

반면 React Native는 복잡한 구현 시 네이티브 코드가 생성되어 각 각의 언어로 직접 수정해야 하는 상황이 생길 수 있습니다. (무엇지 더 좋을지는 각자 판단해보시길 바랍니다.)

 

C# 을 사용하기 때문에 현존하는 가장 진보된 IDE의 Visual Studio를 이용하여 앱을 개발 할 수 있습니다.  

맥 사용자는 Xamarin Studio 또는 Visual Studio for Mac  통해서 동일하게 개발 할 수 있습니다. 


Xamarin.Forms에서는 XAML(React Native의 JSX 와 비교대상) 를 이용하여  각 네이티브의 공통 UI를 만들 수 있습니다.


Xamarin은 크로스 플랫폼으로 iOS, Android, UWP(Windows Phone) 기본으로 추가적으로 tvOS, 삼성 Tizen 등을 지원합니다(아마 가장 넓은 크로스 플랫폼 지원) 


2번(React Native)과 3번(Xamarin)의 고민


복잡하지 않는 앱을 신속하게 크로스 플랫폼으로 개발이 필요하다면 React Native가 선호될 것으로 예상됩니다.

하지만 장기적 측면에서 앱의 유지관리해야 하는 고려사항과 크로스플랫폼의 철학적 측면에서는 Xamarin이 선호됩니다.


실제 React Native 커뮤니티에서 이뤄지는 대화의 내용을 보면 복잡도가 높은 앱 개발을 위해서 XCode와 Android Studio 없이는 불가능해 보입니다. 반면 Xamarin은 Visual Studio 또는 Xamarin Studio에서 모든 개발을 끝낼 수 있습니다. 


또한 크로스플랫폼 기술은 단순 모바일 플랫폼만을 대상으로 하지 않습니다. TV, 냉장고 등 더 다양한 분야에서 확대될 수 있는 기술입니다. 


이러한 부분에 대한 고려와 해당 기술 뒤에 누가(서포터) 있는지를 잘 고려해서 판단하시길 바랍니다.