모든 플랫폼에서 한 가지의 패러다임(paradigm)만을 사용해 앱을 만든다는 생각은 조금 비현실적인 것처럼 들립니다. 하지만 리액트 네이티브(React Native)는 다양한 플랫폼을 대상으로 앱을 개발할 때, 활용할 수 있습니다. 그리고 여러 플랫폼들 사이에 대부분의 코드를 재사용할 수 있게 해주기 때문에, 앱개발 과정을 빠르게 만들어주죠. 모든 장단점을 고려해봣을 때, 수많은 기업들이 모바일 앱개발에 있어서 리액트네이티브를 선택하는 것은 당연하다고 할 수 있습니다. 이번 시간, 위시켓은 프레임워크를 활용한 앱개발 사례들을 살펴보도록 하겠습니다. React Native로 유명한 어플들의 이야기, 지금 바로 살펴보시죠.

"2020년을 대표하는 React Native App 7가지"

01. 페이스북과 React Native

리액트 네이티브는 페이스북이 자신들의 필요에 의해서 만든 해커톤(hackathon)프로젝트의 하나로 시작되었습니다. 웹(web) 개발을 할 때는 반복처리가 신속하게 이뤄지며, 하나의 팀이 제품 전체를 책임지고 개발한다는 장점이 있죠. 그래서 페이스북은 이러한 모든 장점을 모바일에서도 이용할 수 있기를 원했습니다. 바로 이러한 점이 리액트 네이티브에게 생명력을 불어 넣어주고, iOS와 안드로이드 환경 모두에서 모바일 앱 개발을 가능하게 해주는 부분입니다. Resct Native를 만든 개발팀은 iOS용 페이스북 앱 안에 있는 이벤트 대시보드를 리액트 네이티브로 변환해서, 이런 종류의 어플리케이션에 있어서 중요한 요소인 가동시간(startup time)과 같은 앱 성능을 테스트했습니다. 기동 시간은 사용자가 느끼는 첫인상에 있어서 중요한 부분이면서, 앱을 계속 사용할 지 아니면 그만둘 지에 대해서 영향을 미치는 것이기도 합니다. 이들은 (이런 식으로 리액트 네이티브를 활용해서) 앱의 출시 기간을 절반으로 줄일 수 있었습니다.

02. 스카이프(Skype)와 React Native

2019년 초, 스카이프는 리액트 네이티브를 사용해서 완전히 새로운 앱을 개발하고 있다고 발표했습니다. 이는 모든 사용자들에게 아주 좋은 소식이었는데, 당시의 스카이프 앱은 상당히 잘 만든 것이긴 했지만 수많은 문제들 때문에 어려움을 겪고 있었기 때문입니다. 새로운 버전의 스카이프는 아이콘에서부터 전체적인 레이아웃에 이르기까지 완전히 바뀌었고, 몇 가지의 깔끔한 기능들도 추가되었습니다. 그리고 마이크로소프트 역시 모바일 플랫폼 뿐만 아니라 윈도 데스크톱 어플리케이션을 위해서도 리액트 네이티브를 사용하기로 결정했습니다. 유니버셜 윈도우 플랫폼(Universal Window Platform)을 지원하는 리액트 네이티브 플러그인을 가진 깃허브(GitHub)의 repository는, 현재 마이크로스프트가 인수해서 활발하게 개발이 진행되고 있는데요. 이는 리액트 네이티브(RN) 플랫폼에게 있어서는 좋은 신호이며, 이 플랫폼의 잠재력이 모바일 앱 개발 이상으로 발전할 수 있다는 것을 보여주고 있습니다.

03. 페이스북 광고와 리액트 네이티브

페이스북의 지원 아래에서 리액트 네이티브를 이용해서 개발된 어플리케이션은 페이스북 앱만 있는 것은 아닙니다. 실제로 리액트 네이티브를 이용해서 만든 첫 번째 안드로이드 앱은 페이스북 광고(Facebook Ads)이며, 페이스북 광고는 이 회사가 100% 리액트 네이티브 기반으로 만든 최초의 앱이자 크로스 플랫폼 앱이기도 합니다. 이 프레임워크는 광고 형식, 시간대, 날짜 표기, 각국의 통화와 표기 등의 차이를 정확하게 다룰 수 있었고, 그에 필요한 수많은 복잡한 비즈니스 로직(logic)들을 처리하는 데에도 완벽해 보였습니다. 그리고 특히 그런 로직들의 많은 부분들은 이미 자바스크립트(JavaScript)로 작성되어 있었습니다. 그 뿐만 아니라 리액트 네이티브를 활용하면, UI의 외관을 구현하는 것이 훨씬 더 쉬워집니다.

