Meteor.js

웹애플리케이션을 만드는 더 나은 방법

웹프레임워크. 웹개발자가 아니더라도 요즘 주변에서 흔히 들을 수 있는 키워드다. Angular.js, React.js, Ember.js처럼 최근 큰 반향을 일으키며 급성장하고 있는 것이 웹 프레임워크인데, 웹개발에 경험이 있다고 하더라도 이름만 들어서는 고개를 갸우뚱하게 된다. 전통적으로는 ASP.NET이나 아파치/톰캣 같은 웹개발/컨테이너도 웹프레임워크로 불리던 시절이 있었다. PHP나 JSP로 이미 충분히 구현 가능한 영역에서 저들의 역할이 무엇인지 궁금할 수 있다. 이들과 비슷하지만, 또 다른 성격의 플랫폼인 Meteor.js를 이야기 하며 대략적인 이해를 해보고자 한다.

자바스크립트 앱 플랫폼 Meteor.js, 앱을 만드는 더 나은 방법 (The JavaScript App Platform, Meteor.js, A better way to build an app)

js라는 꼬릿말에서 유추해 볼 수 있듯이 미티어(Meteor)는 자바스크립트로 이뤄진 플랫폼이다. 한가지 의문을 가질만한 부분은 앞서 나온 기술들을 ‘웹프레임워크’라고 지칭했던 반면 Meteor.js를 지칭할때는 ‘플랫폼’이라고 특정짓고 있다는 사실이다. 이 글은 프레임워크와 플랫폼이라는 용어의 불명확함 만큼이나 설명하기 어려운 주제를 쉽게 전달하기 위해 쓰였다.



유수의 프레임워크들과 함께 6위에 Meteor.js가 올랐다. <그림 1>은 깃허브(Github)와 스택오버플로우(Stack Overflow) 이용율을 기반으로 측정한 데이터다. 학문적인 연구나 이미 운영중인 레거시 시스템에 대한 기준이 아닌 세계에서 활발히 활동중인 현직 개발자들의 ‘관심 프레임워크 순위’라고 명명하는 것이 어울릴 듯 싶다. 아직 생소하지만 Meteor.js가 어느덧 상위에 기록될 만큼 역량을 갖췄다고 이야기 할 수 있다. 어떠한 이유로 저렇게 사랑 받고 있는지 한 번 알아보자.

Meteor.js 특징

● 풀 스택 프레임워크(Full Stack Framework, Platform)
Angluar.js, React.js로 대표되는 트렌디한 자바스크립트 웹프레임워크들은 프론트-엔드(front-end), 즉 웹 브라우저상 화면을 생성하기 위한 것이다. 미티어는 블레이즈(Blaze)로 대표되는 프론트-엔드 템플릿 엔진뿐만 아니라, Node.js를 기반으로 서버/데이터베이스(DB, 기본으로 내부 몽고DB포함 설치)까지 모두 연계해 마치 하나의 애플리케이션처럼 개발하고 구동할 수 있게 하는 컨테이너로 역할을 포함하고 있다. 따라서 별도 설정없이 간단한 서버 한 대로 애플리케이션 개발을 시작할 수 있다.

이에 더해 미티어의 가장 큰 장점은 앞서 언급한 여러 기술과 경쟁하거나 배제하는 것이 아니라 이들을 ‘포함’한다는 것이다. 이미 큰 영향력과 많은 개발자층을 확보하고 있는 앵귤러(Angular)나 리액트(React) 같은 프레임워크의 장점을 수용하고 함께 나아간다는 뜻이다. 물론 이 두 가지 프레임워크는 이미 미티어에 내재화돼 있다. 다음 링크에서 관련정보를 확인하실 수 있는데, 자신의 입맛에 맞는 프레임워크를 선택해 사용하면 된다. 일관성있는 서버 구성을 아키텍처링할 수 있다는 것은 뭇 개발자들에게 매력적인 유혹이 아닐 수 없다.

- www.meteor.com/tutorials/angular/creating-an-app
- www.meteor.com/tutorials/react/creating-an-app

