데브코스

[3주차 - DAY5] Express.js 기반의 웹 서버 구축 및 응용(2)

미안하다 강림이 좀 늦었다 2024. 3. 15. 13:17

 

 

Express.js

http와 Connect 컴포넌트를 기반으로 하는 웹 프레임워크다. express.js를 사용하면 http 모듈로 서버를 구축하는 것보다 더 간결하게 서버를 구축할 수 있다.

설치

터미널에서 아래 명령어를 입력한다.

npm i express

 

실습

서버를 가동하고, 로컬호스트 포트 번호 3000번으로 접속하면 Hello World가 화면에 표시되는 것을 확인할 수 있다.

const express = require('express');
const app = express();

app.get('/', function (req, res) {
    res.send('Hello World');
})

app.listen(3000);

 

URL 파라미터

url에 포함된 변수를 추출할 수도 있다. 저번에 예시로 들었던 쇼핑몰 사이트의 상품 개별 페이와 관련된 API가 /products/(id)였다. 이 id를 추출해 보자.

req.params는 { id: 1234 }처럼 객체이다. 파라미터가 여러 개 있으면 { id: 1234, name: 'abcd', code: "DEV" } 이런 식이다. req.params.키_이름으로 원하는 값을 추출할 수 있다.

const express = require('express');
const app = express();

app.get('/products/:id', function (req, res) {
    const id = req.params.id; // const { id } = req.params; 로 써도 동일
    res.send(`상품의 ID: ${id}`);
})

app.listen(3000);

 

 

JSON

실습 코드에서 res.send()를 두 번 사용하면 첫 번째 res.send()의 내용만 화면에 표시되고, 서버가 강제 종료되지는 않지만 서버의 터미널에 에러 메시지가 와장창 뜬다. 두 개 이상의 내용을 표시하려면 JSON을 사용해야 한다.

 

정의

JSON(JavaScript Object Notation)은 자바스크립트 객체의 형태이다. 중괄호 안에 키-값 쌍으로 적으면 된다.

const book = {
    title: "어젯밤 내 스택이 무너졌어",
    price: 15900,
    description: "내 목숨 어쩌고"
};

 

실습

'/books'에 접속했을 때 위에서 만든 객체를 응답으로 보내줘 보자. 사실 res.json 말고 res.send 써도 결과는 똑같다.

const express = require('express');
const app = express();

const book = {
    title: "어젯밤 내 스택이 무너졌어",
    price: 15900,
    description: "내 목숨 어쩌고"
};

app.get('/books', function (req, res) {
    res.json(book);
})

app.listen(3000);