4. 인스타그램과 React Native

인스타그램은 사람들이 상상할 수 있는 가장 간단한 방식으로 메시지를 보여주는 것에서부터 시작해서, 기존의 네이티브 앱에 리액트 네이티브를 통합한다는 도전을 선택했습니다. 참고로 인스타그램의 푸시 알림 확인 기능은 원래 웹뷰(WebView)를 이용해서 구현되어 있었습니다. 리액트 네이티브는 아주 단순했기때문에, 그들은 네비게이션 인프라를 별도로 구축할 필요가 없었습니다. 인스타그램의 개발팀은 도중에 몇 가지의 문제에 직면하기는 했지만, 개발 속도를 크게 향상시킬 수 있었습니다. 각 소프트웨어에 따라서 코드의 85%에서 99% 정도가 안드로이드와 iOS 앱 사이에서 공유되었으며, 따라서 개발팀은 각각의 소프트웨어를 네이티브 솔루션으로 개발하는 경우보다 훨씬 더 빠르게 앱을 만들어낼 수 있었습니다.

5. 테슬라(Tesla)와 React Native

세계에서 가장 유명한 전기차 생산업체인 테슬라 역시 리액트 네이티브 커뮤니티에 가입해 있습니다. 테슬라는 자사의 전기차와 파워월(Powerwall) 배터리 소유자들이 사용하는 어플리케이션을 페이스북이 만든 이 트렌디한 프레임워크를 활용해서 개발했습니다. 이 앱은 전기차를 진단하고 위치를 파악할 수 있을 뿐만 아니라, 스마트폰의 도움을 받아서 그 중의 일부를 제어할 수 있게 설계되었습니다.

6. 월마트와 React Native

(오프라인의 최대 강자인) 월마트는 온라인에서도 세계 최대의 소매 기업이 되겠다는 정말 드높은 목표를 갖고 있습니다. 이처럼 거대한 목표를 가진 기업이 경쟁력의 우위를 확보하기 위해서는, 다소 리스크가 크다고 하더라도 과감한 행보를 취할 필요가 있습니다. 그래서 월마트가 언제나 신기술을 시도해서 고객들의 경험을 끌어올리기 위한 방법을 찾는 것입니다. 월마트는 이미 노드(Node.js)를 자신들의 기술 스택(stack)으로 도입함으로써, 자신들이 기술을 대하는 태도가 혁신적이라는 것을 입증했습니다. 또한 몇 년이 지나서 그들은 자사의 모바일 앱을 리액트 네이티브로 다시 만들었습니다. 월마트는 더 적은 리소스와 더 짧은 시간으로 iOS와 안드로이드 환경 모두에서 앱의 성능을 향상시킬 수 있었습니다. 플랫폼 사이에서는 코드베이스(codebase)의 95%가 공유되었으며, 개발자들의 역량과 경험은 조직 전체에서 활용되었습니다. 리액트 네이티브는 네이티브 앱과 거의 동일할 정도로 뛰어난 성능을 가능하게 했으며, 엄청나게 부드러운 애니메이션 효과도 만들어냈습니다.

7. 에어비앤비(Airbnb)와 React Native

에어비앤비 역시 자사의 모바일 어플리케이션에 리액트 네이티브를 통합했습니다. 그들이 이 프레임워크로 작업을 하면서 처음 알게 된 것은, 기존의 앱과 통합하는 작업에 비용이 많이 들기는 하지만 그만한 가치가 있다는 것입니다. 리액트 네이티브는 시작하기에는 아주 쉬웠지만, 개발 과정에서는 몇 가지의 문제들이 나타났습니다. 그러한 주요 이슈들은 리액트를 처음 접하는 사람들이 리액트 앱의 상태 관리(status management)라는 개념에 어려움을 겪었기 때문에 나타난 것이었습니다. 반면에 가장 커다란 장점은 코드를 재사용할 수 있다는 것입니다. (리액트 네이티브에서는) 대부분의 구성요소들을 재사용 할 수 있습니다. 게다가 리액트는 코드를 아주 쉽게 만들었기 때문에, 리팩토링(refactoring)과 반복작업에서도 유용하게 활용될 수 있습니다.
> 이 글은 '13 Great Examples of React Native Apps in 2020'를 각색하여 작성되었습니다.