● 풀 자바스크립트(Full javascript)
WEB-WAS-DB로 대표되는 전통 웹 서버 구조에서는 JAVA/SQL/JS(PHP) 등 몇 가지 이상 언어가 기본적으로 사용된다. 이들을 구동하기 위한 아파치/톰캣/제이보스 등 컨테이너 설정은 XML 혹은 셸 스크립트(Shell Script) 등으로 난잡하게 얽히어 있기 마련이다. 또한, 메이븐(Maven)이나 아이바티스(ibatis)/하이버네이트(hibernate) 같은 개발/관리 툴을 사용한다면 반복적인 작업으로 생산성을 높일 수 있겠지만 애자일이나 TDD 같은 개발 방법론을 지향한다면 아키텍처 자체가 빠르게 변화하는 것에 대처하기란 여간 어려운 일이 아니다.

- 애자일 관련 정보: goo.gl/LPFSFn
- TDD 관련 정보: goo.gl/XFJThl

하지만 미티어에서는 한가지 언어로 모든것을 처리 하기 때문에 개발 생산성이 대폭 증대한다. DB에서 데이터를 쿼리해서 WAS에서 가공 후 클라이언트(브라우저)에 데이터를 전달해 실제 화면을 생산하는데까지 사용되는 언어가 단 한가지다. 어떠한 언어를 사용하느냐를 떠나서 이 자체만으로도 환영받아 마땅한 시도라 할 수 있다.

● 프로그래밍 패턴/패러다임의 탈피
물론 그 한가지 언어는 자바스크립트다. 최근까지도 JS의 효용성에 대한 갑론을박은 여전히 뜨거운 감자가 아닐 수 없다. 어쩌면 오랜시간 함께한 유수의 언어들을 비난하는 것처럼 느껴지기에 더욱 민감한 주제일 수 있다. 하지만 분명한 것은 언어 그 자체가 아닌, 이를 어떠한 분야에 어떻게 활용하는지가 가장 중요하다. C로 대두되는 절차/구조적 프로그래밍에서 C++/#/JAVA를 거쳐서 OOP라는 프로그래밍 패러다임이 과거에 왕좌를 차지했었다면 이제는 그야말로 춘추전국시대다. 프로그래머 스스로 패턴을 정의하고 자유로운 프로그래밍을 선도해 나가는 시대가 대두했다. 자바스크립트는 함수형 언어로 폭넓은 자유도를 가지고 이를 실현할 수 있는 매개체로서 현재 가장 사랑받는 언어임을 부정할 수 없기에 수 많은 프레임워크들로부터 사랑받고 있고, 미티어 역시 이를 채택하고 있다.

또한 많은 프레임워크가 MVC와 같은 유명 패턴을 차용해 틀 안에서 편안한 마음으로 프로그래밍을 즐길 수 있는 환경을 제공하고 있다. 하지만 과연 이러한 틀이 편하고 즐겁기만 할까 틀이라는 것은 편안함을 주는 동시에 기능을 제한하게 된다. 간단히 구현할 수 있는 기능도 정해진 형식에 맞춰넣어야 하기에 수정 필요가 발생했을 경우에도 많은 부분을 고려해야 한다. 아키텍처나 모델링 같은 핵심 부분을 수정하기가 매우 어렵다. 미티어는 데이터의 흐름을 기준으로 클라이언트-서버-DB간 연결을 시도하고 있지만 각 내부 구현에 대해서는 개발자의 판단에 따라 유연한 형태의 패턴을 적용할 수 있도록 허용하고 있다. 이제 프로젝트를 따라가는 것이 아니라 이끌어 나갈 수 있다는 뜻이다.



● 리액티브(Reactive)
동시에 같은 웹 페이지를 보고 있는 다수의 사용자가 있다. 전통적인 웹에서는 한명이 글을 쓰거나 덧글을 작성한다고 해도 다른 사용자들은 화면을 리프레시하기 전까지는 본인 화면의 데이터가 변경되지 않는다. 이를 위해서는 에이젝스(ajax)나 소켓 폴링(socket polling) 등 기법을 통해서 복잡한 코드가 필요하다. 미티어에서는 퍼블리케이션/서브스크립션(publication/subscription)의 형태로 이를 기본적으로 지원하고, 이를 ‘마술(Magic)’이라고 지칭한다. 정식명칭은 리액티브(Reactive)다. 미티어는 DDP라는 자체 데이터 전송 프로토콜을 사용하고, 이를 통해 프로그래머가 궁금해하지 않는 모든 내부 기능을 처리한다.

