npm express, EJS 사용하기

express는 node.js에서 가장 유명한 웹 프레임워크 모듈이다.

뭐 유명하다고 하니 사이트 접속       (한글로 번역한 사이트라고 함)

(사이트가 심플하면서 상당히 멋있음)

우측 상단에 github가 있는데 궁금하신분들은 들어가봐도 좋을 것 같음

(https://github.com/strongloop/express)

그렇다면 설치를 해보자.

npm을 이용해서 설치를 할건데 npm이 모르시다면

(http://kkn1220.tistory.com/45)참고

$npm install express        

express를 활용한 js만들기

파일이름: hello_express.js

var express = require('express')        //express 모듈 사용

  , http = require('http')                //http 모듈 사용

  , hello_express = express()         //EXPRESS 함수를 실행하여 hello_express 객체 생성

  , server = http.createServer(hello_express);        //hello_express와 http server connect    

hello_express.get('/', function (request, response) {    // get으로 function 요청

  response.send('Hello');            //127.0.0.0.1:8000/ 했을 때 나오는 메시지    //응답받음

});                                 //현재 ip를 넣어도 된다. 

hello_express.get('/hello.express', function (request, response) {

  response.send('Hello Express');        //127.0.0.1:8000/hello.express 했을 때 나오는 메시지

});

server.listen(8000, function() {

  console.log('Server running at ' + server.address().port);

});

$node hello_express.js

웹 페이지 확인

HTTP 요청 메소드 GET, POST, PUT, DELETE 등 간단하게 구현 가능

express에서 템플릿을 사용하면 기존 jsp 서버처럼 HTML을 동적으로 생성할 수 있다.

EJS(Embedded javascript)

- 자바스크립트로 동적인 웹페이지 생성을 도와준다.

Express JS 자동 생성 툴 활용

$sudo npm install -g express-generator        //전역 설치로 해야된다.

<테스트폴더>$express --ejs        //--ejs 옵션으로 뼈대 생성

<테스트폴더>$npm install          //package.js에 정의된 모듈 설치

설치된 화면의 모습이다.

$node /bin/www

웹페이지 접속(ip:3000)

$vi www 의 일부 모습

/**

 * Get port from environment and store in Express.

 */

var port = normalizePort(process.env.PORT || '3000');        //포트번호

app.set('port', port);

위의 페이지를 변경하고 싶으면

$vi /views/index.ejs

위의 페이지에서 원하는대로 수정하면 된다.

<% %> 태그 안에 자바스크립트 사용 가능

즉 <%= 변수 %> 사용 가능

위의 title의 경우 Express라는 말이 어디 나와있지??

$vi ../routes/index.js

res.render('index', {title: 'Express' }); 확인 가능