[Github] Github Actions 이해하기-2 (환경설정, 적용 예시)

해당 글에서는 이전 용어들에 대해서 이해하는 것에 이어진 환경 설정 후 적용하는 예시에 대해서 이해하기 위한 글을 다루고 있습니다.

 

 

💡 이전에 작성한 Github Actions 정의 및 주요 용어를 설명하는 글을 읽고 오시면 도움이 됩니다. 

 

[Github] Github Actions 이해하기 -1(정의, 주요 용어)

 

1) Github Actions 초기 환경 구성

---

1.. 적용할Github Repository에 들어가서 'Actions' 탭을 누릅니다.

 

2. Actions 탭에서 Node.js 기반의 Github Actions를 구성합니다. 'Configure' 버튼을 누릅니다.

 

3. 해당 버튼을 누르면 아래와 같은 기본 템플릿이 생성됩니다.

 

2) Github Actions 적용 예시

---

💡  해당 예시는 Node.js기반의 React를 AWS S3 공간에 배포하는 방법에 대해서 공유합니다.

# 1. 해당 Workflow의 이름을 정의 합니다.
name: TEST Web CI/CD-dev

# 2. 'Events'로 'develop-main'에서 pull request가 발생하면 수행합니다.
on:
  pull_request:                      
    branches:
      - develop-main

# 3. Jobs가 수행됩니다.
jobs:
  build:
    runs-on: ubuntu-18.04

#4. 해당 단계에서는 지정한 node 16 버전을 설치하고 소스를 체크아웃 받습니다.
    steps:
      - uses: actions/setup-node@v2
        with:
          node-version: '16'
      - name: Checkout source code.  
        uses: actions/checkout@master

#5. 해당 Cache node modules를 수행합니다.
      - name: Cache node modules
        uses: actions/cache@v1
        with:
          path: node_modules
          key: ${{ runner.OS }}-build-${{ hashFiles('**/yarn.lock') }}
          restore-keys: |
            ${{ runner.OS }}-build-
            ${{ runner.OS }}-

#6. Depenency들을 yarn 패키지 매니져를 통해 모두 설치합니다
      - name: Install Dependencies
        run: yarn install --force

#7. Node Sass를 설치합니다.
      - name: Node Sass Rebuild    # node-sass rebuild
        run: yarn add node-sass@6.0.1 --force

# 8. pacakage.json에 설치한 'dev-test' 스크립트를 통해 빌드를 수행합니다.
      - name: Build                   
        run: CI=false yarn build:dev-test --force

# 9. AWS S3 공간에 배포를 합니다.(Access key와 Secret Key를 참조합니다)
      - name: Deploy                  
        env:
          AWS_ACCESS_KEY_ID: '${{ secrets.AWS_ACCESS_KEY_ID }}'
          AWS_SECRET_ACCESS_KEY: '${{ secrets.AWS_SECRET_ACCESS_KEY }}'
        run: |
          aws s3 cp \\
            --recursive \\
            --region temp-region-name \\
            build s3://temp.s3.name

 

3) 환경 파일 생성 및 확인

---

 

1. 작성한 파일에서 'Start Commit' 버튼을 누르고 'Commit new file' 버튼을 누릅니다.

---

 

2. 아래와 같이 해당 경로에 파일이 생성됨을 확인할 수 있습니다.

---

 

3. Action 탭으로 이동하면 구성한 Workflows를 확인 할 수 있습니다.

---

 

4. 환경 구성이라는 브런치에서 메인 브런치인 develop-main 브런치로 'pull request'를 수행합니다.

---

 

5. pull request에 대한 'Merge pull request'를 통해 승인을 수행합니다.

---

 

6. 'Actions' 탭으로 이동하면 해당 workflow가 수행됨을 확인 할 수 있습니다.

---

7. 해당 workflow의 상세를 확인하면 단계 별로 진행이 되는 것을 확인할 수 있습니다.

---

 

 

💡 [참고] Github에 더 궁금하시면 아래의 링크를 참고하시면 도움이 됩니다.

주제	링크
Github 주요 용어 -1: 기본 구조	https://adjh54.tistory.com/22
Github 주요 용어-2 : 기본 동작	https://adjh54.tistory.com/363
Github - JIRA 연동 방법	https://adjh54.tistory.com/366
Git Tag 및 Release 구성 방법	https://adjh54.tistory.com/13
Github Actions-1: 정의, 주요용어	https://adjh54.tistory.com/50
Github Actions-2: 환경설정, 적용예시	https://adjh54.tistory.com/51
Git 브랜치 전략의 종류	https://adjh54.tistory.com/364
Git 브랜치 전략 : Git-flow	https://adjh54.tistory.com/367
Git 브랜치 전략 : Git-flow 변형	https://adjh54.tistory.com/368

 

 

 

오늘도 감사합니다😀