본문 바로가기

node.js (OctoberSkyJs)

[node.js 따라배우기 01] Webapp을 만들어 봅시다! : 노드패드(Nodepad)

첫 번째 따라배우기를 시작합니다. 아마, 익숙하지 않은 분들은 많은 것들이 낯 설게 느껴지실 겁니다. 하지만 당황하지 마시고,  우선은 그런가 보다 하고 넘어가시는 것도 괜찮습니다. 그리고 번역은 크게 오해가 안생기는 수준에서 빠르게 진행할 예정이라 다소 어색할 수 있습니다. 매끄럽지 못하더라도 양해해 주세요. (댓글로 지적해 주시는 부분은 수정할게요~ ^^) 자 그럼 part 01은 비교적 편한 마음으로 쉽게 읽으시면 되겠습니다.

원본 http://dailyjs.com/2010/11/01/node-tutorial/

파트1, "웹앱(Webapp)을 만들어 봅시다!"에 오신걸 환영합니다. 본 시리즈는 "Node.js"를 이용해서 웹 애플리케이션(이하 웹앱)을 만들어보는 따라배우기(tutorial)시리즈입니다. 본 시리즈는 node.js를 이용해서 웹앱을 만드는 과정을 따라가면서, 자신만의 애플리케이션을 만들 때 접하게 될 모든 영역을 다룰 예정입니다.

우리가 만들 앱은 Nodepad(노드패드)라 불리는 웹 노트패드입니다. 특별한 점은 없지만, (개념이)잘 정의되어 있고 이해하기 쉽습니다.


프레임워크와 도구 선택하기

현대의 웹 애플리케이션들은 몇몇 컴포넌트들에 의존합니다.

-       스토리지: 관계형 데이터베이스, NoSQL

-       저장라이브러리: 단순형, ORM

-       웹 서버

-       패키지 매니저

-       서버-사이드 프레임워크

-       클라이언트-사이드 프레임워크

-       테스팅 라이브러리

-       버전 컨트롤

선택은 전적으로 컨택스트(context)에 달려있습니다. 저는 배포 환경에 맞춰 특정 기술들을 사용해 왔습니다. 그리고 전 오픈소스 소프트웨어를 만들 때 사람들이 쉽게 설치할 수 있는 제품을 선호합니다. 이번 경우에 저의 선택은 제 자신의 전문영역과 독자들이 관심 있어 하는 기술에 대한 피드백을 기초로 정할 예정입니다.


서버-사이드(Server-Side)

노드(node.js)로 웹앱을 만드는 것은 어떤 식으로든 프레임워크가 관계됩니다. 만약 우리의 주간 아티클 Node Roundup을 읽었다면 뛰어난 프레임워크들이 수 없이 많이 존재한다는 걸 잘 알 겁니다. 어떤 것들은 Rails Django Node로 완벽 포팅하는 걸 목표로 삼기도 하고, 또 어떤 것들은 라우팅과 HTTP영역에 집중하고 있습니다. Rails스러운 프레임워크의 한 예는 Geddy입니다. 좀 더 간결한 걸로는 Sinatra 스타일의 프레임워크인 Express(엑스프레스)가 있습니다. Exprees 2009 6월에 시작되서 지금까지 꾸준히 업데이트 되고 있습니다.

더 큰 사이즈의 프레임워크들은 보통 모델//컨트롤러 추상화를 통해 리소스와 파일간의 one-to-many 맵핑을 제공합니다. 프로젝트는 다음과 같이 구성될 예정입니다.

-       모델: user.js, note.js

-       컨트롤러: users.js, notes.js

-       : index.html (아이템 목록), edit.html, new.html

모든 프레임워크가 다 MVC인건 아닙니다. 또한 node.js 월드에는 마이크로 프레임워크(microframeworks)라 불리는 것들이 많습니다. 저도 처음에는 Express가 마이크로 프레임워크라 생각했었습니다만, Express는 모든 스택을 다루는 추상층을 제시하고 있습니다. , 마이크로 프레임워크라 불리기엔 조금 더 뚱뚱하죠.

