Express로 JSON, Params 다루기
오늘은 http를 내장 모듈로 하는 express로 rest api 실습을 진행했어요.
추가로 JSON과 Params를 활용해 데이터를 전달하는 방법도 실습해 볼게요
📖 Express란?
"Node.js를 위한 웹 프레임워크"
기존 http 모듈로도 서버를 만들 수 있지만, Express를 사용하면 웹 애플리케이션과 API를 훨씬 쉽고 빠르게 만들 수 있어요.
외부 모듈이기 때문에 npm으로 설치가 필요해요. 터미널에 다음 명령어를 입력해주세요.
npm i express📄 http 모듈 vs Express 모듈 비교
그럼 기존 방식과 어떻게 다른지 코드로 비교해볼까요?
1. Express를 사용한 코드
const express = require('express')
const app = express()
app.get('/', function (req, res) {
res.send('Hello World')
})
app.listen(3000)2. 기존 http 모듈 코드
let http = require("http");
function onRequest(request, response) {
response.writeHead(200, { "Content-Type": "text/html" });
response.write("Hello Node.js");
response.end();
}
http.createServer(onRequest).listen(8888);둘 다 require로 모듈을 불러오고 listen으로 포트를 열어주는 건 같지만, Express 쪽이 코드가 훨씬 직관적이고 간결해요?
Express 코드 뜯어보기
app.get(...): HTTP Method 중 GET 요청을 처리하는 함수에요.post,put,delete등도 똑같은 방식으로 사용할 수 있어요.'/': 첫 번째 인수는 URL을 의미해요.req,res: 콜백 함수의 인수로, 각각 요청(Request)과 응답(Response)을 담당해요.res.send(): 데이터를 화면에 보내주는 역할을 해요.
📖 JSON (JavaScript Object Notation)
데이터를 전송할 때 res.send()를 여러 번 쓰면 어떻게 될까요?
app.get("/products/1", function (req, res) {
res.send('Node.js를 공부해보자');
res.send(20000);
});
// 'Node.js를 공부해보자위처럼 코드를 짜면 제목과 가격이 둘 다 나올 것 같지만, 실제로는 첫 번째 send만 처리되고 뒤는 무시돼요.
그래서 우리는 여러 데이터를 한 번에 묶어서 보내기 위해 JSON을 사용해야 해요.
JSON은 자바스크립트 객체 문법으로 데이터를 표현하는 문자 기반의 표준 포맷이에요.
{
title : 'Node.js를 배워보자',
price : 20000,
description : '이 책을 통해 Node.js를 쉽게 이해해보자'
}이렇게 Key(키) : Value(값) 쌍으로 이루어져 있어요.
값에는 수, 문자열, 불리언, 배열, 객체, null 등이 들어갈 수 있어요
📄 JSON 실습
Express에서는 res.json() 함수를 사용해 객체를 보낼 수 있어요.
const express = require("express");
const app = express();
// 보낼 데이터 객체를 생성
let nodejsBook = {
title: "Node.js를 공부해보자",
price: 20000,
description: "이 책 좋음 왜? 김송아가 지음",
};
app.get("/products/1", function (req, res) {
res.json(nodejsBook); // JSON 형태로 전송
});
app.listen(3000);
// {"title": "Node.js를 공부해보자", "price": 20000, "이 책 좋음 왜? 김송아가 지음"}
📄 Params로 동적 URL 처리하기
쇼핑몰에 상품이 100개라면 /products/1, /products/2 ... 이렇게 라우터를 100개 만들려면 매우 힘들 것이에요
http 모듈에서는 쿼리 스트링(?id=1)을 썼지만, Express에서는 Params를 사용하면 아주 깔끔하게 해결돼요.
주소 뒤에 /:변수명을 적어주고, req.params.변수명으로 꺼내 쓰면 됩니다.
const express = require("express");
const app = express();
app.listen(3000);
// :n 자리에 들어오는 값을 n이라는 변수로 받겠다는 뜻
app.get("/products/:n", function (req, res) {
res.json({
num: req.params.n, // params로 받은 값을 그대로 json으로 돌려주기
});
});