블로그 이미지
윤영식
Full Stacker, Application Architecter, KnowHow Dispenser and Bike Rider

Publication

06-21 23:37

Category

Recent Comment

2012. 12. 15. 14:17 NodeJS/Concept

EJS (Embedded JavaScript) 엔진은 자바쪽의 JSP 사용과 거의 유사하다고 보면 된다. 


  • 장점 : JSP 코딩처럼 쉽게 적응할 수 있다
  • 단점 : 프레임워크가 무거움 

> young.js : express를 사용할 것이고, 기본적으로 views 폴더 에 위치한다
var express = require('express');
var ejs = require('ejs');
var app = express();

app.get('/', function(req, res) {
res.format({
html: function() { res.send('<h1> hi dowon in html</h1>');},
json: function() { res.send({message: 'hi dowon in json'});},
text: function() { res.send('hi dowon in text');}
});
});

// response.send에서 response.render로 바뀌는 것 뿐이다 
app.get('/young/:id', function(req, res) {
res.render('young.ejs', {youngMessage: 'I am ' + req.params.id, layout: false});
});


> young.ejs : html 태그는 제외했음

<%= youngMessage %>


ejs 보다는 jade를 사용하자 

'NodeJS > Concept' 카테고리의 다른 글

[Node.js] 생태계에 대한 생각들  (0) 2012.12.23
[Jade] Jade 사용하기  (0) 2012.12.15
[EJS] 사용하기  (0) 2012.12.15
[Node.js] Global Objects  (0) 2012.12.10
[Node.js] File I/O 사용하기  (0) 2012.12.10
[Node.js] EventEmitter 에 대하여  (0) 2012.12.10
posted by peter yun 윤영식
TAG EJS
2012. 12. 10. 17:22 NodeJS/Concept

전역범위에서 참조가 가능한 글로벌 오브젝트. already defined object라고 할 수 있겠다. 



global objects 
> 하기 객체는 모든 모듈에서 이용할 수 있다. 실제 전역 범위를 가진다 
> node에서 var something의 something은 지역범위만 갖는다 
> global : {Object} 전역 네임스페이스 객체 
> process, console : {Object}
> Class: Buffer : {Function} 바이너리 데이터를 다루는데 사용 
> require() : 모듈 로딩으로 지역범위임
> __filename : {String} 실행되는 코드의 파일명 (코드의 절대경로 포함)
> __dirname : {String} 현재 실행되는 스크립트가 존재하는 디렉토리 경로 
> module : {Object} 현재 모듈에 대한 참조. 특히 module.exports는 exports 객체와 같다 
> exports : require()로 접근가능하게 된 모듈의 모든 인스턴스 사이에서 공유되는 객체다. 
> setTimeouts(cb, ms) : cb=callback, ms=milliseconds
  clearTimeout(t) : setTimeout()올 생성된 타이머를 멈춘다
> setInterval(cb, ms) : 반복적으로 callback 수행
  clearInterval(t)


>> fileName : globalTest.js

console.log(__filename);

console.log(__dirname);


>> 수행 

D:\Framework\Node.js> node globalTest

D:\Framework\Node.js\globalTest.js

D:\Framework\Node.js


'NodeJS > Concept' 카테고리의 다른 글

[Jade] Jade 사용하기  (0) 2012.12.15
[EJS] 사용하기  (0) 2012.12.15
[Node.js] Global Objects  (0) 2012.12.10
[Node.js] File I/O 사용하기  (0) 2012.12.10
[Node.js] EventEmitter 에 대하여  (0) 2012.12.10
[Node.js] debugger 사용하기  (0) 2012.12.10
posted by peter yun 윤영식
TAG node.js
2012. 12. 10. 16:35 NodeJS/Concept

node.js에서 File I/O 를 위하여 역시 모듈을 로딩하여 사용한다 



> require('fs') 포함 
> 비동기 방식은 마지막 파라미터로 완료 콜백함수를 받고, 첫 아규먼트로 에러를 받음. 성공이면 null 또는 undefined 가 된다 
> rename과 stat가 비동기 호출이므로 오류 발생가능성 존재 

fs.rename('/tmp/hello', '/tmp/world', function (err) {

  if (err) throw err;

  console.log('renamed complete');

});

fs.stat('/tmp/world', function (err, stats) {

  if (err) throw err;

  console.log('stats: ' + JSON.stringify(stats));

});

> 이를 해결하기 위하여 callback chain을 사용한다. 즉, callback안에 callback function을 둔다 

