Github Action은 개발 work flow를 자동화할 수 있게 돕는 CI/CD 툴이다.
Github Action의 코어 개념
- Workflow
자동화된 전체 프로세스.
하나 이상의 Job으로 구성되고, Event에 의해 예약되거나 트리거될 수 있는 자동화된 절차를 의미한다.
Workflow 파일은 YAML으로 작성되며, Github Repository의 `.github/workflows` 폴더 하위에 저장된다.
Github에게 YAML 파일로 정의한 자동화 동작을 전달하면, Github Actions는 해당 파일을 기반으로 동작을 실행한다.
- Job
Job은 여러 Step으로 구성되고 단일 가상 환경에서 실행된다.
다른 Job에게 의존 관계를 가질 수 있고, 독립적으로 병렬로 실행될 수도 있다.
- Event
Workflow를 실행하는 특정 활동이나 규칙.
예를 들어 커밋을 repository에 푸시할 때 웹을 deploy하도록 할 수 있다.
- Step
Job 안에서 순차적으로 실행되는 프로세스 단위.
step에서 명령을 내리거나, action을 실행할 수 있다.
- Action
Jop을 구성하기 위한 step들의 조합으로 구성된 독립적인 명령.
workflow의 가장 작은 빌드 단위이다.
- Runner
Github Action Runner 어플리케이션이 설치된 머신으로, Workflow가 실행될 인스턴스이다.
CI/CD
CI는 Continuous Integration(지속적인 통합)의 줄임말로, 빌드와 테스트를 자동화하는 프로세스이고,
CD는 Continuous Delivery(지속적인 전달) 또는 Continuous Deployment(지속적인 배포)의 줄임말로 배포를 자동화하는 프로세스이다.
CI가 새로운 소스코드의 빌드, 테스트, 병합까지를 의미한다면 CD는 프로덕션 환경까지 릴리즈 되는 것을 의미한다.
CI/CD를 통해 코드가 지속적으로 빌드 및 테스트 되므로 버그를 신속하게 발견하고 수정할 수 있고, 코드 변경 사항이 CI를 성공적으로 통과하면 프로덕션에 자동으로 배포되므로 신속하고 능률적으로 사용자에게 새로운 기능을 제공할 수 있다.
다음은 Flutter Web을 Github Action을 사용하여 deploy하는 과정이다.
1. 프로젝트의 root 폴더 하위에 .github/workflows 폴더를 생성하고 하위에 확장자를 yml로 하여 파일을 생성한다.
파일명은 상관없으니 임의로 설정한다.
2. yml 파일에 작성한 내용은 다음과 같다.
작업 목록의 버전이나 branches, flutter 버전, repository 이름, 시크릿 키 이름의 경우 상황에 맞게 수정하면 된다.
name: Deploy Flutter Web to GitHub Pages # yml script 이름
on:
push:
branches:
- main # main branch에 git push될 경우, 하단 jobs에 정의된 작업들 실행
jobs:
build-and-deploy:
runs-on: ubuntu-latest # 가장 최근의 ubuntu OS에서 작업 실행
steps:
# 작업 목록
- name: Checkout
uses: actions/checkout@v4.1.1 # code를 빌드 환경에 내려 받는다.
- name: Setup Flutter
uses: subosito/flutter-action@v2.12.0 # ubuntu에 flutter 사용 준비
with:
flutter-version: '3.19.2'
- name: Build Web
run: flutter build web --base-href=/${repository name}/ # --bash-href 명령어를 통해 repository 이름을 href로 변경하여 빌드
- name: Deploy to GitHub Pages
uses: peaceiris/actions-gh-pages@v4.0.0
with:
github_token: ${{ secrets.MY_SECRET_KEY_NAME }} # repository에서 사용할 시크릿 키 이름
publish_dir: build/web
3. github에서 public으로 repository를 생성한다.
repository 이름은 적절하게 설정하는 게 좋다. uri가 다음과 같은 형태로 생성되기 때문이다.
${github id}.github.io/${repository name}
4. https://github.com/settings/tokens에 접속하여 토큰을 생성한다.
우측 Generate new token 버튼을 클릭하고, classic으로 선택한다.
이때 Note, 즉 시크릿 키 이름을 yml 파일에서 지정했던 시크릿 키 이름과 동일하게 설정해야 한다.
위 예시의 경우 시크릿 키 이름(Note)을 MY_SECRET_KEY_NAME으로 설정해야 하고, 다른 이름을 사용하고자 한다면 yml 파일을 변경하면 된다.
scope는 repo와 workflow를 선택한다.
5. 생성된 토큰을 복사하고 4.에서 생성한 repository의 Settings 탭으로 이동한 뒤, 좌측 Security 메뉴의 Secrets and variables에서 Actions를 클릭한다.
6. 최하단 Repository secrets에서 New repository secret 버튼을 클릭하고, Name에는 시크릿 키 이름을, Secret에는 키값을 입력한다.
7. 코드를 push하고, github에서 해당 repository의 Actions 탭을 확인한다.
deploy된 링크를 클릭하여 본인이 구현한 웹 서비스가 정상적으로 호스팅 되었는지 확인한다.
이슈 및 해결방법
나의 경우 위 과정을 거친 이후 호스팅된 링크에 접속하면 repository의 readme 파일 내용이 노출되는 이슈가 있었고, 해결한 방법은 다음과 같다.
좌측 Code and automation 메뉴의 Pages를 클릭한다.
Branch를 gh-pages로 변경하고 save 버튼을 클릭한 뒤, 호스팅된 링크에 재접속하고, 만약 해결되지 않는다면 git에 한번 더 push를 시도해 보면 좋겠다.
'Flutter' 카테고리의 다른 글
| Flutter :: Dio 통신시 Formdata contentType 다르게 적용하기 (0) | 2024.04.15 |
|---|
