[ React 개발 ] 04. Express를 좀 더 서버답게

1. Express 서버를 좀 더 서버 답게

node 명령어를 통해 서버를 가동하면, 서버의 코드가 변경될때마다 재시작을 해야 하는 번거로움이 있습니다. 이를 해결하기 위해 우리는 nodemon이라는 tool을 쓰도록 하겠습니다. 추가로, http 로그를 확인하기 위한 morgan과 여러 명령어를 이어서 실행할 수 있는 concurrently 를 설치합니다.

yarn add morgan nodemon concurrently --dev

그런 다음 package.json을 다음과 같이 수정합니다.

"scripts": {
  "start": "node scripts/start.js",
  "build": "node scripts/build.js",
  "server": "nodemon server/server.js",
  "dev": "concurrently \"yarn server\" \"yarn start\"",
  "test": "node scripts/test.js --env=jsdom"
},

스크립트부분을 수정하는데 "dev", "server" 부분을 추가하였습니다. 앞으로는 yarn dev 명령어를 통해 클라이언트와 서버를 동시에 가동하도록 합니다. 또한 서버는 nodemon으로 작동하여 서버쪽의 코드가 변경되면 바로 적용될 수 있도록 하였습니다.

server/server.js 파일로 가서 http 로그를 확인할 수 있도록 morgan을 설정합니다.

const morgan = require('morgan');

/* 기존 코드 */


app.use(morgan('combined'));

이렇게 입력하고 저장한 다음 홈페이지를 새로고침 하면 아래 그림과 같은 로그를 확인할 수 있습니다.