<aside> <img src="/icons/list_gray.svg" alt="/icons/list_gray.svg" width="40px" /> 목차

</aside>

👉 기존 CI/CD 파이프라인에서 개선할 점

이제 TypeScript를 적용하면서 바뀐 부분이 있습니다.

바로 빌드 단계가 추가되었다는 점! 이를 반영해서 수정해주도록 하겠습니다.

- name: Install dependencies
  run: |
    ssh playground-umc-7th 'cd /opt/app; npm install'
    ssh playground-umc-7th 'cd /opt/app; npm exec prisma generate'
    ssh playground-umc-7th 'cd /opt/app; npm run build'

빌드 스크립트만 추가해주었고, 바로 잘 동작할 거예요!

서버를 시작하기 위해서는 이제 미리 TypeScript 코드를 JavaScript로 변환하고, 이 변환된 파일을 실행하기 때문에 필요해진 단계입니다.

👉 CI 추가하기

이제 프로젝트의 복잡도가 조금 높아졌다고 볼 수 있습니다. 로컬에서 개발하고 배포를 시도했을 때 빌드가 실패하거나, 타입 오류가 숨어있을 가능성도 있을 수 있습니다.

이를 방지하기 위해 간단한 CI를 하나 추가해보겠습니다. 이 파이프라인은 .github/workflows/ 폴더 안에 test.yml 파일로 만들어보겠습니다.

name: test

on:
  pull_request:
  push:
    branches:
      - main

jobs:
  test:
    runs-on: ubuntu-latest
    steps:
      - name: Checkout
        uses: actions/checkout@v4

      - name: Setup Node.js
        uses: actions/setup-node@v4
        with:
          node-version: "20"

      - name: Install dependencies
        run: npm install

      - name: Test prisma generate
        run: npm exec prisma generate

      - name: Test build
        run: npm run build

      - name: Test type error
        run: npm exec tsc --noEmit

이 파이프라인은 GitHub 상에서 Pull Request가 생성되면 실행되고, main 브랜치에 푸시할 때에도 실행되도록 설정했습니다.

아래와 같은 작업들을 실행하게 되는데요.

• npm install: 라이브러리 설치를 먼저 진행합니다.
• npm exec prisma generate: Prisma Client 생성이 잘 되는지 진행합니다.
• npm run build: 빌드가 잘 되는지 확인합니다.
• npm exec tsc --noEmit: TypeScript 컴파일러를 이용해서 타입 오류가 없는지 검증합니다.

👉 CI 테스트하기