fs.rename('/tmp/hello', '/tmp/world', function (err) {

  if (err) throw err;

  fs.stat('/tmp/world', function (err, stats) {

    if (err) throw err;

    console.log('stats: ' + JSON.stringify(stats));

  });

});


-- 결과 내역 

stats: {"dev":0,"mode":33206,"nlink":1,"uid":0,"gid":0,"rdev":0,"ino":0,"size":1876992,"atime":"2012-09-17T18:05:45.000Z","mtime":"2012-09-17T18:05:48.000Z","ctime":"2012-09-17T18:05:41.000Z"}


'NodeJS > Concept' 카테고리의 다른 글

[EJS] 사용하기  (0) 2012.12.15
[Node.js] Global Objects  (0) 2012.12.10
[Node.js] File I/O 사용하기  (0) 2012.12.10
[Node.js] EventEmitter 에 대하여  (0) 2012.12.10
[Node.js] debugger 사용하기  (0) 2012.12.10
[Express] Express Framework 사용하기  (0) 2012.10.30
posted by peter yun 윤영식
2012. 12. 10. 16:08 NodeJS/Concept

EventEmitter는 말 그대로 이벤트를 발생시키는 모든 객체를 지칭한다. 서버에 접속(connect)할 때 이벤트가 발생하고 파일을 읽을 때 이벤트가 발생하는 식으로 이미 내장된 이벤트들이 존재할 것이고, 사용자 정의 이벤트를 만들 수도 있을 것이다. 



> require('events') 첨부한다 
> 이벤트를 발생시키는 모든 객체는 events.EventEmitter 의 인스턴스 
> 이벤트 발생할 때 실행할 함수를 객체에 연결, 이러한 함수를 리스너(Listener)라고 부른다 
> EventEmitter 접근 : require('events').EventEmitter
> emitter.on(event, listener) 또는 emitter.addListener(event, listener)
  예) server.on('connection', function(stream){...});
> emitter.once(event, listener) : 한번만 수행 즉, 일회성 listener 
> emitter.removeListener(event, lisetener) : listener 제거 
> emitter.removeAllListeners() : 모든 listener 제거 
> emitter.setMaxListeners(n) : listener등록이 10개 default로 제한, emitter의 listener 갯수를 늘릴 수 있다. 


'NodeJS > Concept' 카테고리의 다른 글

[EJS] 사용하기  (0) 2012.12.15
[Node.js] Global Objects  (0) 2012.12.10
[Node.js] File I/O 사용하기  (0) 2012.12.10
[Node.js] EventEmitter 에 대하여  (0) 2012.12.10
[Node.js] debugger 사용하기  (0) 2012.12.10
[Express] Express Framework 사용하기  (0) 2012.10.30
posted by peter yun 윤영식
2012. 12. 10. 15:42 NodeJS/Concept

node명령으로 자바스크립트 코드를 수행할 때 콘솔상에서 debugging을 할 수 있다. 


  • debugger 키워드를 코드에 끼워 넣는다 : breakpoint 역할을 한다 
  • cont, c : 계속 진행 
  • next, n : step next
  • step, s : step in
  • out,   o : step out
  • pause  : 실행 멈춤 
  • 상세명령들

> 예제 코드 (debuggerTest.js)
x = 5;
setTimeout(function () {
  debugger;
  console.log("world");
}, 1000);
console.log("hello");



> 디버깅 수행 : node debug <수행 자바스크립트 파일명>

D:\Framework\Node.js> node debug debuggerTest

< debugger listening on port 5858

connecting... ok

debug> cont

< hello

break in D:\Framework\Node.js\debuggerTest.js:3

  1 x = 5;

  2 setTimeout(function () {

  3   debugger;

  4   console.log("world");

  5 }, 1000);

debug> next

break in D:\Framework\Node.js\debuggerTest.js:4

  2 setTimeout(function () {

  3   debugger;

  4   console.log("world");

  5 }, 1000);

  6 console.log("hello");

debug> cont

< world

program terminated


hello을 찍고 debugger가 있는 곳에서 멈추면 next step으로 이동하면 console 객체로 가고 cont하면 수행을 다시 하여 world 문자가 찍힌다. 수행되는 process를 command line에서 추적해 보고자 할 경우 사용하면 좋겠다. 


'NodeJS > Concept' 카테고리의 다른 글

