node.js + express + jqtpl
요즘 신기술이 넘쳐나고 있는데 나는 구닥다리 기술만 쓰고 있다는 생각이 들었다.
심지어 얼마전에야 ruby on rails, android를 알았다. -_-; 반성하자.

그래서 새로운 기술들만 써서 뭔가를 만들어보기로 했다.
오늘은 그 시작인 node.js로 웹서비스 만들기.

node.js

node.js는 v8 엔진을 통해 브라우저 밖에서 javascript를 사용할 수 있게 했다.
요즘 대세라고 할 수 있겠다.
설치는 아주 쉽다.
$ ./configure --prefix=/usr/local
$ sudo make install

추가 모듈의 설치도 npm을 통해서 쉽게 할 수 있다.
$ npm install [설치할 모듈명]

간단한 서버를 만드는 방법은 쉽지만 웹서비스를 만들기 위해서는 url을 적절한 함수로 연결해주어야 하는데 이 부분은 node.js에서 제공하고 있지는 않다. 그래서 rails 같이 url을 연결해주는 녀석을 찾았는데 바로 express이다.


express

express는 node.js로 웹서비스를 쉽게 만들수 있도록 도와준다.
닥치고 설치(? ^^;)부터 하는 스타일이라 일단 설치!
설치는 npm을 사용해서 하면 되는데 -g 옵션을 주면 좀 더 편하게 쓸 수 있다. (PATH를 자동으로 걸어줘서)
$ sudo npm install express -g

자! 이제 프로젝트를 하나 만들어서 실행해보자.
express는 뭔가 rails 비스무레한 방법을 사용하는데 역시 간단하다.
$ express hello             # hello 라는 express 프로젝트 생성
$ cd hello
$ npm install -d            # hello에 필요한 모듈 설치
$ node app.js               # hello 웹서비스 시작

개발 외적인 것들을 이렇게 편하게 만들어주니 개발자로서는 아주 좋다. 개발에만 전념할 수 있으니까.

그런데 여기까지는 참 좋았는데 문제가 하나 생겼다.
express는 jade라는 template engine을 사용하고 있었다.
설명하기로는 사용하기 쉽고 성능이 좋다는데 이게 어딜봐서 사용하기 쉽나!!
완전히 새로운 언어구만...
!!!
html
  head
    title= title
    link(rel='stylesheet', href='/stylesheets/style.css')
  body!= body

그래서 다른 engine이 없나 찾아봤다. 역시 다른 engine으로 교체가 가능했다.
Haml, Jade, EJS, CoffeCup, jQuery Template 총 5개가 사용가능했는데 Haml, Jade는 비슷한 놈이고 CoffeCup도 가만보니 coffe script를 또 배워야 하는거고 그래서 jQuery Template를 써보기로 했다.
(근데 생각해보니 새로운거 써보기로 하고 이거 하는건데 걍 jade쓸까? ^^;;)


jQuery Template

jQuery Template(jqtpl)는 jQuery에서 template쓰듯이 쓸 수 있다. 아주 익숙한 방법으로..
먼저 사용하기 위해서는 기본 설정인 jade를 jqtpl로 바꿔야 한다.
app.js 에서 view engine을 jqtpl로 바꾸는 방법이다.
app.configure(function(){
  app.set('views', __dirname + '/views');

  // jade를 삭제하고 .html 파일에서 jqtpl을 require한다.
  // app.set('view engine', 'jade');
  app.set('view engine', 'html');
  app.register(".html", require("jqtpl").express);

  app.use(express.bodyParser());
  app.use(express.methodOverride());
  app.use(app.router);
  app.use(express.static(__dirname + '/public'));
});

자, 이제 당황스러운 문법의 jade보다는 훨씬 익숙하고 쉽게 view를 구성할 수 있다.
layout을 써서 hello 페이지를 만들었다.
// layout.html
<!doctype html>
<html>
<head>
    <meta charset='utf-8'>
    <title>${title}</title>
</head>
<body>
    <h1>${title}</h1>
    {{html body}}
</body>
</html>

// index.html
{{layout "layout"}}
<p>Hello</p>

이제 준비는 모두 끝났고, 잘 만들어보면 되겠다.
아! DB가 남았구나. MongoDB를 생각하고 있긴하지만 다른 더 좋은 것이 있다면 그걸 쓸 생각.

끄~~읕.

반응형