제 생각엔 Express가 이번 프로젝트에 적절한 것 같습니다. 상식적인 수준내에서 어떤 프레임워크이든 잘 쓸 수 있긴 합니다만, Express 번들이면 지나치게 무겁지 않는 수준에서 즐겁게 작업하기에 충분합니다.

 

프론트엔드(Frontend)

어떤 종류의 UI 프레임워크는 인터페이스 개발시에 필요한 잡다구리한 일들을 줄여줍니다. 자바 스크립트 UI 프레임워크들은 지난 수년사이에 폭발적으로 증가했습니다. 다음과 같은 종류의 프레임워크들이 우리 프로젝트에 사용가능합니다.

-       풍부하고(Rich), 데스크탑스러운 프레임워크: Cappuccino(카푸치노), SproutCore, Ext.js

-       저 수준 기능들을 제공하는 프레임워크: jQuery, Prototype, MooTools

-       저 수준과 리치 UI툴이 혼합된 프레임워크: YUI

-       저수준 프레임워크 위에 올려진 인터페이스에 특화된 라이브러리: Scriptaculous, jQuery UI

제 생각에 SproutCore(스프라우트 코어) Cappuccino는 이번과 같은 프로젝트에 적용하기에는 다소 무거운 것 같습니다. 지금은 jQuery UI Aristo theme가 잘 어울릴 것 같습니다. 무겁다는 느낌을 주지 않고도 훌륭한 결과를 얻을 수 있습니다.

 

테스팅(Testing)

CommonJS Unit Testing Specification에 대해서는  프레임워크를 만들어 봅시다에서 언급했었습니다. NodeunitCommonJS assert 모듈에 기반합니다. 그리고 이전에 작성했던 단위테스트들과도 매우 흡사합니다.

한편, Expresso(엑스프레소)는 서버를 좀 더 깔끔하게 테스트 할 수 있도록 assert.response를 제공합니다. ExpressoExpress와 동일한 저자(TJ Holowaychuk)가 만들었습니다. 그러니 이런 류의 기능을 제공한다는 건 사실 놀라운 건 아니죠. (테스트에 대해서는) 어느 쪽 노선을 따를지는 아직 결정 못했습니다. 앱을 만들어 가면서 둘 다 써보고 결정하겠습니다.


저장소(Storage)

저장소는 지난 2년간 미친듯이 변했습니다. 제가 처음 일을 시작 했을 때는 관계형 데이터베이스 아니면, 객체 데이터베이스(<--한번도 써본적은 없었지만 어쨌든) 둘 중 하나를 선택해야 했습니다. 다시 말해서, Oracle, PostgreSQL, 혹은 MySQL을 썼다는 이야기죠. 지금은 NoSQL이 자릴 차지하기 시작했습니다. 현재는 CouchDB, MongoDB, Riak, Redis, Tokyo Cabinet 등등 쓸수 있는 것들이 더더 많아졌습니다.

만일 이들 NoSQL 중에서 써본 것이 있다면, 몇몇은 쓰기 편한 자바스크립트 쉘을 가지고 있다는 걸 알 겁니다. 이들 NoSQL은 크게 키-밸류 저장소와 문서 저장 시스템(document storage systems)으로 나눌 수 있습니다. 사실 문서 저장소(Document 기반)가 우리가 만들고 있는 노트패드에 알맞을지는 조금 의심스럽긴 합니다.

 저장소 시스템은 선택도 선택이지만, 랭귀지와 프레임워크에 맞는 라이브러리를 고르는 게 필요합니다. Express는 모델 계층의 추상화를 규정하고 있지 않습니다. 그래서 어떤 저장소 라이브러리든 시스템이든 원하는 대로 쓸 수 있습니다.

 전 이 프로젝트에서 MongoDB를 쓸까합니다. CouchDB도 좋을 것 같습니다만, Mongoose(몽구스)를 사용해서 코드를 작성해왔기 때문에 해당 지식을 계속 이어갔으면 합니다.

Mongoose? 몽구스?