[EJS] 사용하기  (0) 2012.12.15
[Node.js] Global Objects  (0) 2012.12.10
[Node.js] File I/O 사용하기  (0) 2012.12.10
[Node.js] EventEmitter 에 대하여  (0) 2012.12.10
[Node.js] debugger 사용하기  (0) 2012.12.10
[Express] Express Framework 사용하기  (0) 2012.10.30
posted by peter yun 윤영식
2012. 12. 8. 15:16 NodeJS

Node.js 주말강좌 요약하기 


> 참조 : 라이언 일병(Ryan Dahl) 의 발표와 PPT자료 : Node.js 에 대한 문화적, 구조적 차이를 이해하자!

> 참조 : Node.js API 사용 (예제 포함)


  • 현재 System(I/O) : L2 Cache <-> Memory <-> Disk  대비 Network I/O = compiler 서비스
  • Web System : a = b() 식의 assign 즉 sync를 사용하지 않는다. b(a) {} 를 사용하자 (async 방식)
  • b(a) {} 구문에서 Node.js는 a = call back 객체이다 = anonymous object = closure object = 스트림에서 이해됨 
  • stream = functional의 목적은 네트워크에 있는 모듈을 Merge하여 사용하는 것이다 = social web service 세대 
  • Node.js는 모듈 기반이고 모듈을 위한 스펙 CommandJS와 AMD를 이해하자 
  • Node.js의 수많은 Modules in GitHub
  • Node.js에 대한 기본적이 이해


posted by peter yun 윤영식
TAG nodejs
2012. 12. 8. 11:18 NodeJS

이복영 강사님의 Node.jsMongoDB 주말강좌부분을 들으며 요약하기 




▶ 자바스크립트 
  • 에크마스크립트 : ECMAScript 6 로 가고 있다. 
  • 표준언어 : 자바스크립트 통일 = Presentation (Backbone.js or 앵귤러) + Application Tier(Node.js + Express.js) + Database(MongoDB + mongoos.js)


  • 자바스크립트를 크롬에서 간단히 테스트 해보기 : 크롬에서 F12에서 console 선택하여 자바스크립트 코드 넣고 Enter
  • 각 Tier별 MVC Fraemwork = Presentation (BackBone.js) + Appllcation(Express.js) + MongoDB(Mongoos.js)
  • MongoDB 와 함께 Redis를 사용 : 이때는 mongoose를 사용한다 
  • 윈도우에서 Node.js 개발시 : Microsoft제공 webmatrix tool로 개발 - MVC 코딩이 쉽다  



▶ Web 역사

  • Polling Service (Request + Response) = internet polling (ajax : client side), long polling (web api : server side)
    content delivery service (webserver 기술) = document base operation  -> Compile 기술
    • 제 1세 web : static web - IBM Host 기술 
    • 제 2세 web : dynamic web - C/S PC 기술
  • bi-direction Service (websocket) = data (json) delivery service = stream task operation( = functional operation) 
    -> Service 기술 (공식 전용 언어 : JavaScript -> ECMAScript 6)
    • 제 3세 web : social network web service - Smart Device 기술 (Virtual Host)


▶ 3 세대 Web
  • Task Base Operation = workflow (사람 + 정보 + 프로세스) -> Activity 단위 (스마트폰을 통해 구현되고 있다)
  • 객체 {key, value} 에서 key = property 이고 { {k,v}, {k,v} } 에서 {k,v} 를 attribute라고 한다. 이를 가지고 functional 프로그램을 한다 
  • Presentation 자바스크립트의 코딩 이동방향
    • getElementByID : javascript 직접 핸들링
    • jQuery : MVVM의 Knockout.js 사용, 물리적 뷰 사용
    • Undersocre.js (4kbytes) : functional 코딩, 논리적 뷰 사용, {k,v} 같은 그룹객체를 다룬다 (ORM) 
    • BackBone.js : 논리적 뷰 사용 (모바일 통해 다운로드 받는 세상)
  • Ria -> WebApp -> Smart UI (?)
  • Node.js와 MongoDB의 조상은 Underscore.js 이다
  • Functional Operation = Execution 밖에 없다. 크기는 4 Kbytes 이다. 
  • 1,2 세대의 기술과 3 세대 기술을 mix 하지 말고, 비교하지 말라


posted by peter yun 윤영식
2012. 11. 23. 16:28 NodeJS/Modules

