node.js 에서 express 사용하기

 

이번에도 npm을 통해서 node.js에서 자주 사용하는 패키지 모듈을 설치해보고 사용해보는 예제를 테스트 해볼까 합니다.

 

웹프레임워크를 담당하는 express를 설치해보도록 합니다.

 

 

 

1. express 란?

 

기본적으로 node.js에서 웹 브라우저를 띄운다면 http를 통해서 웹 화면을 구성했습니다.

하지만, 사용할 수 있는 기능이 단순하다보니 전문적인 웹 환경을 구성하기엔 부족한 부분이 많이 있습니다.

 

http 예제 코드를 보면 js 파일 내에 화면을 직접 구현해야 합니다.

그렇다면 기존에 이미 만들어진 html 기반의 화면을 통채로 불러올 순 없을까요?

 

node.js를 사용하는 서버 프로그램 따로 UI를 담당하는 웹 화면을 구성해서 따로 작업하는게 효율성을 따져봐도 좋을 거 같습니다. 이렇게 MVC 모델로 구성을 하게 되는데 이런 것을 직접 구현하기 보다는 만들어진 모듈이 있다면 편할 겁니다.

 

node.js 에서는 이러한 웹프레임워크로 express를 많이 사용하는 편입니다.

 

 

2. express 설치

 

먼저 express 홈페이지에 접속하면 기본적인 설명과 샘플을 볼 수 있습니다.

 

홈페이지 : http://expressjs.com/

 

아래 그림은 첫 페이지 화면입니다.

 

 

여기서 중요한 건 작게 보이는 3.0.0입니다.

node.js 가 아직 개발 중인 단계로 모듈들 또한 자주 업데이트가 됩니다.

 

그래서 express를 자료를 검색해서 예제를 해보다보면 안되는 경우가 많이 있습니다.

express가 3.0.0 으로 업데이트 되면서 과거 버전과 사용법이 약간 달라져서 인터넷에서 검색된 결과대로 해도 안될 수 있습니다.

이 문서 또한 나중에 express 가 버전업 되면 사용법이 달라질 수 있습니다.

 

 

우선 설치를 하려면 npm을 사용하면 됩니다.

 

지난번과 같이 윈도우 환경에서 작업을 했으며, C 드라이브에 nodejs 라는 폴더를 만든 후에 작업을 진행하였습니다.

 

아래와 같이 명령을 입력합니다.

 

c:\nodejs>npm install express

 

아래 그림과 같이 npm 패키지를 관리하는 곳에서 express 정보를 가지고 파일을 다운로드 하게 됩니다.

 

 

 

3. 테스트 프로그램 작성

 

node.js에서 html 코드를 직접 작성하지 않고, 미리 만들어진 html 의 정보를 그대로 가져와서 출력해보도록 하겠습니다.

html 파일의 이름은 express.html입니다.

 

테스트를 위해서 express.js 파일을 만들었습니다.

 

var express     = require('express'),
    app         = express();

app.get('/', function(req, res) {
    res.sendfile(__dirname + '/express.html');
});
    
app.listen(3000);

 

위와 같이 express.js 파일을 만든 후, 실행을 해보도록 합니다.

 

c:\nodejs>node express.js

 

그 다음 웹 브라우저를 통해서 http://localhost:3000 으로 접속합니다.

js 파일에 내용을 입력하지 않고 html파일을 읽어드려서 화면에 출력하였습니다.

 

 

 

~(-_ - ~)

 

지금은 단일 파일을 읽어왔지만, express 설정을 통해서 폴더 전체를 읽어올 수 있습니다.

즉, node.js 와 별개로 만든 html 파일을 그대로 읽어올 수 있습니다.

html 파일 내용 및 이미지를 node.js에서 매번 등록해주는 관리해줘야하는 필요없이 html 파일 내용만으로 화면을 볼 수 있습니다.

 

다음 주에는 express 옵션을 통해서 전체 폴더를 읽어보도록 하겠습니다.