← 홈페이지 5강 목록으로
🚂
EPISODE 04
라우팅 · req/res · 미들웨어 · static

Express 기초

Node.js의 가장 인기 있는 웹 프레임워크 Express로 HTTP 서버 띄우기, 라우팅, req/res 객체, 미들웨어, 정적 파일 제공까지 한 번에 다룹니다.

Express라우팅미들웨어
소요 시간
45~60분
난이도
📊 중급
선수 조건
🎯 node-03
결과물
GET/POST를 처리하는 첫 HTTP 서버

이 강의에서 배우는 것

  • 1express()로 앱을 생성하고 listen으로 포트를 연다
  • 2GET/POST/PUT/DELETE 라우트를 등록한다
  • 3req.params/query/body, res.send/json을 사용한다
  • 4미들웨어 패턴(next 호출)을 이해한다
  • 5express.static으로 정적 파일을 제공한다

1. Express란

bash
npm install express
javascript
const express = require('express');
const app = express();

app.listen(3000, () => {
  console.log('서버: http://localhost:3000');
});

2. 라우팅

javascript
app.get('/', (req, res) => {
  res.send('홈페이지입니다.');
});

app.post('/users', (req, res) => {
  res.send('유저 생성');
});

app.put('/users/:id', (req, res) => {
  res.send(`유저 ${req.params.id} 수정`);
});

app.delete('/users/:id', (req, res) => {
  res.send(`유저 ${req.params.id} 삭제`);
});

3. req / res

req (Request)

javascript
req.params    // URL 파라미터: /users/:id → req.params.id
req.query     // 쿼리스트링: /search?q=hello → req.query.q
req.body      // 바디 (express.json() 필요)
req.headers   // 헤더
req.method    // 'GET', 'POST'
req.url       // 요청 URL

res (Response)

javascript
res.send('텍스트 응답');
res.json({ key: 'value' });
res.sendFile('/path/to/file.html');
res.redirect('/other-page');
res.status(404).send('Not Found');
res.render('index');             // EJS 등 템플릿

4. 미들웨어

요청과 응답 사이에서 실행되는 함수입니다.

javascript
// 모든 요청에 적용
app.use((req, res, next) => {
  console.log(`${req.method} ${req.url}`);
  next(); // 다음 미들웨어로 넘김
});

// JSON 바디 파서
app.use(express.json());

// URL 인코딩 (폼 데이터)
app.use(express.urlencoded({ extended: true }));

5. 정적 파일 제공

javascript
app.use(express.static('public'));

// http://localhost:3000/index.html → public/index.html
// http://localhost:3000/css/style.css → public/css/style.css

6. 포트 설정

javascript
const PORT = process.env.PORT || 3000;
app.listen(PORT, () => {
  console.log(`서버: http://localhost:${PORT}`);
});
예제 코드 / 강의 자료

전체 강의 자료와 예제 코드는 GitHub에서 자유롭게 받아볼 수 있습니다.

GitHub에서 보기 ↗