CI/CD 파이프라인 구축

# packages/server/Dockerfile
# 1단계: 빌드 환경
FROM node:20-alpine AS builder

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

# 루트의 package.json, lock 파일 복사 (monorepo root)
COPY package.json pnpm-lock.yaml ./

# server 및 shared 패키지의 package.json, lock 파일 복사
COPY packages/server/package.json packages/server/pnpm-lock.yaml ./packages/server/
COPY packages/shared/package.json packages/shared/pnpm-lock.yaml ./packages/shared/

# pnpm install (monorepo root에서 실행)
# pnpm install -r --frozen-lockfile 또는 npm ci --prefix packages/server
RUN npm install -g pnpm && pnpm install --frozen-lockfile --prod=false

# 모든 소스 코드 복사
COPY . .

# NestJS 서버 빌드
WORKDIR /app/packages/server
RUN pnpm build

# 2단계: 프로덕션 환경
FROM node:20-alpine AS runner

WORKDIR /app

# pnpm install --prod (프로덕션 의존성만 설치)
COPY --from=builder /app/package.json /app/pnpm-lock.yaml ./
COPY --from=builder /app/packages/server/package.json /app/packages/server/pnpm-lock.yaml ./packages/server/
COPY --from=builder /app/packages/shared/package.json /app/packages/shared/pnpm-lock.yaml ./packages/shared/
RUN npm install -g pnpm && pnpm install --frozen-lockfile --prod

# 빌드된 NestJS 애플리케이션 복사
COPY --from=builder /app/packages/server/dist ./packages/server/dist
# 의존성 복사; builder에는 개발 의존성도 포함될 수 있음
COPY --from=builder /app/packages/server/node_modules ./packages/server/node_modules
COPY --from=builder /app/packages/shared/dist ./packages/shared/dist
COPY --from=builder /app/packages/shared/node_modules ./packages/shared/node_modules

# 환경 변수 (예: DATABASE_URL 등)
ENV NODE_ENV=production
ENV PORT=4100

EXPOSE 4100

WORKDIR /app/packages/server
CMD ["node", "dist/main.js"]

# packages/client/Dockerfile
# 1단계: 빌드 환경 (React 앱 빌드)
FROM node:20-alpine AS builder

WORKDIR /app

# 루트의 package.json, lock 파일 복사 (monorepo root)
COPY package.json pnpm-lock.yaml ./

# client 및 shared 패키지의 package.json, lock 파일 복사
COPY packages/client/package.json packages/client/pnpm-lock.yaml ./packages/client/
COPY packages/shared/package.json packages/shared/pnpm-lock.yaml ./packages/shared/

# pnpm install (monorepo root에서 실행)
RUN npm install -g pnpm && pnpm install --frozen-lockfile --prod=false

# 모든 소스 코드 복사
COPY . .

# React 앱 빌드
WORKDIR /app/packages/client
RUN pnpm build

# 2단계: 프로덕션 서빙 환경 (Nginx 사용)
FROM nginx:alpine

# Nginx 기본 설정 파일 삭제
RUN rm /etc/nginx/conf.d/default.conf

# 사용자 정의 Nginx 설정 파일 복사
COPY nginx.conf /etc/nginx/conf.d/default.conf

# 빌드된 React 앱 정적 파일 복사
COPY --from=builder /app/packages/client/dist /usr/share/nginx/html

EXPOSE 80

CMD ["nginx", "-g", "daemon off;"]

# packages/client/nginx.conf
server {
    listen 80;
    server_tokens off; # Nginx 버전 숨기기

    location / {
        root   /usr/share/nginx/html;
        index  index.html index.htm;
        try_files $uri $uri/ /index.html; # SPA 라우팅을 위한 설정
    }

    error_page   500 502 503 504  /50x.html;
    location = /50x.html {
        root   /usr/share/nginx/html;
    }
}

# .github/workflows/ci-cd.yml
name: Fullstack CI/CD Pipeline

on:
  push:
    branches:
      - main # main 브랜치에 푸시될 때마다 실행

env:
  NODE_VERSION: '20' # 사용할 Node.js 버전
  DOCKERHUB_USERNAME: ${{ secrets.DOCKERHUB_USERNAME }}
  DOCKERHUB_TOKEN: ${{ secrets.DOCKERHUB_TOKEN }}
  # 서버 이미지 이름/태그
  SERVER_IMAGE_NAME: ${{ secrets.DOCKERHUB_USERNAME }}/my-nest-app
  SERVER_IMAGE_TAG: latest
  # 클라이언트 이미지 이름/태그
  CLIENT_IMAGE_NAME: ${{ secrets.DOCKERHUB_USERNAME }}/my-react-app
  CLIENT_IMAGE_TAG: latest