Node.js로 구성된 서버는 몽고DB의 콜렉션(RDBMS의 테이블에 해당)을 대상으로 컴퓨테이션(Computation) 목록을 통해 변경감지(Observe)를 실시하고, 대상 데이터의 CUD(Create/Update/Delete) 액션이 확인 될 경우 이를 퍼블리케이션이라는 서버측 푸시 기능을 통해 클라이언트에 전달한다. 말로도 어렵고 그림으로도 어려운 복잡한 기능이, 실제 코드로는 단 서너줄이면 완성된다. 미티어가 리액티브를 마술이라고 표현하는 이유다.

- 관련 자료: docs.meteor.com/#/full/reactivity

● 지연보상(Latency Comprehension)
흔히 SPA(Single Page Application)라 부르는 단일 페이지 앱들은 사용자 반응성이 무엇보다 중요하다. 렌더링 요소를 최소한으로 줄이면서 사용자의 액션을 보다 적극적으로 반영해서 마치 네이티브 앱인 것처럼 빠른 사용성을 목표로 한다. 미티어에서는 로컬DB(Local DB)를 활용한 지연보상이라는 기술을 통해서 이를 극대화하고 있다.

● 모바일
HTML로 구성된 화면을 모바일 앱 프로젝트로 변환해주던 폰갭(PhoneGap)이라는 기술이 아파치(Apache)재단에 기부되면서 코도바(Cordova)라는 이름으로 바뀌었다. 미티어는 웹 개발 플랫폼으로 이를 내장해 미티어 런 아이오에스(meteor run ios, 안드로이드)라는 간단한 명령어로 모바일 프로젝트를 생성하고 각 시뮬레이터를 통해 테스트할 수 있기 때문에, 하이브리드 웹/앱을 생성하는 새로운 기준을 제시한다.

● 쉬운 설치
curl https://install.meteor.com/ | sh. 리눅스 혹은 맥 사용자라면 이 커맨드 한줄로 미티어(구동에 필요한 Node.js 포함)의 설치는 끝난다(단, 윈도우는 별도 설치 파일을 제공한다). 썰렁하지만 저 한줄의 커맨드가 설치 스크립트를 가져와서 자신의 OS환경에 맞는 개발환경을 모두 구축한다. 개발환경과 운영환경 세팅을 고민하던 시대가, 이제 막 지나가고 있다.

● 배포(deployment)
개발 환경에서 개발하고 배포를 위해 새로운 설정을 한다면 미티어에서는 미티어 빌드라는 키워드로 간단하게 배포버전 빌드를 할 수 있다. 그마저도 귀찮을 수 있다. 미티어 그룹 회원이라면 ‘meteor deploy sample.meteor.com’이라는 명령어로 간단하게 웹서버를 생성할 수 있다. 이미 눈치챘겠지만 웹브라우저에서 해당 url로 접근이 가능하다. 물론 저사양 클라우드 서버로 테스트를 위해 제공되는 환경이지만, 고객과 화면공유를 위해 별도 문서를 만들거나 파일들을 압축 할 이유는 없게됐다.

● 패키지 관리자
노드(Node)가 크나큰 사랑을 받을 수 있는 가장 큰 이유로 흔히들 NPM(Node Package Manger)을 이야기한다. 미티어는 Node.js로 구성된 플랫폼이기에 NPM 패키지를 모두 사용할 수 있음은 물론, 자체 관리 시스템을 통해 쉽게 패키지를 추가/삭제/업데이트를 할 수 있다. 라이브러리 의존성(library dependency) 문제도 간단히 해결했다. 자바스크립트가 불만이시라면 meteor add coffeescript. 이제 간단히 js 확장자를 coffee로만 변경해 새로운 구문을 사용해보자.

- 미티어 패키지 관리 페이지: atmospherejs.com/
- 관련자료: docs.meteor.com/#/full/meteoradd

