cd: 준희님 고생많으셨습니다!

.github/workflows/deploy-docker.yml

@@ -0,0 +1,44 @@
+name: Deploy Frontend
+
+on:
+  push:
+    branches:
+      - main
+
+jobs:
+  build-and-push:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v4
+
+      - name: Login to DockerHub
+        uses: docker/login-action@v3
+        with:
+          username: ${{ secrets.DOCKER_HUB_USERNAME }}
+          password: ${{ secrets.DOCKER_HUB_TOKEN }}
+
+      - name: Docker Build and Push
+        uses: docker/build-push-action@v6
+        with:
+          context: .
+          push: true
+          file: ./Dockerfile
+          platforms: linux/amd64
+          tags: |
+            ${{ secrets.DOCKER_HUB_USERNAME }}/frontend:${{ github.run_number }}
+            ${{ secrets.DOCKER_HUB_USERNAME }}/frontend:latest
+
+  deploy:
+    needs: build-and-push
+    runs-on: ubuntu-latest
+    steps:
+      - name: Deploy to Server
+        uses: appleboy/[email protected]
+        with:
+          host: ${{ secrets.SERVER_IP }}
+          username: ubuntu
+          key: ${{ secrets.SSH_PRIVATE_KEY }}
+          script: |
+            cd /home/ubuntu && ./deploy-frontend.sh

Dockerfile

@@ -0,0 +1,30 @@
+# 1. Node.js 환경 설정
+FROM node:20 AS builder
+
+# 2. 작업 디렉토리 설정
+WORKDIR /app
+
+# 3. corepack 및 pnpm 설치
+RUN npm install -g corepack && corepack enable && corepack prepare pnpm@latest --activate
+
+# 4. 필수 파일 복사
+COPY package.json pnpm-lock.yaml ./
+
+# 5. 의존성 설치 (pnpm 사용)
+RUN pnpm install --frozen-lockfile
+
+# 6. 소스 코드 복사 및 빌드
+COPY . .
+RUN pnpm build
+
+# 7. PM2 설치 및 상태 확인
+RUN npm install pm2 -g && pm2 --version
+
+# 8. PM2 프로세스 시작
+RUN pm2 start npm --name "techBlogHub-main-frontend" -- run start
+
+# 9. 4000 포트 열기
+EXPOSE 4000
+
+# 10. PM2 실행
+CMD ["pm2-runtime", "start", "npm", "--name", "techBlogHub-main-frontend", "--", "start", "--", "--port", "4000"]