prototype.js는 AJAX(Asynchronous JavaScript and XML)에서 거의 표준 라이브러리 처럼 사용하는 라이브러리이다. 사용법을 알아보자. 하기 코드는 prototype.js를 사용했을 때 JavaScript 클래스를 만들고 객체화 하는 과정을 보여준다 


var Employee = Class.create(); // Class를 이용하여 클래스 생성 Employee.prototype = { initialize : function( name ){ // prototype.js 사용시 생성자는 initialize로 정의 this.name = name } }; var Dev = Class.create(); Dev.prototype = Object.extend( // Class 상속 extend 이용 new Employee, // 상속받을 Class 선언 { showMember : function() { var list = new Array( '홍길동', '고길동', '김길동' ); document.writeln( '<div id="표시영역">' + this.name + '★사원 명단:' + list + '</div>' ); } } ); var dev = new Dev( '개발부' );

dev.showMember();


<참조>

  - 공식 사이트 :  http://prototypejs.org (버전 1.7.1)

  - 클래스 생성, 상속, Ajax 통신, JSON(JavaScript Object Notation) 사용 튜토리얼 :  http://prototypejs.org/learn/

  - prototype.js 정의 보기 :  https://ajax.googleapis.com/ajax/libs/prototype/1.7.0.0/prototype.js 

  - ExtJS를 하기 전 참조지만 JavaScript 하기전 기본지식과 Aptana+Spket 개발환경 설정하기 : http://techbug.tistory.com/1

  - 애니메이션과 Drag에 좋은 라이브러리 :  http://madrobby.github.com/scriptaculous



posted by peter yun 윤영식
2012. 10. 30. 21:52 NodeJS/Concept


Node.js를 위한 Web Framework으로 Express 를 사용한다. GitHub에도 상당한 순위에 올라와 있고, rail 방식과 유사하다. Connect 모듈을 기반으로 템플릿은 EJS와 Jade를 기반으로 하고 있다. 



