티스토리 뷰
지난 포스팅에서는 Node.js를 설치하고, npm으로 package.json으로 자신의 프로젝트를 만들 준비를 해보았습니다.
이번 포스팅에서는 Node.js에서 구동 가능한 http를 이용해 간단히 서버를 만들어보도록 하겠습니다.
서버 만들기
package.json이 있는 폴더에 app.js 파일을 새로 만들고, 아래 소스코드를 작성합니다.
app.js
//app.js
var http = require('http'); // 서버를 위한 http 모듈 가져오기
var server = http.createServer(function(request, response) { //server 변수에 서버를 생성, 매개변수는 콜백
response.writeHead(200, {"Content-Type" : "text/html"}); // 콜백의 response는 200 응답코드와 Content-Type을 html
response.end("Hello World"); //response의 내용으로는 Hello World로 설정하고, 전송
});
server.listen(8080, function() { //서버를 listen 상태로 대기시킴
console.log("Server is running on port 8080..."); //서버가 실행되면 로그가 실행
});
그리고 해당 폴더에서 cmd를 열어 node app.js라고 Node.js를 실행시켜주시면 app.js가 실행됩니다.
<app.js가 실행되어 콘솔에 Server is running on port 8080... 문구 출력됨>
<8080 포트로 localhost에 접속하여 서버에 접속한 모습>
require 라는 키워드가 쓰였는데, Node.js 에서 자주 쓰일 키워드 입니다. 모듈이나, 패키지, .js 파일을 가져와 사용할 때 쓰입니다.
Express
이번엔 Express라는 백엔드 프레임워크를 이용해 서버를 작성해보겠습니다.
Express는 "Node.js를 위한 빠르고 개방적인 간결한 웹 프레임워크" 입니다.
한마디로 백엔드 프레임워크의 일종이라고 생각하시면 됩니다.
Express를 설치하려면 cmd에서 npm install express --save 를 쓰면 됩니다.
npm 명령어로, install <패키지 이름> 은 패키지의 설치를 의미하고,
옵션 --save는 설치정보를 package.json에 자동으로 추가되게 해주는 옵션입니다. (배포 / 공유 시에 매우 편리합니다)
app.js
//app.js
var express = require('express'); // 서버를 위한 express 모듈 가져오기
var server = express(); // express 서버 정의
server.get("/", function(req, res, next) { // express 서버의 / (root 경로) 에 request가 들어오면,
res.send("Hello World"); // response로 "Hello World" 를 전송
});
server.listen(8080, function() { //서버를 listen 상태로 대기시킴
console.log("Server is running on port 8080..."); //서버가 실행되면 로그가 실행
});위에서 만들어 본 서버의 코드를 express를 사용한 코드로 변경만 하였기 때문에, 결과창에 대해서는 생략하도록 하겠습니다.
http 모듈에서는 사용하지 않았던 개념이 생겼는데, server.get("/", function(~~){})부분에서 "/" 는 서버의 root 경로를 의미합니다.
제 블로그로 따지면, t0dd-dev.tistory.com/ 을 의미하는 것이죠.
만약, "/hello" 라고 바꾼다면, t0dd-dev.tistory.com/hello 를 의미하는 것이구요.
이 개념을 라우팅이라고 합니다.
이번엔 문자열을 전송하여 페이지를 보여주지 말고, 이미 만들어진 .html 파일을 보여주도록 합시다.
.html 파일을 보여주려면 .html 파일이 있어야 하겠죠. 다음과 같이 작성합니다.
helloworld.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>hello</title>
</head>
<body>
world
</body>
</html>
app.js 도 다음과 같이 바꿔줍시다.
app.js
//app.js
var express = require('express'); // 서버를 위한 express 모듈 가져오기
var path = require('path'); // 상대 주소를 쉽게 다양한 운영체제에서 /와 ₩의 문제를 해결해주는 path 모듈 추가
var server = express(); // express 서버 정의
server.use(express.static(__dirname)); //server의 static 파일이 저장된 경로를 설정 (root 경로 => __dirname)
server.get("/", function(req, res, next) { // express 서버의 / (root 경로) 에 request가 들어오면,
res.send("Hello World"); // response로 "Hello World" 를 전송
});
server.get("/hello", function(req, res, next) { // express 서버의 /hello 에 request가 들어오면,
res.sendFile(path.join(__dirname, 'helloworld.html')); // response로 helloworld.html 를 전송
});
server.listen(8080, function() { //서버를 listen 상태로 대기시킴
console.log("Server is running on port 8080..."); //서버가 실행되면 로그가 실행
});
뭔가 추가 된게 많습니다.
/hello 라우팅을 이용해 helloworld.html 을 보여주고, helloworld.html 의 상대경로를 나타내기 위한 경로 모듈인 path 모듈이 추가되었습니다.
실행해보면 다음과 같습니다.
위와 같이 helloworld.html 페이지가 뜨게 됩니다.
이번 포스팅에서는 Node.js 로 다양한 방법으로 서버를 만들어보았고, 다음 포스팅에서는 socket.io를 활용한 간단한 채팅을 구현해보겠습니다.
'웹 개발' 카테고리의 다른 글
| [Node.js][3] socket.io를 이용한 간단한 채팅을 구현해보자 (1) | 2018.03.02 |
|---|---|
| [Node.js][1] Node.js과 npm에 대해서 알아보자 (0) | 2018.03.01 |
