프론트도 AWS Ec2에 배포해보자(2)

김동영·2023년 12월 28일

EC2

목록 보기
2/3

이번에는 저번포스트에서 말했던데로 github action과 self-hosted를 사용해서 ec2에 CI/CD를 구축할것입니다.

github action이란?

Github가 공식적으로 제공하는 빌드, 테스트 및 배포 파이프라인을 자동화할 수 있는 CI/CD 플랫폼입니다.
레포지토리에 대한 모든 pull request를 빌드, 테스트하는 workflow를 생성하거나 merge된 pull request를 프로덕션에 배포할 수 있습니다.

즉 쉽게 말해서 pull request가 생성되거나 코드가 merge,push와 같은 이벤트가 발생 했을때 미리 작성한 작업들을 실행 시켜줄 수 있게하는 것입니다.

github action 구성요소

  • Workflow
  • Event
  • Job
  • Action
  • Runner

위와 같이 구성되어있습니다.

Workflow

  • workflow는 하나 이상의 job으로 구성되고 event에 의해 트리거될 수 있는 자동화된 프로세스입니다.

  • repository에는 여러 workflow를 가질 수 있으며 각 workflow는 서로 다른 작업을 수행할 수 있습니다.

  • Workflow 파일은 YAML으로 작성되고, Github Repository의 .github/workflows 폴더 아래에 저장됩니다.

Event

  • workflow 실행을 발동시키는 특정한 활동입니다.

  • 깃허브에 소스코드를 푸시하면 발생하는 push event, pull request event, issue event 등 깃허브에서 발생하는 대부분의 작업을 event로 정의할 수 있습니다.

Job

  • Job은 여러 Step으로 구성되고, 가상 환경의 인스턴스에서 실행됩니다.

  • 다른 Job에 의존 관계를 가질 수 있고, 독립적으로 병렬 실행도 가능합니다.

step

  • Job에서 실행되는 개별 작업입니다.

  • 명령어를 실행하거나 action을 실행할 수 있습니다.

Action

  • workflow의 가장 작은 블럭으로 job을 만들기 위해 step들을 연결할 수 있습니다.

  • 재사용이 가능한 Component이고 개인적으로 Action을 만들거나 Marketplace의 Action을 사용할 수 있음

Runner

  • runner는 workflow가 실행될때 사용하는 서버입니다.

  • 각 runner는 한번에 한개의 job을 실행할 수 있습니다.

  • Github에서 호스팅해주는 Github-hosted runner와 직접 호스팅하는 Self-hosted runner로 존재합니다.

self-hosted로 github action

1.runner 설치

  • 일단 처음에는 runner를 설치해야합니다.

  • github repository > settings > actions > runners > new self-hosted runner 클릭

  • 아래단계 대로 진행하면됩니다.
# Create a folder
$ mkdir actions-runner && cd actions-runner
# Download the latest runner package

$ curl -o actions-runner-linux-x64-2.311.0.tar.gz -L https://github.com/actions/runner/releases/download/v2.311.0/actions-runner-linux-x64-2.311.0.tar.gz
# Optional: Validate the hash

$ echo "29fc8cf2dab4c195bb147384e7e2()93b346a6175435265aa278  actions-runner-linux-x64-2.311.0.tar.gz" | shasum -a 256 -c
# Extract the installer

$ tar xzf ./actions-runner-linux-x64-2.311.0.tar.gz

# Create the runner and start the configuration experience
$ ./config.sh --url https://github.com/wwweric12/test-chatUniv --token AX2PVGRK7JIAATFQRRKW

# Last step, run it!
$ nohup ./run.sh & > nohup.out #백그라운드로 실행

2.runner 확인

  • Offline : 서버에 설치는 되었으나 listen상태가 아닐 경우
  • Idle : 서버에 설치되었고 listen 상태인 경우
  • Active : 서버에 설치되었고 workflow가 실행 중인 경우

위의 과정을 거치게 되면 보통의 경우 위의 사진과 같이 Idle의 상태입니다.
이렇게 된다면 runner 설치 및 확인까지 완료하였습니다.

github action 작성

다음으로 github repository에 들어가서 yml 파일을 작성해 보았습니다.
github action workflow는 github/workflows아래에 작성해야 합니다.

아래의 코드는 제가 작성한 yml파일입니다. 한번에 보여주고 하나하나 뜯어서 확인해 보도록 하겠습니다.

name: Test workflow                    # Workflow 이름
on:                                  # Event 감지
  push:
    branches:
      - develop
jobs:                                # Job 설정
   build:
      name: CI
      runs-on: self-hosted
      defaults:
          run:
              working-directory: ../..
      steps:
      - name: Use Node.js 18.x
        uses: actions/setup-node@v1
        with:
          node-version: 18.x
          
      - name: Stop old server (ignore error)
        run: |
            pm2 stop test
            
      - name: build univ
        run: |
            cd test-chatUniv
            git pull origin develop
            yarn install
            yarn run build 
          
   deploy:
      needs: build
      name: CD
      runs-on: self-hosted
      defaults:
          run:
              working-directory: ../..
      steps:    
      - name : run new server
        run : |
            cd test-chatUniv
            pm2 serve build 3000 --spa --name "test"

workflow 실행 조건입니다. develop 브랜치에 push 될때마다 실행됩니다.

name: Test workflow                    # Workflow 이름
on:                                  # Event 감지
  push:
    branches:
      - develop


jobs:                                # Job 설정
   build:
      name: CI
      runs-on: self-hosted
      defaults:
          run:
              working-directory: ../..
  • self-hosted로 설정
  • 처음 시작할때 working-directory 변경

 steps:
      - name: Use Node.js 18.x
        uses: actions/setup-node@v1
        with:
          node-version: 18.x
          
      - name: Stop old server (ignore error)
        run: |
            pm2 stop test
            
      - name: build univ
        run: |
            cd test-chatUniv
            git pull origin develop
            yarn install
            yarn run build 
  • node 버전 확인
  • 이전에 실행중인 pm2 stop
  • 변경사항 최신화 후 build

이후에는 배포 입니다.

deploy:
      needs: build
      name: CD
      runs-on: self-hosted
      defaults:
          run:
              working-directory: ../..
      steps:    
      - name : run new server
        run : |
            cd test-chatUniv
            pm2 serve build 3000 --spa --name "test"
  • pm2 serve를 통해 배포 및 이름 test로 설정

지금은 test이기 때문에 이정도로만 yml파일을 작성했습니다. 다음 포스트에는 docker를 사용해서 CI/CD를 구축 해보도록 하겠습니다.
profile
안녕하세요 프론트엔드개발자가 되고싶습니다

0개의 댓글