jobs:
  # CI Job: 빌드 및 테스트 (서버 및 클라이언트)
  build-and-test:
    runs-on: ubuntu-latest
    steps:
      - name: Checkout Repository
        uses: actions/checkout@v4

      - name: Set up Node.js
        uses: actions/setup-node@v4
        with:
          node-version: ${{ env.NODE_VERSION }}
          cache: 'pnpm' # pnpm 캐싱 설정

      - name: Install pnpm
        run: npm install -g pnpm

      - name: Install Dependencies (Monorepo Root)
        run: pnpm install --frozen-lockfile --prod=false # 모든 의존성 설치

      - name: Build Server
        run: pnpm --filter server build # server 패키지 빌드

      - name: Run Server Tests
        run: pnpm --filter server test # server 패키지 테스트 (단위/통합)

      - name: Build Client
        run: pnpm --filter client build # client 패키지 빌드

      - name: Run Client Tests
        run: pnpm --filter client test # client 패키지 테스트 (단위)
        # E2E 테스트는 별도 Job 또는 Cypress Cloud 등 이용

  # CD Job: 도커 이미지 빌드 및 푸시, 서버 배포
  deploy:
    needs: build-and-test # build-and-test Job이 성공해야 실행
    runs-on: ubuntu-latest
    environment: production # GitHub Environment 설정 (선택 사항, 배포 보호 등)
    steps:
      - name: Checkout Repository
        uses: actions/checkout@v4

      - name: Set up Docker Buildx
        uses: docker/setup-buildx-action@v3

      - name: Login to Docker Hub
        uses: docker/login-action@v3
        with:
          username: ${{ env.DOCKERHUB_USERNAME }}
          password: ${{ env.DOCKERHUB_TOKEN }}

      # --- Server (NestJS) Docker Image Build and Push ---
      - name: Build and Push Server Docker Image
        uses: docker/build-push-action@v5
        with:
          context: . # Monorepo 루트에서 Dockerfile을 찾음
          file: ./packages/server/Dockerfile
          push: true
          tags: ${{ env.SERVER_IMAGE_NAME }}:${{ env.SERVER_IMAGE_TAG }}
          cache-from: type=gha # GitHub Actions 캐시 사용
          cache-to: type=gha,mode=max

      # --- Client (React) Docker Image Build and Push ---
      - name: Build and Push Client Docker Image
        uses: docker/build-push-action@v5
        with:
          context: .
          file: ./packages/client/Dockerfile
          push: true
          tags: ${{ env.CLIENT_IMAGE_NAME }}:${{ env.CLIENT_IMAGE_TAG }}
          cache-from: type=gha
          cache-to: type=gha,mode=max

      # --- Deploy to EC2 via SSH ---
      - name: Deploy to EC2
        uses: appleboy/[email protected] # SSH를 통해 원격 서버에 명령 실행
        with:
          host: ${{ secrets.EC2_HOST }}
          username: ${{ secrets.EC2_USER }}
          key: ${{ secrets.EC2_SSH_PRIVATE_KEY }}
          script: |
            # Docker 컨테이너 중지 및 삭제
            docker stop my-nest-app || true
            docker rm my-nest-app || true
            docker stop my-react-app || true
            docker rm my-react-app || true

            # 최신 이미지 풀
            docker pull ${{ env.SERVER_IMAGE_NAME }}:${{ env.SERVER_IMAGE_TAG }}
            docker pull ${{ env.CLIENT_IMAGE_NAME }}:${{ env.CLIENT_IMAGE_TAG }}

            # 서버 컨테이너 실행
            # Docker Hub로부터 이미지를 가져와 실행 시 .env 파일 직접 설정
            docker run -d --restart always \
              -p 4100:4100 \
              --name my-nest-app \
              -e DATABASE_HOST=${{ secrets.PROD_DATABASE_HOST }} \
              -e DATABASE_PORT=${{ secrets.PROD_DATABASE_PORT }} \
              -e DATABASE_USER=${{ secrets.PROD_DATABASE_USER }} \
              -e DATABASE_PASSWORD=${{ secrets.PROD_DATABASE_PASSWORD }} \
              -e DATABASE_NAME=${{ secrets.PROD_DATABASE_NAME }} \
              -e JWT_SECRET=${{ secrets.PROD_JWT_SECRET }} \
              ${{ env.SERVER_IMAGE_NAME }}:${{ env.SERVER_IMAGE_TAG }}

            # 클라이언트 컨테이너 실행
            docker run -d --restart always \
              -p 80:80 \
              --name my-react-app \
              ${{ env.CLIENT_IMAGE_NAME }}:${{ env.CLIENT_IMAGE_TAG }}

            echo "Deployment finished successfully!"