http://mongoosejs.com/

Mongoose MongoDB와 함께 사용하는 자바스크립트 라이브러리입니다. Mongoose는 현재 Nodejs 환경에서 작동하도록 설계되어 있으며 비동기 데이터 저장소와 관련된 복잡한 문제들을 해결하는걸 목표로 작성되었습니다. 장점으로 매우 이해하기 쉬운 API를 제공합니다. - 옮긴이 주

Mongoose API는 비동기적으로 데이터베이스를 쉽게 접근할 수 있도록 도와줍니다. node.js용 기본 MongoDB라이브러리는 좀 더 간결한 추상화와 함수 호출 체인(function call chains )대신, 어디서나 콜백(callback)을 사용합니다. 결과적으로 점점 읽기 어렵게 변합니다.

그래서 예전부터 전 MongoHQ와 함께 Heroku를 써왔습니다. 이들 서비스는 저의 시스템 어드민 잡일들을 아주 훌륭하게 간소화시켜 주었습니다. 기반이 되는 기술은 오픈되어 있기 때문에 MongoDB를 다운로드 받아서 개발용으로 실행하면 됩니다. 그리고 무언가를 배포하는 경우에도 다른 누군가가 효과적으로 유지보수 할 수 있습니다. 제가 시간이 있었다면 제 서버에 올렸겠지만, 전 그보다 이렇게 글을 쓰는 게 더 좋습니다.


참고자료(Resources)

- Comparison of JavaScript frameworks

- Node modules on the Node wiki

- NoSQL resources

- NPM package list

 

다음차례

다음 파트에서는, 개발 환경을 꾸지고 기본적인 앱을 셋업할 예정입니다.

본 튜터리얼은 다음과 같은 내용을 다룰 예정입니다.

-       설치하기

-       간단한 Express 앱 만들기

-       Node 웹 앱용 테스트 작성

-       jQuery UI를 이용해 리치 인터페이스 만들기

-       Node와 함께 Mongoose 사용하기

-       배포하기


Part 01을 마쳤습니다. 만약 OS가 리눅스/유닉스/맥OS가 아니신 분들은 Part 02를 준비하실때 미리 환경을 준비해 주시면 더 좋습니다.

1. 가상머신 소프트웨어 VirtualBox
https://www.virtualbox.org/wiki/Downloads

2. 우분투 Ubuntu : 가상머신에 설치해 주세요. 우분투 한국사용자 모임에서 제공하는 코분투 권장합니다. :)
http://www.ubuntu.or.kr/viewtopic.php?f=6&t=19304


둘다 설치하기 싫으신 MS윈도우즈 사용자 분들에게...
리눅스/유닉스/맥OS를 안쓴다고 사실 학습에 길이 없는건 아닙니다만, 갈길이 조금 멉니다. node.js 창시자 라이언 달(Ryan Dahl)은 윈도우즈 환경에서도 곧 쉽게 쓸수 있게 될거라고 말 합니다만, 아직은 정신건강상 우분투 설치나 맥 이용을 권장합니다. 저는 우분투/맥OS 두 환경 모두에서 테스트 해보고 있습니다만, 별 차이는 없습니다. 이건 여담입니다만, 맥북에어 같은 하드웨어에 우분투가 탑재되어 나온다면 개발자 환경으로는 최고가 아닐까 생각합니다. 쉘 환경은 맥이 아직 많이 부족하다는 쪽으로 저희 팀 내부 분과 합의 봤습니다. (혹시라도 이에 대한 공격은 반사!! ㅎ~)

흠흠! 어쨌든 여기까지 다 읽으신 분들은 아래에 댓글로 진도 체크 남기시면 되겠습니다.

아! 그리고 오리엔테이션에서 이야기 드렸던 것처럼 오늘밤(10.28) 11시 30분 부터는 Introduction to Node.js with Ryan Dahl 동영상 함께 보기 시간을 가질 예정입니다. 채팅룸은 제 트위터 계정(@doortts)으로 공지하겠습니다.

그럼 좋은 하루 되세요! :D