[5주차] Express.js

2월 18일 자 학습 내용 정리입니다.

 

 

✅ Express.js

Node.js에는 다양한 웹 프레임워크가 있다.

• Express.js : Node.js의 가장 유명한 웹 프레임워크
• Koa.js : 현대 JavaScript를 적극적으로 사용하는 웹 프레임워크
• Nest.js : TypeScript를 사용하며 고정된 구조를 제공하는 웹 프레임워크

이외에도 Hapi, Sails.js, Meteor.js 등이 존재한다. 

 

Express.js는 Node.js의 가장 유명한 웹 프레임워크로 필요에따라 유연하게 구조를 설정할 수 있으며 다양한 미들웨어를 통해 필요한 기능을 간단하게 추가할 수 있다.
모든 동작이 명시적으로 구성되기 때문에 웹 프레임워크의 동작 방식을 이해하기 가장 좋은 프레임워크이다.

 

✔️ Express.js의 구조

Express.js의 기본 구조는 다음 사진과 같이 project 아래 app.js, package.json, public, router, views, bin/www가 존재한다.

 

 

• app.js : Express.js의 가장 기본이 되는 파일으로 웹 어플리케이션의 기능을 정의한다.
• bin/www : Express.js의 실행 부분을 담당하며 포트와 실행 오류 등을 정의한다.
• package.json : 프로젝트 의존성 및 스크립트를 정의한다.
• public : 코드를 통하지 않고 직접 제공되는 파일 디렉터리이다.
• routes : 라우팅 파일 디렉터리이다.
• views : HTML Template 디렉터리이다.

 

 

✅ Express.js 동작 방식 - app

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

app.get('/', (req, res) => {
    res.send('Hello');
});

app.listen(3000, () => {
    console.log('Server is running...');
});

 

app.js에서는 express()로 생성되는 app 객체를 확인할 수 있다.
app 객체는 Express.js의 기능을 담은 객체로 Express.js의 모든 동작은 app 객체에 정의된다.

 

• app.use() : middleware를 사용하기 위한 함수이다.
• app.listen() : http 서버를 생성해 주는 함수이다.
• app.locals : app에서 사용할 공통 상수이다. Express.js에서는 global 변수를 선언하지 않고 이 값을 사용할 수 있다.

 

 

✅ Express.js 동작 방식 - routing

Express.js는 다양한 라우팅 방식을 제공하는데 이는 크게 app 라우팅과 Express.Router를 통한 라우팅으로 나뉜다.

 

✔️ app routing

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

app.get('/', (req, res) => {
    res.send('GET /');
});
app.post('/', (req, res) => {
    res.send('POST /');
});
app.put('/', (req, res) => {
    res.send('PUT /');
});
app.delete('/', (req, res) => {
    res.send('DELETE /');
});
app.all('/all', (req, res) => {
    res.send('ANY /');
});

 

app routing은 app 객체에 직접 get, post, put, delete 함수를 사용해 HTTP method로 라우팅하는 것이다.
첫 번째 인자가 라우팅을 실행할 URL이며 마지막 인자는 라우팅이 실행될 때 작동하는 함수이다.
all을 사용하면 HTTP method에 상관없이 라우팅이 가능하다.

 

✔️ Express.Router

const express = require('express');
const router = express.Router();

router.get('/', (req, res, next) => {
    res.send('respond with a resource');
});

module.exports = router;

 

Express.Router는 Express.js의 Router 객체를 사용하며 app 객체처럼 get, post, put, delete 함수를 사용한다.
app 객체는 그룹화를 지원하지 않지만 Express.Router를 사용하면 라우팅을 모듈화 할 수 있다.
함수는 app 객체와 동일하게 라우팅을 실행할 URL과 라우팅이 실행될 때 작동할 함수로 이루어진다.
이때 라우터는 일반적으로 모듈로 만들어 사용한다.

 

// --- ./app.js
const userRouter = require('./routes/users');
const app = express();

app.use('/users', userRouter);

// --- ./routes/users.js
const petRouter = require('./pets');
const router = express.Router();

router.use('/pets', petRouter);

module.exports = router;

 

이렇게 작성된 라우터 모듈은 app에 use 함수로 연결해 사용할 수 있으며 router 객체에도 하위 라우터를 use함수로 연결해 사용할 수 있다.

 

✔️ Request Handler

이때 router나 app의 HTTP method 함수의 가장 마지막 인자로 전달되는 함수를 Request Handler라고 한다.
설정된 라우팅 경로에 해당하는 요청이 들어오면 Request Handler 함수가 실행되며 요청을 확인하고 응답을 보내는 역할을 한다.

 

Request Handler에는 Request 객체(req)와 Response 객체(res)가 존재한다.

 

router.get('/:id', (req, res) => {
    const id = req.params.id;
    res.send(`hello ${id}`);
});

 

Request 객체는 HTTP 요청 정보를 가진 객체로 HTTP 요청의 path parameter, query parameter, body, header 등을 확인할 수 있다.

 

req.params	path parameter의 값을  req.params.path_parameter로 사용할 수 있다. 예를 들어 url이 /path/:id 라면 :id의 값을 req.params.id로 사용할 수 있다.
req.queries	query parameter의 값을 req.quries.query_parameter로 사용할 수 있다. URL 중 ? 뒤에 붙는 값을 query parameter라고 한다. 예를 들어 url이 /path?page=2라면 page 부분을 req.queries.page로 사용할 수 있다.
req.body	일반적으로 POST 요청의 요청 데이터를 담고 있다. req.body로 요청 데이터에 접근할 수 있다.
req.get('')	HTTP 요청의 헤더값을 가지고 올 수 있다. req.get('Authorization')와 같이 사용한다.

 

Response 객체는 HTTP 응답을 처리하는 객체로 HTTP 응답의 데이터를 전송하거나 응답 상태 및 헤더를 설정할 수 있다.

 

res.send()	text 형식의 HTTP 응답을 전송한다.
res.json()	json 형식의 HTTP 응답을 전송한다.
res.render()	HTML Template을 사용하여 화면을 전송한다.
res.set()	HTTP 응답의 헤더를 설정한다.
res.status()	HTTP 응답의 상태값을 설정한다.

 

✔️ path parameter

Express.js 라우팅은 path parameter를 제공한다.
path parameter를 사용하면 주소의 일부를 변수처럼 사용할 수 있다.
URL에 /:변수 등으로 사용할 수 있는데 예를 들어 /users/:id와 같이 사용하면 /users/123 , /users/456 등으로 접속했을 때 해당 라우팅이 적용된다.