{
  "name": "ci-workspace-check",
  "private": true,
  "packageManager": "[email protected]",
  "engines": { "node": "24.21.0" },
  "scripts": {
    "build:shared": "pnpm --filter @my-fullstack-app/shared --fail-if-no-match build",
    "build:server": "pnpm --filter server --fail-if-no-match build",
    "build:client": "pnpm --filter client --fail-if-no-match build",
    "build": "pnpm run build:shared && pnpm run build:server && pnpm run build:client",
    "prepare:runtime": "pnpm --filter server deploy --prod --offline --no-hoist --no-shamefully-hoist out/server",
    "test": "node scripts/verify-artifacts.mjs"
  }
}

packages:
  - 'packages/*'

{
  "name": "@my-fullstack-app/shared",
  "version": "1.0.0",
  "private": true,
  "type": "module",
  "files": ["dist"],
  "exports": {
    ".": { "types": "./dist/index.d.ts", "import": "./dist/index.js" }
  },
  "scripts": { "build": "tsc -p tsconfig.json" },
  "devDependencies": { "typescript": "5.9.3" }
}

{
  "compilerOptions": {
    "target": "ES2022", "module": "NodeNext", "moduleResolution": "NodeNext",
    "rootDir": "src", "outDir": "dist", "declaration": true, "strict": true
  },
  "include": ["src/**/*.ts"]
}

export interface PublicUserDto {
  id: number;
  email: string;
  name: string;
}

export function formatPublicUser(user: PublicUserDto): string {
  return `${user.id}:${user.name}`;
}

{
  "name": "server",
  "version": "1.0.0",
  "private": true,
  "type": "module",
  "files": ["dist"],
  "scripts": { "build": "tsc -p tsconfig.json", "start": "node dist/main.js" },
  "dependencies": { "@my-fullstack-app/shared": "workspace:*" },
  "devDependencies": { "typescript": "5.9.3", "@types/node": "24.19.1" }
}

{
  "compilerOptions": {
    "target": "ES2022", "module": "NodeNext", "moduleResolution": "NodeNext",
    "rootDir": "src", "outDir": "dist", "strict": true,
    "lib": ["ES2022"], "types": ["node"]
  },
  "include": ["src/**/*.ts"]
}

import { formatPublicUser } from '@my-fullstack-app/shared';
import type { PublicUserDto } from '@my-fullstack-app/shared';

const user: PublicUserDto = { id: 1, email: '[email protected]', name: '학습자' };
console.log(formatPublicUser(user));

{
  "name": "client",
  "version": "1.0.0",
  "private": true,
  "type": "module",
  "scripts": { "build": "tsc -p tsconfig.json && vite build" },
  "dependencies": {
    "@my-fullstack-app/shared": "workspace:*",
    "react": "19.1.1", "react-dom": "19.1.1"
  },
  "devDependencies": {
    "typescript": "5.9.3", "vite": "6.3.5",
    "@types/react": "19.1.10", "@types/react-dom": "19.1.9"
  }
}

{
  "compilerOptions": {
    "target": "ES2022", "module": "ESNext", "moduleResolution": "Bundler",
    "lib": ["ES2022", "DOM", "DOM.Iterable"], "noEmit": true,
    "strict": true, "skipLibCheck": true
  },
  "include": ["src/**/*.ts"]
}

<!doctype html>
<html lang="ko">
  <head><meta charset="UTF-8"><title>공유 패키지 빌드 확인</title></head>
  <body><div id="root"></div><script type="module" src="/src/main.ts"></script></body>
</html>

import { createElement } from 'react';
import { createRoot } from 'react-dom/client';
import { formatPublicUser } from '@my-fullstack-app/shared';
import type { PublicUserDto } from '@my-fullstack-app/shared';

const user: PublicUserDto = { id: 1, email: '[email protected]', name: '학습자' };
const root = document.getElementById('root');
if (!root) throw new Error('index.html의 #root가 필요합니다.');
createRoot(root).render(createElement('p', null, formatPublicUser(user)));