▶ Express 설치하기  (http://expressjs.com/guide.html)

  • npm (Node Package Manager)을 이용하여 설치해 보자 (-g 옵션은 nodejs 설치 전체에 적용된다. -g 옵션을 안 주면 설치 디렉토리내애서만 영향을 미친다)

    설치가 완료되면 nodejs가 global 참조영역인 Application Data/npm/node_modules/express 라고 설치가 된다


  • express 명령으로 HelloExpress라고 만들어 보자. 그러면 기본적인 Web Application 골격이 생긴다. (WAS의 Context war 파일 생성되는 것으로 비유하면 되겠다. 예로
    > routes/*.js 파일은 web.xml의 url-mapping 설정과 유사하다
    > views/*.js 는 템플릿 엔진의 파일들이 위치한다 (ejs 또는 jade를 사용한다. ejs는 JSP 코딩과 유사하여 친숙하고, jade는 간결함이 좋다)
    > public/* 퍼블리싱 하는 static 파일들
    > app.js Express의 main 파일이다


  • HelloExpress 디렉토리로 이동하여 express가 의존관계에 있는 외부 modules를 설치한다


  • 설치가 완료된 후 node app 로 Express 프레임워크를 수행한다 (http server listening 이 포함되어 있음)



  • app.js 코드를 보자 

    > 외부모듈 express를 얻어와서 app변수에 정적 서버환경을 셋팅하고 있다.(default jade 템플릿 셋팅)
    > URL의 호출에 대한 맵핑을 담당하는 rounting 설정을 한다 
    > 맨 마지막줄에 http server 를 시작한다 

  • http://localhost:3000/dowon 이라는 url 셋팅을 해본다. 우선 app.js 에 routing 정보를 넣는다

  • HelloExpress/routes/user.js 안에 exports.dowon 을 추가한다 



  • HelloExpress/app.js 서버를 재시작 하고, 브라우져에서 호출한다.  



▶ Node를 위한 Jade Template 사용하여 표현하기

  • routing하기 위하여 user.js에 하드 코딩된 html 코드를 jade 템플릿으로 서비스하는 방법을 알아보자. 우선 views 디렉토리에 dowon.jade 파일을 만든다 (jade는 템플릿 엔진이다)



  • dowon.jade 템플릿 코딩을 한다 (자세한 사항은 http://jade-lang.com 사이트를 참조하자)

  • routes/index.js 안에 정보를 넣으면 app.js 안에서 routes.dowon으로 호출을 할 수 있다


  • routes/index.js 파일안에 설정한 index, dowon은 app.js 에서 routes.index 와 routes.dowon 으로 호출한다 


  • 재시작하고 브라우져에서 https://localhost:3000/dowon2 로 호출하면 jade 내역이 html로 변환되어 서비스 된다




    간단하게 Express Framework을 Node.js에 얻져서 사용하는 방법을 보았다. 사용하며 느낀것은 서비스를 위한 앞단의 url-mapping과 유사한 route 개념은 새롭게 개발할 필요없이 적용할 수 있어서 좋다. 그러나 domain 모델쪽의 개발과 persistence 영역의 개발에 대한 부분이 Express에 있는지 없다면 어떤 외부 module을 통하여 Express와 통합을 해야하는지  찾아 보아야 겠다. 

    * jade 설치 및 사용법 : http://blog.doortts.com/223


'NodeJS > Concept' 카테고리의 다른 글

[EJS] 사용하기  (0) 2012.12.15
[Node.js] Global Objects  (0) 2012.12.10
[Node.js] File I/O 사용하기  (0) 2012.12.10
[Node.js] EventEmitter 에 대하여  (0) 2012.12.10
[Node.js] debugger 사용하기  (0) 2012.12.10
[Express] Express Framework 사용하기  (0) 2012.10.30
posted by peter yun 윤영식
2012. 10. 30. 19:24 NodeJS/Modules



CoffeeScript는 Javascript 코드를 단축시키고 가독성을 높이며 {}와 ; 가 있는 코드로 부터 해방시켜준다. 실제 CoffeeScript 코드를 보았을 때 마치 영어 산문을 보는듯 했다. 만일 마틴파울러 아저씨가 이야기하는 Clean Code Style을 지향한다면 정말 영어 산문을 쓰는듯 코딩을 하면 된다. 


1) CoffeeScript 코드 짜고 JavaScript와 비교하기 

  - http://coffeescript.org/#top 로 들어가서 "TRY COFFESCRIPT" 상단 메뉴를 선택한다. 브라우저에서 coffeescript 코드를 치면 바로 javascript코드로 확인할 수 있다.


  - 그렇다면 이런 coffeescript 코드를 어떻게 배울 수 있을까? 구글에서 "smooth coffeescript"를 검색하고 interactive... 을 선택한다

  
HTML5 화면으로 웹상에서 CoffeeScript를 익히면서 학습을 할 수 있는 사이트이다. Edit 박스의 코드를 수정하면 하단의 결과값이 자동 변경되어 출력된다. 
CoffeeScript 디버깅툴이 내장된 상용툴을 사용해 보자 (http://www.jetbrains.com/webstorm/)


<국내 레퍼런스> 

  - coffeescript 개념부터 잘 정리된 사이트 : http://aroundck.tistory.com/958

posted by peter yun 윤영식
2012. 10. 30. 16:29 NodeJS

Node.js 를 배우기 위해서 Sublime Text 를 설치하고 Node를 설치하는 과정을 보자 



▶ Sublime Text에 Node 연동하기 

  • sublimet text를 설치하고 install package control을 설치했다면 ctrl+shift+p를 누르고 "install package" 입력후 Enter
  • 다음에 node라고 입력을 하면 node관련 패키지 3개가 나온다 각각 설치한다

  •  Node.js 엔진 설치를 위하여 http://nodejs.org/ 사이트 중앙에 있는 [Install]을 클릭하면 설치본이 다운로드 된다. 안내에 따라 설치를 하게되면 System Path에 자동으로 <NODE_HOME>/bin 디렉토리가 잡힌다
    기타 공식 설치 사이트 : https://github.com/joyent/node/wiki/Installation

  • node 문법으로 간단하게 java의 System.out.println과 같은 console.log를 타입핑후 hi.js 명칭으로 저장하고, ctrl + B 키를 누르면 Automatic Build가 된다. Tools -> Build System -> Automatic 이 체크되어 있다면 Syntax를 자동인지하여 Nodejs로 빌드하여 결과를 출력한다

TextMate만큼 막강한 Sublime Text를 통한 Node.js 개발 환경 구축이 완료되었다. 


* 참조 : Sumlime Text 2 설치 및 환경설정



▶ Nodejs 기본 파악하기 


> Nodejs 의 기본 명령 앞에 dot 를 붙인다. 



> 읽어 볼 만한 블로깅 글을 Link만 열거 한다. 

     Beginner Book :  ManuelKiessling-NodeBeginnerBook.zip


posted by peter yun 윤영식
TAG nodejs
prev 1 2 next