소프트웨어 전문지 마이크로소프트웨어의 최신호는 우리가 매일 접하는 웹 페이지, 모바일 등 프론트엔드(Front-End)를 주제로 담았습니다. 자바스크립트, 정적 타입, 리액트, 뷰, 앵귤러, 일렉트론, ESNext 등 마소 393호의 주요 기사들을 IT조선 독자에게도 소개합니다. [편집자주]

자바스크립트 생태계가 빠르게 발전하며 자바스크립트의 활용 영역이 점차 확대됐다. 백본(Backbone.js), 엠버(Ember.js), 리액트(React.js), Vue, 앵귤러(Angular) 등 라이브러리와 프레임워크가 등장하기 시작했고, 자바스크립트 개발 효율성을 높여주는 NPM, Gulp, 웹팩(Webpack) 등 도구 또한 쏟아져 나왔다. 이런 빠른 변화는 자바스크립트를 매력적인 언어로 탈바꿈시킬 만했지만, 그만큼 개발자에게 많은 혼란을 줬다.

시간이 지나고 수많은 프레임워크와 라이브러리, 도구 중 ‘꽤 괜찮은’ 것만이 부각됐고 리액트, 앵귤러, Vue가 프론트엔드의 주축을 이뤘다. 수많은 프레임워크, 라이브러리, 도구 중에서 어떤 것을 선택해야 할지 고민했던 개발자는 대부분 세 가지 프레임워크 중 한 가지를 선택하고, 선택된 프레임워크가 지원하는 도구를 활용해 개발하기 시작했다.

자바스크립트 프레임워크 현 3대 천왕 앵귤러, 리액트, Vue. / 마이크로소프트웨어 393호 발췌
자바스크립트 프레임워크 현 3대 천왕 앵귤러, 리액트, Vue. / 마이크로소프트웨어 393호 발췌
하이브리드앱의 개념이 나온 건 꽤 오래전이다. 초창기 하이브리드앱을 개발하기 위해서는 원하는 플랫폼(iOS, Android 등)의 언어를 다룰 줄 알아야 했다. 웹뷰를 네이티브 앱으로 감싸고, 필요한 네이티브 기능(카메라, 푸시 메시지 등)은 해당 언어로 개발해야 했기 때문이다. 앱의 전체적인 구조는 HTML, CSS, 자바스크립트로 개발하지만, 제대로 된 하이브리드앱을 만들기 위해서는 해당 플랫폼에 대한 개발 지식이 필요했다. 또한, 네이티브 앱을 만들 때와 같이 어느 정도의 개발 공수가 들어가는 것은 피할 수 없었다.

이런 단점을 보완하기 위해 하이브리드앱 개발을 도와주는 프레임워크가 나오기 시작했다. 초창기 프레임워크의 대표적인 예로 아파치 코도바(Apache Cordova), 타이젠(TIZEN), 센차터치(Sencha Touch) 등이 있다. 이런 프레임워크의 등장으로 개발자들은 모든 플랫폼의 언어를 알지 못해도 자바스크립트를 통해 필요한 네이티브 기능을 개발할 수 있게 됐다.

하지만 레퍼런스의 부족과 네이티브 앱에 비해 현저히 떨어지는 성능 그리고 네이티브 기능 구현의 한계(제공되는 플러그인의 부족)로 인해 크게 주목 받지는 못했다. 시간이 흘러 자바스크립트가 빠르게 발전을 했고 리액트, 앵귤러, Vue가 주축을 이루면서 하이브리드앱 개발 프레임워크가 나오기 시작했다. 리액트 네이티브(React Native)와 아이오닉(IONIC)이 대표적인 예다.

한국에서는 아이오닉을 활용한 사례가 많지 않은 듯하다. 하지만, 외국에서는 아이오닉 커뮤니티가 꽤 활발하게 운영되고, 레퍼런스도 넘쳐난다. 아이오닉은 앵귤러, 타입스크립트(Typescript), 웹팩 등을 통해 개발한다. 앵귤러에 익숙한 개발자라면 아이오닉에 익숙해지는 데 큰 무리가 없다.

아이오닉은 하이브리드앱을 개발하는 프레임워크다. 아이오닉 프레임워크가 지원하는 코드 압축 및 최적화 도구를 사용하더라도 네이티브앱과 비교하면 성능 면에서 뒤떨어질 수밖에 없다. 그런데도 아이오닉 프레임워크를 사용하는 데는 이유가 있다.

김정환 필자의 아이오닉에 대한 자세한 내용은 ‘마이크로소프트웨어 393호(https://www.imaso.co.kr/archives/3408)’에서 확인할 수 있다.