express - Docker + express.js 핫빌드 / 핫리로드

개요

express 개발 세팅을 하던 중 핫리로드 기능을 추가하려 했는데 최신 글은 없는 것 같아 포스팅하게 되었다.
spring에 비해 express는 확실히 자료가 너무 적어 매번 애를 먹는 것 같다...

핫리로드 기능 패키지는 nodemon을 사용했다.

---

핫빌드 / 핫리로드란?

• 핫빌드 (Hot Build): 코드 변경 시 전체 애플리케이션을 다시 빌드하여 반영. 주로 백엔드 또는 빌드 도구에서 사용.
• 핫리로딩 (Hot Reloading): 코드 변경 시 변경된 부분만 즉시 반영. 주로 프론트엔드 개발에서 사용하며, 애플리케이션 상태가 유지됨.

내가 작업한 부분은 핫리로드다.
하지만 제목에 핫빌드도 써두어야 검색 유입이 늘어날 것 같아 핫빌드도 써두었다. ㅎㅎ ^^

---

프로젝트 디렉토리 구조

project
├── docker-compose.yml
├── Dockerfile
├── package.json
└── src
     └── index.js

---

docker-compose.yml

version: '3.8'

services:
  web
    build: 
    ports:
      - "3000:3000"
    volumes:
      - .:/usr/src/app
      - /usr/src/app/node_modules
    environment:
      - NODE_ENV=development

---

Dockerfile

# 베이스 이미지 설정
FROM node:20

# 작업 디렉토리 설정
WORKDIR /usr/src/app

# 패키지 설치를 위해 package.json 및 package-lock.json 복사
COPY package*.json ./

# 패키지 설치
RUN npm install

# 어플리케이션 코드 복사
COPY . .

# 어플리케이션이 실행될 포트 설정
EXPOSE 3000

# dev 서버 실행
CMD [ "npm", "run", "dev" ]

---

package.json

nodemon 패키지를 설치하고 nodemon -L src/index.js 명령어를 사용하여 서버를 실행한다.

{
  "name": "프로젝트명",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "dev": "nodemon -L src/index.js"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "dependencies": {
    "express": "^4.19.2"
  },
  "devDependencies": {
    "nodemon": "^3.1.4"
  }
}

---

src/index.js

// server.js
const express = require('express');
const app = express();
const PORT = 3000;

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

app.listen(PORT, () => {
  console.log(`Server is running on http://localhost:${PORT}`);
});

---

후기

어려운 작업은 아니지만 Dockerfile에서 작업 디렉토리 설정을 이상한 경로로 해둔 탓에 많은 시간을 낭비하고 말았다.. 사실상 express가 아닌 docker 공부가 돼버린 작업이다...