● 미티어 갤럭시(Meteor Galaxy)
휴대폰이름이 아니다. 미티어 갤럭시는 가장 최근에 선보인 서비스로 아마존웹서비스(AWS)시스템과 같은 클라우드 배포/운영 서버를 제공gks다. 현재까지는 정식 오픈을 한 것도 아니고 개인 개발자를 위한 무료 플랜이 없으며 가격도 저렴하지 않지만 미티어만을 위한 편의 기능이 많은 점을 감안한다면 기대가 가는 서비스다.

그래서 단점은 없나

그럴리 없다. 미티어는 최신버전이 이제 1.2x 밖에 안 된 오픈소스라 기술적인 면에서는 아직 신생아와 같다. 대부분의 오픈소스는 새로운 기술일수록 부족한 정보와 크고 작은 버그들 사이에서 항해를 해야하는 게 숙명일 수 있다. 이를 최소화 하기 위해 대처할 수 있는 부분들에 대해서 이야기 해보자.

- 잦은 버전 업데이트에 따른 유지보수의 비안정성: 항상 최신 버전의 업데이트를 유지하는 것은 어느 시스템이나 어렵지만 미티어는 현재 급성장 중에 있기 때문에 더욱 자주 업데이트 하고 있다. 이 때문에 자신의 서비스에 맞는 업데이트 방안과 시기를 정하고 타당한 업데이트 계획을 세워 진행해야 한다. 또한 미티어로 이미 많은 사이트들이 개발/운영되고 있지만 국내 업체들이 상용화하기엔 안정성 검증이 부족하다 할 수 있다. 이 부분은 서비스에 맞는 선택이 매우 중요하기에 신중한 결정이 요구된다.

- 높아지는 학습비용: 미티어는 쉽다. 초기에 너무나 쉽게 시작하기 때문에 중반에 이어 후반부로 접어들수록 어렵게 느껴진다. 마치 마술처럼 쉽게 동작하는 많은 기능의 뒷 배경에는 이를 수행하는 똑똑한 코드들이 있게 마련이다. 이러한 배경 지식에 익숙해져야만 더욱 높은 성능과 간결한 코드를 가진 애플리케이션을 작성할 수 있다. 하지만 겁낼 필요는 없다. 왜냐하면, 우리가 살고 있는 프로그래밍 세계에서 이미 매일 벌어지고 있는 일이기 때문이다.

- 부족한 문서와 커뮤니티: 오래되고 저명한 다른 기술에 비해 아직 문서나 활동 유저수에서 부족함이 있다. 특히 한글 문서는 미티어 서울 커뮤니티의 부단한 노력에도 불구하고 아직 미미한 수준에 그치고 있다. 하지만 docs.meteor.com에서 볼 수 있듯이 미티어 예제는 매우 친절하고 직관적이라 편리하게 이해할 수 있다.

결론

미티어는 현재까지 약 360억 원에 달하는 투자를 유치했다. 단일 오픈소스로는 굉장한 규모고 이를 바탕으로 구글이나 페이스북의 실력있는 개발자를 고용해 미티어를 개발하고 있다. 오픈소스임에도 불구하고 마치 기업과 같은 형태로 개발과 지원을 하고 있다. 때문에 성장이 엄청나게 빠르고 진보된 기술들을 적용하는데 있어 서슴치 않는다. 이미 Angluar.js나 React.js 같은 유명 프레임워크가 미티어라고 하는 플랫폼 안에서 안정적으로 개발될 수 있도록 내장화되고 있고, 이에 대한 문서 또한 자체적으로 제공하고 있다.



그렇다. 미티어는 프레임워크가 아니다. 미티어는 순간순간 진보하고 있는 웹프레임워크들을 연결하고 지지하며 가장 현명한 방법으로 사용할 수 있게 돕는 플랫폼이다. 게다가 마치 마술과 같은, 간단하지만 파워풀한 몇 가지 기능을 통해 사용성을 극대화 해주고 개발자 에너지를 낭비하게 하는 대부분의 일들을 대신 떠맡음으로써 결국 가장 필요한 비즈니스 개발에 전념을 할 수 있도록 도와주는 친구 같은 존재다. 생소하지만 쉽기에 함께 시작해 볼 수 있는, 플랫폼으로서의 Meteor.js에 대한 소개였다.

출처 : 마이크로소프트웨어 11월호

제공 : 데이터 전문가 지식포털 DBguide.net