node --version
pnpm --version
pnpm install --lockfile-only
pnpm install --frozen-lockfile
pnpm run build
pnpm run prepare:runtime
pnpm test

import assert from 'node:assert/strict';
import { existsSync, readFileSync, readdirSync, realpathSync } from 'node:fs';
import { resolve, sep } from 'node:path';
import { spawnSync } from 'node:child_process';

for (const path of [
  'packages/shared/dist/index.js', 'packages/shared/dist/index.d.ts',
  'packages/server/dist/main.js', 'packages/client/dist/index.html',
  'out/server/node_modules/@my-fullstack-app/shared/package.json',
  'out/server/node_modules/@my-fullstack-app/shared/dist/index.js',
]) assert.ok(existsSync(path), `산출물 누락: ${path}`);

const html = readFileSync('packages/client/dist/index.html', 'utf8');
const scripts = [...html.matchAll(/<script\b[^>]*\bsrc="([^"]+)"/g)];
assert.ok(scripts.length > 0, 'client HTML의 JavaScript 진입 파일 누락');
for (const [, src] of scripts) {
  assert.ok(src.startsWith('/assets/') && src.endsWith('.js'), src);
  assert.ok(existsSync(`packages/client/dist${src}`), `client JS 누락: ${src}`);
}

const runtimeRoot = realpathSync('out/server');
function checkLinks(directory) {
  for (const entry of readdirSync(directory, { withFileTypes: true })) {
    const path = resolve(directory, entry.name);
    if (entry.isSymbolicLink()) {
      const target = realpathSync(path);
      assert.ok(target === runtimeRoot || target.startsWith(runtimeRoot + sep),
        `runner 밖을 가리키는 링크: ${path}`);
    } else if (entry.isDirectory()) checkLinks(path);
  }
}
checkLinks(runtimeRoot);
const child = spawnSync(process.execPath, ['dist/main.js'], {
  cwd: runtimeRoot, encoding: 'utf8', env: { PATH: process.env.PATH ?? '' },
});
assert.equal(child.status, 0, child.stderr);
assert.equal(child.stdout.trim(), '1:학습자');
console.log('shared JS·선언 / server 실행 / client 산출물 / runner 내부 링크 확인');

**/node_modules
**/dist
out
.git

FROM node:24.21.0-alpine AS build
WORKDIR /app
RUN npm install --global [email protected]
COPY package.json pnpm-lock.yaml pnpm-workspace.yaml ./
COPY packages/shared/package.json ./packages/shared/package.json
COPY packages/server/package.json ./packages/server/package.json
COPY packages/client/package.json ./packages/client/package.json
RUN pnpm install --frozen-lockfile
COPY packages ./packages
COPY scripts ./scripts
RUN pnpm run build
RUN pnpm run prepare:runtime
RUN pnpm test

FROM node:24.21.0-alpine AS runner
WORKDIR /app
ENV NODE_ENV=production
COPY --from=build /app/out/server/ ./
CMD ["node", "dist/main.js"]

FROM node:24.21.0-alpine AS build
WORKDIR /app
RUN npm install --global [email protected]
COPY package.json pnpm-lock.yaml pnpm-workspace.yaml ./
COPY packages/shared/package.json ./packages/shared/package.json
COPY packages/server/package.json ./packages/server/package.json
COPY packages/client/package.json ./packages/client/package.json
RUN pnpm install --frozen-lockfile
COPY packages ./packages
RUN pnpm --filter @my-fullstack-app/shared --fail-if-no-match build
RUN pnpm --filter client --fail-if-no-match build

FROM nginx:1.28-alpine AS runner
COPY packages/client/nginx.conf /etc/nginx/conf.d/default.conf
COPY --from=build /app/packages/client/dist/ /usr/share/nginx/html/
EXPOSE 80
CMD ["nginx", "-g", "daemon off;"]

name: Workspace build check
on: workflow_dispatch
jobs:
  check:
    runs-on: ubuntu-latest
    defaults:
      run:
        working-directory: ci-workspace-check
    steps:
      - uses: actions/checkout@v4
      - uses: pnpm/action-setup@v4
        with:
          version: 9.15.9
          run_install: false
      - uses: actions/setup-node@v4
        with:
          node-version: '24.21.0'
          cache: pnpm
          cache-dependency-path: ci-workspace-check/pnpm-lock.yaml
      - run: pnpm install --frozen-lockfile
      - run: pnpm run build
      - run: pnpm run prepare:runtime
      - run: pnpm test