Will find a way

[NodeJS/Express] Express에 대해서 본문

BackEnd/Express

[NodeJS/Express] Express에 대해서

Jaka_Park 2024. 6. 29. 13:00

목차

1. Express란?

2. Express 설치

3. Express 사용

 

1. Express란?

NodeJs의 프레임워크로써 http net으로 구현 가능한 네트워크 TCP를 모던한

느낌으로 외장모듈로 라이브러리를 구현한것이다.

NodeJs로만 사용하여 라우팅을 처리하려면 상당히 번거로운 작업을 해야했다.

Express를 사용하면 HTTP 모듈 기능 외에도 다양한 기능이 포함되어 있어서 유용하게 쓸 수 있다

 

1) 라우팅

HTTP 모듈을 사용할 때는 if 문이나 switch 문으로 요청 메서드나 요청 URL에 따라 라우팅 해야했다.

 

2) 미들웨어

Express에는 미들웨어라는 개념이 있어서 요청과 응답 사이에서 여러가지 기능을 실행할 수 있다.

(미들웨어가 많아서 가져와서 사용이 가능)

 

3) 템플릿 엔진

HTML 페이지는 기본적으로 정적이지만 서버와 함께 사용해서 동적인 HTML 페이지를 만들 수 있다.

(애플리케이션에셔 View를 담당)

 

4) 정적인 파일 지원

Express에서 동적인 파일만 생성하는 것은 아니다. CSS, JS, 이미지처럼 동적인 파일을 쉽게 서비스 할 수 있음

 

 

2. Express 설치

npm init -y

 

package.json 초기화를 해준다.

 

npm i expresss

 

Express의 최신 버전이 설치된다.

(협업할 때  팀원들 간의 express의 버전이 같지 않을 경우 호환성 문제 발생할 수 있어서 같은 버전을 사용해야한다.

package-lock.json 실제 버전 설치된 내용의 json 파일이 있으면 버전이 문제가 없다.)

 

3. Express 사용

// 외장 라이브러리
const express = require('express');

// 서버 객체 생성
const app = express();

 

app에는 express()의 리턴값이 들어가 있다.

express() 리턴값으로는 Application이라는 객체를 반환하는데, Application이라는 객체는 여러 메서드를 가지고 있다.

그 중 하나가 대표적으로 get, post 가 있다.

// 미들웨어
// express.json body의 내용을 파싱해서 객체로 변환
app.use(express.json());

// 쿼리스트링 파싱, form의 내용을 파싱
// 깊은 객체까지 사용 여부
app.use(express.urlencoded({ extended : true }));

 

미들웨어 : 요청을 보내고 응답을 하기 전에 처리할 내용

// 메서드로 라우팅
// get, post, put, delete

app.get('/', (req, res) => {
  console.log(req.query)
  // req.query : 쿼리스트링 객체로 파싱
  
  console.log(req.body);
  // req.body : 전달한 본문의 내용을 body에 객체 파싱
  
  res.send(`
  <html>
        <title>응답 페이지</title>
        <body>
            <form method="post" action="/postContent">
             <input type="text" name="test2">
             <button>확인</button>
            </form>
        </body>
    </html>
  `)
  // 응답 메시지 응답 종료
});

app.post('/postContent', (req, res) => {
  console.log(req.body);
  
  //redirect : 해당 경로로 다시 요청을 보냄
  res.redirect('/');
});

app.listen(3000, () => {
  console.log('서버 대기 상태');
})

'BackEnd > Express' 카테고리의 다른 글

CORS (Cross-Origin Resource Sharing)에 대해서  (0) 2025.02.24
[Express] Express로 하는 MVC 패턴 예제 (feat. MongoDB)  (0) 2025.02.23
'BackEnd/Express' Related Articles more