Checkout 액션을 사용하는 GitHub Actions

소개

이 랩에서는 모든 GitHub Actions 워크플로우에서 가장 필수적인 단계 중 하나인 actions/checkout 액션을 사용하는 방법을 배웁니다. 기본적으로 GitHub Actions 러너는 비어 있는 디렉토리에서 시작됩니다. 코드를 빌드, 테스트 또는 배포하려면 먼저 리포지토리를 러너의 작업 공간 (workspace) 으로 체크아웃해야 합니다.

워크플로우 파일을 생성하고, 코드를 체크아웃하도록 구성한 다음, 로그에 파일 목록을 표시하여 파일에 접근할 수 있는지 확인합니다. 이 과정은 표준 지속적 통합 (CI) 파이프라인 설정을 시뮬레이션합니다.

이 랩은 이전 랩에서 생성한 리포지토리를 기반으로 합니다. github-actions-demo 리포지토리를 복제하고 체크아웃 액션을 사용하는 새 워크플로우를 생성할 것입니다.

워크플로우에 actions/checkout@v4를 사용하도록 단계 추가

이 단계에서는 리포지토리를 클론하고 actions/checkout 액션을 사용하는 워크플로우를 생성합니다. 이 액션은 $GITHUB_WORKSPACE 아래에 리포지토리를 체크아웃하므로 워크플로우에서 해당 리포지토리에 접근할 수 있습니다.

1. github-actions-demo의 GitHub 리포지토리 페이지에서 녹색 Code 버튼을 클릭합니다.
2. HTTPS 탭이 선택되었는지 확인하고 URL 을 복사합니다. URL 은 https://github.com/your-username/github-actions-demo.git과 유사해야 합니다.
3. LabEx 환경에서 터미널을 엽니다. 기본 경로는 ~/project입니다.
4. git clone 명령어를 사용하여 리포지토리를 다운로드합니다. your-username을 실제 GitHub 사용자 이름으로 바꾸십시오.

cd ~/project
git clone https://github.com/your-username/github-actions-demo.git

5. 클론된 리포지토리로 이동합니다:

cd ~/project/github-actions-demo

6. .github/workflows 디렉토리 안에 ci.yml이라는 새 워크플로우 파일을 생성합니다:

touch .github/workflows/ci.yml

7. WebIDE 에디터에서 .github/workflows/ci.yml을 열고 다음 내용을 추가합니다. 이 설정은 "CI"라는 이름의 워크플로우를 정의하며, 모든 push 이벤트 발생 시 실행됩니다. 이 워크플로우는 ubuntu-latest에서 실행되는 build라는 단일 작업을 포함하며, 코드를 체크아웃하는 단계를 포함합니다.

name: CI

on: [push]

jobs:
  build:
    runs-on: ubuntu-latest

    steps:
      - name: Checkout code
        uses: actions/checkout@v4

이 uses: actions/checkout@v4 줄은 GitHub Actions 에게 공식 checkout 액션의 v4 버전을 다운로드하여 실행하도록 지시합니다.

run ls -la 명령어로 파일 목록을 확인하는 단계 추가

이 단계에서는 체크아웃 액션 (checkout action) 이 파일을 성공적으로 가져왔는지 확인하기 위해 워크플로우에 두 번째 단계를 추가합니다. 현재 디렉터리의 파일을 나열하기 위해 표준 셸 명령어를 사용할 것입니다.

.github/workflows/ci.yml 파일을 열고 steps 목록에 다음 단계를 추가하십시오. 들여쓰기가 이전 단계와 올바르게 정렬되었는지 확인하십시오.

- name: List files
  run: ls -la

이제 완성된 .github/workflows/ci.yml 파일은 다음과 같아야 합니다.

name: CI

on: [push]

jobs:
  build:
    runs-on: ubuntu-latest

    steps:
      - name: Checkout code
        uses: actions/checkout@v4

      - name: List files
        run: ls -la

run 키워드를 사용하면 명령줄 프로그램을 실행할 수 있습니다. 여기서 ls -la는 저장소 루트에 있는 숨겨진 파일을 포함하여 모든 파일을 나열합니다.

리포지토리에 index.js 라는 샘플 파일 생성

이 단계에서는 리포지토리에 샘플 파일을 생성합니다. 이 파일은 워크플로우 로그에서 확인할 때 actions/checkout 액션이 올바르게 작동하고 있음을 증명하는 역할을 합니다.

1. 리포지토리 디렉토리에 있는지 확인합니다:

cd ~/project/github-actions-demo

2. 리포지토리 루트에 index.js라는 간단한 JavaScript 파일을 생성합니다:

echo "console.log('Hello, GitHub Actions!');" > index.js

3. 다음 명령을 실행하여 파일 생성을 확인할 수 있습니다:

ls -l index.js

이 파일은 CI 파이프라인이 일반적으로 빌드하거나 테스트할 애플리케이션의 소스 코드를 나타냅니다.

샘플 파일 및 워크플로우 업데이트 커밋 및 푸시

이 단계에서는 변경 사항을 커밋하고 GitHub 로 푸시합니다. on: [push] 구성으로 인해 이 커밋을 푸시하면 정의한 워크플로가 트리거됩니다.

1. 저장소 디렉토리에 있는지 확인합니다:

cd ~/project/github-actions-demo

