9/29[TIL]Refactor Express

기존에 node.js 모듈로 작성했던 http 서버를 express 모듈로 리팩토링 하는 것을 진행했다.

express.js는 node.js를

리팩토링을 하기에 앞서 설정을 해주어야 할 것들이 있었는데

$ git branch express

$ git branch

$ npm install body-parser --save

$ npm install cors --save

cors 모듈을 다운로드해준다.

 

여기서 미들웨어란? 사전적인 의미로는 운영체제와 응용소프트웨어의 중간에서 조정과 중개의 역할을 수행하는 소프트웨어로 응용소프트웨어가 운영체제로부터 제공받는 서비스 이외에 추가적으로 이용할 수 있는 서비스를 제공하는 컴퓨터 소프트웨어이다.

 

우리가 이번에 사용하게 될 express에서는 미들웨어의 역할이

1. POST 요청 등에서 쓰이는 body(payload)를 쉽게 얻어내고자 할 때(body-parser 미들웨어)
2. 모든 요청/응답에 CORS 헤더를 붙일 때(cors 미들웨어)

이 두 가지 부분에 사용될 것이다. 그렇게 작성한 express를 통한 리팩토링...

const express = require("express");//express 모듈 불러오기 
const app = express();//app 에 express(웹서버모듈) 모듈 사용
const cors = require("cors");//cors 모듈 사용
app.use(express.urlencoded({ extended: false }));//미들웨어 설정body-parser
app.use(express.json());//미들웨어 설정
app.use(cors());//prefilght설정(cors)
 
let messages = [];
 
app.get("/messages", (req, res) => {
    res.json({ text: "hello world", results: messages });
})
app.post("/messages", (req, res) => {
    const { username, text } = req.body;
    res.statusCode = 201;
    res.json(req.body);
    messages.push(req.body);
})
app.listen(3000, () => { //http://localhost:3000/messages
    //console.log("port3000");
});
 
module.exports = app;

리팩토링 후 새로웠던 점은 app 명령어를 사용한다는 것이다.

app.use로 순차적인 미들웨어 시작...(사용할 미들웨어를 넣어주는 것)

app.get / app.post / app.listen

해당 부분의 코드 실행 시 바로 실행되는 것이 아니라, app.get 부분은 서버에 get요청이 있는 경우(app.post도 동일),  app.listen은 서버가 실행되는 경우에 각각 실행이 됩니다. 이렇게 어떠한 조건이 갖춰지면 실행되는 코드를 가지는 함수를 event listener(이벤트 리스너)라고 한다.

 

이 스프린트를 진행하고 나서 느낀 점은 이전에 작성했던 node.js코드 보다 express 코드가 훨씬 직관적이고 적용하기도 편했다. 변화의 바람이 빠른 직군인 개발자인 만큼 공부도 꾸준히 계속 진행되어야 하고 이런 점이 개발자 직군의 강력함이지 않을까 싶다.