Merge pull request #282 from boostcampwm-2024/chore/be/dockerDeploy

[BE][Chore] FE 컨테이너 Workdir 생성 안되는 문제 해결

backend/Dockerfile

@@ -1,8 +1,8 @@
 # 1. 베이스 이미지 설정 (Node.js 18 버전 사용)
 FROM node:18
 
-# 2. 작업 디렉토리 설정
-WORKDIR /app
+# 2. 작업 디렉토리 설정 (백엔드 디렉토리)
+WORKDIR /backend-app
 
 # 3. root 폴더의 package.json, pnpm-lock.yaml, pnpm-workspace.yaml 파일을 복사
 COPY package.json pnpm-lock.yaml pnpm-workspace.yaml ./
@@ -14,10 +14,10 @@ RUN npm install -g pnpm
 RUN pnpm install
 
 # 6. backend 폴더를 컨테이너로 복사
-COPY backend /app/backend
+COPY backend /backend-app/backend
 
 # 7. 작업 디렉토리 backend로 이동
-WORKDIR /app/backend
+WORKDIR /backend-app/backend
 
 # 8. backend 의존성 설치
 RUN pnpm install

docker-compose.yml

@@ -8,15 +8,17 @@ services:
       - NODE_ENV=production
     networks:
       - app-network
+    volumes:
+      - ./backend:/backend-app
 
   frontend:
     build:
       context: .
       dockerfile: frontend/Dockerfile
     networks:
       - app-network
-    depends_on:
-      - backend
+    volumes:
+      - ./frontend:/frontend-app
 
   nginx:
     image: nginx:alpine

frontend/Dockerfile

@@ -1,8 +1,8 @@
 # 1. 베이스 이미지 설정 (Node.js 18 사용)
 FROM node:18 AS builder
 
-# 2. 작업 디렉토리 설정
-WORKDIR /app
+# 2. 작업 디렉토리 설정 (프론트엔드 디렉토리)
+WORKDIR /frontend-app
 
 # 3. root의 패키지 파일 복사
 COPY package.json pnpm-lock.yaml pnpm-workspace.yaml ./
@@ -14,18 +14,18 @@ RUN npm install -g pnpm
 RUN pnpm install
 
 # 6. 프론트엔드 폴더 복사
-COPY frontend /app/frontend
+COPY frontend /frontend-app/frontend
 
 # 7. 작업 디렉토리 변경
-WORKDIR /app/frontend
+WORKDIR /frontend-app/frontend
 
 # 8. frontend 의존성 설치
 RUN pnpm install
 
-# 8. 빌드 실행
+# 9. 빌드 실행
 RUN pnpm build
 
-# 9. Nginx 이미지를 사용해 정적 파일 제공
+# 10. Nginx 이미지를 사용해 정적 파일 제공
 FROM nginx:alpine
-COPY --from=builder /app/frontend/dist /usr/share/nginx/html
+COPY --from=builder /frontend-app/frontend/dist /usr/share/nginx/html
 EXPOSE 80

nginx.conf

@@ -47,10 +47,10 @@ http {
         }
 
         location / {
-            proxy_pass http://frontend:80;
-            proxy_set_header Host $host;
-            proxy_set_header X-Real-IP $remote_addr;
-            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+            root /usr/share/nginx/html;
+            index index.html;
+
+            try_files $uri /index.html;
         }
     }
 }