2. 저장소 상태를 확인하여 추적되지 않는 파일들을 확인합니다:

git status

.github/workflows/ci.yml 및 index.js가 추적되지 않는 것으로 표시되어야 합니다.

3. 모든 변경 사항을 스테이징합니다:

git add .

4. 설명적인 메시지와 함께 변경 사항을 커밋합니다:

git commit -m "Add CI workflow and index.js"

예시 출력:

[main ... ] Add CI workflow and index.js
 2 files changed, 14 insertions(+), 0 deletions(-)
 create mode 100644 .github/workflows/ci.yml
 create mode 100644 index.js

5. 변경 사항을 GitHub 의 원격 저장소로 푸시합니다:

git push

인증 관련 참고 사항:
git push를 실행하면 WebIDE 가 자동으로 인증을 요청하는 팝업을 표시합니다. 다음의 상세 단계를 따르십시오:

1. "The extension 'GitHub' wants to sign in using GitHub." 라는 메시지와 함께 팝업이 나타납니다. Allow를 클릭합니다.
2. 새로운 알림이 나타납니다. **"Copy&Continue to GitHub"**를 클릭한 다음, 다음 프롬프트에서 **"Open"**을 클릭합니다.
3. 열리는 브라우저 창에서 GitHub 계정에 로그인하고 복사된 인증 코드를 입력합니다. 인증을 확인하면 페이지가 자동으로 닫힙니다.
4. 몇 초 기다리면 터미널에서 푸시 작업이 성공적으로 완료되는 것을 볼 수 있습니다.

개인 정보 보호 참고 사항: WebIDE 는 인증 목적으로 GitHub 계정에 대한 전체 액세스를 요청합니다. 개인 정보 보호에 대해 걱정할 필요가 없습니다. LabEx VM 은 현재 랩이 완료되는 즉시 파기되며, 귀하의 자격 증명 및 인증 정보는 유지되지 않습니다.

이 인증 프로세스는 사용자 이름이나 Personal Access Token(개인 액세스 토큰) 의 수동 구성이 필요하지 않습니다.

예시 출력:

Enumerating objects: 6, done.
Counting objects: 100% (6/6), done.
Delta compression using up to 4 threads
Compressing objects: 100% (4/4), done.
Writing objects: 100% (4/4), 512 bytes | 512.00 KiB/s, done.
Total 4 (delta 1), reused 0 (delta 0), pack-reused 0
To https://github.com/your-username/github-actions-demo.git
   1234567..abcdef1  main -> main

이 푸시는 GitHub 에서 워크플로를 트리거합니다.

로그에서 파일 목록을 확인하기 위해 워크플로우 실행 확인

코드를 푸시하면 GitHub 에서 워크플로우가 자동으로 트리거됩니다. 워크플로우 실행 로그를 확인하여 checkout 액션이 파일을 성공적으로 가져왔는지 확인할 수 있습니다.

1. 웹 브라우저에서 GitHub 의 리포지토리로 이동합니다: https://github.com/your-username/github-actions-demo
2. 리포지토리 페이지 상단의 Actions 탭을 클릭합니다.
3. "Add CI workflow and index.js" 또는 "CI"로 이름 붙여진 워크플로우 실행 목록이 표시되어야 합니다.

참고: 코드를 푸시할 때 리포지토리에 여러 워크플로우 파일이 있는 경우 여러 Actions 가 트리거될 수 있습니다. 왼쪽 사이드바에서 워크플로우 이름을 확인하거나 오른쪽의 워크플로우 실행 목록을 사용하여 올바른 워크플로우 실행을 식별하십시오.

4. 워크플로우 실행 제목을 클릭한 다음 build 작업을 클릭합니다.
5. List files 단계를 확장하여 출력을 확인합니다.

리포지토리의 index.js 및 기타 파일이 포함된 ls -la 명령어 출력이 표시되어야 합니다.

Run ls -la
  ls -la
  shell: /usr/bin/bash -e {0}
total XX
drwxr-xr-x  X runner ... .
drwxr-xr-x  X runner ... ..
drwxr-xr-x  X runner ... .git
drwxr-xr-x  X runner ... .github
-rw-r--r--  X runner ... index.js
...

이는 actions/checkout 단계가 리포지토리를 성공적으로 체크아웃했음을 확인시켜 줍니다. 체크아웃 단계가 없었다면 ls -la 명령어는 빈 디렉토리만 표시했을 것입니다. 이는 체크아웃 액션이 필수적인 이유를 보여줍니다. 즉, 워크플로우 러너가 리포지토리 파일을 사용할 수 있도록 만들기 때문입니다.

요약

본 실습에서는 actions/checkout 액션을 사용하는 GitHub Actions 워크플로우를 성공적으로 생성했습니다. 다음 사항들을 배웠습니다:

1. .github/workflows 디렉토리 구조 설정 방법.
2. push 이벤트 발생 시 트리거되는 워크플로우 정의 방법.
3. actions/checkout@v4를 사용하여 리포지토리를 러너 (runner) 로 복제하는 방법.
4. ls -la를 사용하여 파일 존재 여부를 확인하는 단계를 추가하는 방법.

이는 거의 모든 CI/CD 파이프라인의 기초 단계이며, 후속 단계에서 애플리케이션 코드를 빌드, 테스트 및 배포할 수 있도록 해줍니다.