Outsider's Dev Story

Stay Hungry. Stay Foolish. Don't Be Satisfied.
RetroTech 팟캐스트 44BITS 팟캐스트

Jade에서 함수 사용하기

node.js에서 express를 사용할 때는 뷰 템플릿 엔진으로 Jade를 주로 사용하는 편이다. 퍼블리셔가 함께 작업하는 협업프로젝트에서는 Jade를 사용하는 것이 약간 거추장스러울수도 있지만 혼자하는 토이프로젝트에서는 이만큼 편한 뷰 템플릿 엔진도 없다고 생각한다.

항상 쓰던대로만 쓰기에 큰 이슈가 없다가 어떤 값을 뷰 템플릿단에서 별도로 포매팅을 해주어야 할 필요가 생겼다. 이런 경우 서버에서 아예 포매팅을 해주어서 값을 전달하는 것도 방법이지만 비즈니스 로직과 프레젠테이션은 다른 영역이기 때문에 비즈니스 로직에서 전달하는 값은 좀 로우포맷으로 전달하고 프리젠테이션시에 변형하는 것이 더 좋다고 생각했다. 예를 들면 화면에 숫자를 출력하는데 천단위마다 콤마를 찍어주고 싶은 경우 비즈니스로직에서 값을 전달하면서 콤마를 찍어서 문자열로 전달하는 것보다는 숫자를 프리젠테이션단에서 콤마처리를 하는것이 맞다고 본다. 이런식으로 처리하려니 뷰템플릿엔진인 Jade에서 함수를 사용해야 했다. Jade에서는 믹스인은 제공하지만 함수를 사용하는 별도의 특수(?) 기능을 제공하지 않고 있지만 간단히 사용할 수 있다.

block content
  - var addPrefix = function(str) {
  -   return 'prefix : ' + str;
  - }
  p #{addPrefix('outsider')}

대쉬(-)를 사용하면 변수할당등에 코드를 사용할 수 있는데 여러 라인에 걸쳐서 사용할 수 있으므로 그냥 필요한 함수를 작성해 준 뒤에 값을 출력하는 부분에서 해당 함수를 자바스크립트를 쓰듯이 사용하면 된다. 위와 같이 작성한 경우 addPrefix라는 함수가 호출되어서 <p>태그안에는 prefix : outsider라는 문자열이 들어가게 된다. 뷰단에서 어떤 처리가 필요한 경우에는 이런 방식으로 자유롭게 함수를 작성해서 활용할 수 있다.
2013/05/09 01:41 2013/05/09 01:41