- 전제 조건
- Docusaurus 파일을 보관할 프로젝트 생성
- 초기 CI/CD 구성 파일 생성
- 사이트를 빌드하는 작업 추가
- 사이트를 배포하는 작업 추가
- 테스트 작업 추가
- 병합 요청 파이프라인 사용 시작하기
- 중복된 구성 줄이기
튜토리얼: 복잡한 파이프라인 생성
이 튜토리얼에서는 단계적으로 복잡한 CI/CD 파이프라인을 구성하는 방법을 안내합니다. 파이프라인은 항상 완전히 기능적이지만 각 단계마다 더 많은 기능을 얻습니다. 목표는 문서 사이트를 빌드, 테스트 및 배포하는 것입니다.
이 튜토리얼을 완료하면 GitLab.com에 새 프로젝트가 생성되며 Docusaurus를 사용하여 작동하는 문서 사이트가 생성됩니다.
이 튜토리얼을 완료하려면 다음을 수행해야 합니다:
- Docusaurus 파일을 보관할 프로젝트 생성
- 초기 파이프라인 구성 파일 생성
- 사이트를 빌드하는 작업 추가
- 사이트를 배포하는 작업 추가
- 테스트 작업 추가
- 병합 요청 파이프라인 사용
- 중복 구성 감소
전제 조건
- GitLab.com의 계정이 필요합니다.
- Git에 익숙해야 합니다.
- 로컬 머신에 Node.js가 설치되어 있어야 합니다. 예를 들어 macOS의 경우
brew install node
를 사용하여 Node.js를 설치할 수 있습니다.
Docusaurus 파일을 보관할 프로젝트 생성
파이프라인 구성을 추가하기 전에 먼저 GitLab.com에 Docusaurus 프로젝트를 설정해야 합니다:
- 사용자 이름(그룹이 아님) 아래에 새 프로젝트를 생성합니다:
- 왼쪽 사이드바에서 맨 위에 있는 만들기()를 선택한 다음 새 프로젝트/저장소 만들기를 선택합니다.
- 빈 프로젝트 만들기를 선택합니다.
- 프로젝트 세부 정보를 입력합니다:
-
프로젝트 이름 필드에 프로젝트 이름을 입력합니다. 예:
내 파이프라인 튜토리얼 프로젝트
. - README로 리포지토리 초기화를 선택합니다.
-
프로젝트 이름 필드에 프로젝트 이름을 입력합니다. 예:
- 프로젝트 생성을 선택합니다.
-
프로젝트 개요 페이지에서 오른쪽 상단에 있는 코드를 선택하여 프로젝트의 클론 경로를 찾습니다. SSH 또는 HTTP 경로를 복사하여 로컬에서 프로젝트를 클론하는 데 사용합니다.
예를 들어 컴퓨터의
pipeline-tutorial
디렉터리로 SSH로 클론하려면 다음과 같이 입력합니다:git clone git@gitlab.com:내-사용자명/내-파이프라인-튜토리얼-프로젝트.git pipeline-tutorial
-
프로젝트 디렉터리로 이동한 다음 새 Docusaurus 사이트를 생성합니다:
cd pipeline-tutorial npm init docusaurus
Docusaurus 초기화 마법사에서 사이트에 대한 질문에 응답해야 합니다. 모두 기본 옵션을 사용합니다.
-
초기화 마법사는 사이트를
website/
에 설정하지만 사이트는 프로젝트의 루트에 있어야 합니다. 파일을 루트로 이동하고 구식 디렉터리를 삭제합니다.mv website/* . rm -r website
-
docusaurus.config.js
파일에서 GitLab 프로젝트의 세부 정보로 Docusaurus 구성 파일을 업데이트합니다.-
url:
을 다음 형식의 경로로 설정합니다:https://<내-사용자명>.gitlab.io/
. -
baseUrl:
를 프로젝트 이름으로 설정합니다. 예:/내-파이프라인-튜토리얼-프로젝트/
.
-
-
변경 사항을 커밋하고 GitLab에 푸시합니다:
git add . git commit -m "간단한 생성된 Docusaurus 사이트 추가" git push origin
초기 CI/CD 구성 파일 생성
프로젝트에서 CI/CD가 활성화되어 있고 실행자가 작업을 실행할 수 있는지 확인하려면 가능한 가장 간단한 파이프라인 구성 파일로 시작합니다.
이 단계에서는 다음을 소개합니다:
- 작업: 파이프라인의 독립적인 부분으로 명령을 실행합니다. 작업은 GitLab 인스턴스와 별도로 실행자에서 실행됩니다.
-
script
: 작업구성의 이 부분은 명령을 정의하는 곳입니다. 여러 명령(배열)이 있는 경우 각 명령이 순서대로 실행됩니다. 각 명령은 CLI 명령으로 실행됩니다. 기본적으로 명령이 실패하거나 오류가 발생하면 작업은 실패로 표시되고 더 이상 명령이 실행되지 않습니다.
이 단계에서 프로젝트의 루트에 .gitlab-ci.yml
파일을 만들어 다음 구성을 추가합니다:
test-job:
script:
- echo "이것은 내 첫 번째 작업입니다!"
- date
이 변경 사항을 GitLab에 커밋하고 푸시한 다음:
- 빌드 > 파이프라인로 이동하여 GitLab에서 이 단일 작업을 실행하는지 확인합니다.
- 파이프라인을 선택한 다음 작업을 선택하여 작업 로그를 보고
이것은 내 첫 번째 작업입니다!
메시지 다음에 날짜가 표시되는지 확인합니다.
지금 프로젝트에 .gitlab-ci.yml
파일이 있으므로 향후 모든 변경을 파이프라인 에디터를 사용하여 파이프라인 구성 파일에 추가할 수 있습니다.
사이트를 빌드하는 작업 추가
CI/CD 파이프라인의 일반적인 작업은 프로젝트의 코드를 빌드한 다음 배포하는 것입니다. 먼저 사이트를 빌드하는 작업을 추가합니다.
이 단계에서 다음을 소개합니다:
-
image
: 실행자에게 작업을 실행할 Docker 컨테이너를 알립니다. 실행자는:- 컨테이너 이미지를 다운로드하고 시작합니다.
- GitLab 프로젝트를 실행 중인 컨테이너에 복제합니다.
- 명령을 실행합니다.
-
artifacts
: 작업은 독립적이며 서로 공유되지 않습니다. 한 작업에서 생성된 파일을 다른 작업에서 사용하려면 먼저 artifacts로 저장해야 합니다. 그런 다음 나중 작업에서 artifacts를 검색하고 생성된 파일을 사용할 수 있습니다.
이 단계에서 test-job
을 build-job
으로 대체합니다:
-
image
을 사용하여 최신node
이미지로 작업을 구성합니다. Docusaurus는 Node.js 프로젝트이며node
이미지에 필요한npm
명령이 내장되어 있습니다. -
npm install
을 실행하여 Docusaurus를 실행 중인node
컨테이너에 설치한 다음npm run build
를 실행하여 사이트를 빌드합니다. - Docusaurus는 빌드된 사이트를
build/
에 저장하므로 이 파일을artifacts
로 저장합니다.
build-job:
image: node
script:
- npm install
- npm run build
artifacts:
paths:
- "build/"
파이프라인 에디터를 사용하여 이 파이프라인 구성을 기본 브랜치로 커밋하고 작업 로그를 확인합니다. 여러분은:
-
npm
명령이 실행되어 사이트가 빌드되는 것을 볼 수 있습니다. - 아티팩트가 최종적으로 저장된 것을 확인할 수 있습니다.
- 작업이 완료된 후 작업 로그 오른쪽의 탐색을 선택하여 아티팩트 파일 내용을 확인할 수 있습니다.
사이트를 배포하는 작업 추가
build-job
에서 Docusaurus 사이트가 빌드되는 것을 확인한 후에 배포하는 작업을 추가할 수 있습니다.
이 단계에서는 다음을 소개합니다:
-
stage
및stages
: 가장 일반적인 파이프라인 구성은 작업을 단계로 그룹화합니다. 동일한 단계에 속한 작업은 병렬로 실행될 수 있으며, 나중 단계의 작업은 이전 단계의 작업이 완료될 때까지 대기합니다. 작업이 실패하면 전체 단계가 실패로 간주되어 나중 단계의 작업이 실행되지 않습니다. - GitLab Pages: 정적 사이트를 호스팅하기 위해 GitLab Pages를 사용할 것입니다.
이 단계에서:
- 빌드된 사이트를 가져와 배포하는 작업을 추가합니다. GitLab Pages를 사용할 때,
작업의 이름은 항상
pages
입니다.build-job
에서 생성된 아티팩트가 자동으로 작업으로 추출되고, Pages는 사이트를public/
디렉터리에서 찾습니다. 따라서 사이트를 해당 디렉터리로 이동하는script
명령을 추가합니다. -
stages
섹션을 추가하고 각 작업에 대한 단계를 정의합니다.build-job
이 먼저build
단계에서 실행되고, 그 다음에pages
가deploy
단계에서 실행됩니다.
stages: # 작업 및 실행 순서에 대한 단계 목록
- build
- deploy
build-job:
stage: build # 이 작업을 `build` 단계에서 실행하도록 설정
image: node
script:
- npm install
- npm run build
artifacts:
paths:
- "build/"
pages:
stage: deploy # 이 새로운 작업을 `deploy` 단계에서 실행하도록 설정
script:
- mv build/ public/
artifacts:
paths:
- "public/"
파이프라인 편집기를 사용하여 이 파이프라인 구성을 기본 브랜치에 커밋하고, Pipelines 목록에서 파이프라인 세부 정보를 확인합니다. 다음을 검증합니다:
- 두 작업이 각각
build
및deploy
단계에서 실행됩니다. -
pages
작업이 완료되면pages:deploy
작업이 나타나는데, 이는 Pages 사이트를 배포하는 GitLab 프로세스입니다. 해당 작업이 완료되면 새로운 Docusaurus 사이트를 확인할 수 있습니다.
사이트를 보려면:
- 왼쪽 사이드바에서 Deploy > Pages를 선택합니다.
- Use unique domain이 꺼져 있는지 확인합니다.
-
Access pages에서 링크를 선택합니다. URL 형식은 다음과 유사해야 합니다:
https://<my-username>.gitlab.io/<project-name>
. 자세한 내용은 GitLab Pages default domain names를 참조하세요.
참고:
사용자 고유 도메인 사용이 필요한 경우, docusaurus.config.js
에서 baseUrl
을 /
로 설정합니다.
테스트 작업 추가
이제 사이트가 예상대로 빌드되고 배포되므로 테스트 및 린팅을 추가할 수 있습니다. 예를 들어, 루비 프로젝트는 RSpec 테스트 작업을 실행할 수 있습니다. Docusaurus는 Markdown과 생성된 HTML을 사용하는 정적 사이트이므로, 본 자습서는 Markdown 및 HTML을 테스트하기 위해 작업을 추가합니다.
이 단계에서는 다음을 소개합니다:
-
allow_failure
: 때로는 실패하는 작업은 생산성을 저하시키거나 문제 해결하기 어려울 수 있습니다.allow_failure
를 사용하여 작업이 실패해도 파이프라인 실행을 중단하지 않도록 설정합니다. -
dependencies
:dependencies
를 사용하여 개별 작업에서 아티팩트 다운로드를 제어합니다. 다른 단계의 모든 작업에서 아티팩트를 기본적으로 가져오지만, 나중에 파이프라인이 변경되더라도 다른 아티팩트를 실수로 다운로드하지 않도록dependencies:
를 추가합니다.
이 단계에서:
-
build
와deploy
사이에 실행되는 새로운test
단계를 추가합니다. 이 세 단계는 구성에서stages
가 정의되지 않은 경우의 기본 단계입니다. -
markdownlint를 실행하고 프로젝트의 Markdown을 확인하는
lint-markdown
작업을 추가합니다.- Docusaurus가 생성한 샘플 Markdown 파일은
blog/
및docs/
에 있습니다. - 이 도구는 원본 Markdown 파일에만 스캔하며,
build-job
아티팩트에 저장된 생성된 HTML이 필요하지 않습니다.dependencies: []
로 작업을 가속화합니다. - 일부 샘플 Markdown 파일은 기본 markdownlint 규칙을 위반하지만,
allow_failure: true
를 추가하여 규칙 위반으로 인해 파이프라인이 중단되지 않도록 합니다.
- Docusaurus가 생성한 샘플 Markdown 파일은
-
HTMLHint를 실행하고 생성된 HTML을 확인하는
test-html
작업을 추가합니다. -
test-html
와pages
는build-job
아티팩트를 필요로 합니다. 작업은 기본적으로 이전 단계의 모든 작업에서 아티팩트를 가져오지만,dependencies:
를 추가하여 미래의 파이프라인 변경 후에도 다른 아티팩트를 실수로 다운로드하지 않도록 합니다.
stages:
- build
- test # 테스트 작업을 위한 `test` 단계를 추가
- deploy
build-job:
stage: build
image: node
script:
- npm install
- npm run build
artifacts:
paths:
- "build/"
lint-markdown:
stage: test
image: node
dependencies: [] # 아티팩트를 가져오지 않음
script:
- npm install markdownlint-cli2 --global # 컨테이너에 markdownlint를 설치
- markdownlint-cli2 -v # 디버깅에 유용한 버전 확인
- markdownlint-cli2 "blog/**/*.md" "docs/**/*.md" # blog/ 및 docs/의 모든 markdown 파일 확인
allow_failure: true # 현재 이 작업은 실패하지만 파이프라인을 중단시키지 않습니다.
test-html:
stage: test
image: node
dependencies:
- build-job # `build-job`에서만 아티팩트를 가져옴
script:
- npm install --save-dev htmlhint # 컨테이너에 HTMLHint를 설치
- npx htmlhint --version # 디버깅에 유용한 버전 확인
- npx htmlhint build/ # blog/ 및 docs/의 모든 markdown 파일 확인
pages:
stage: deploy
dependencies:
- build-job # `build-job`에서만 아티팩트를 가져옴
script:
- mv build/ public/
artifacts:
paths:
- "public/"
기본 브랜치에이 파이프라인 구성을 커밋하고, 파이프라인 세부 정보를 확인합니다.
-
lint-markdown
작업이 샘플 Markdown이 기본 markdownlint 규칙을 위반하므로 실패합니다. 그러나allow_failure
로 실패가 허용됩니다. 다음을 할 수 있습니다:- 일부 규칙 위반을 일단 무시합니다. 이들은 자습서의 일부로 고쳐질 필요가 없습니다.
- Markdown 파일 위반을 수정합니다. 그럼
allow_failure
를false
로 변경하거나,allow_failure
를 아예 제거합니다. 왜냐하면allow_failure: false
가 정의되지 않은 경우 기본 동작이기 때문입니다. - markdownlint 설정 파일을 추가하여 경고를 발생시킬 규칙을 제한할 수 있습니다.
- 또한 Markdown 파일 내용을 변경하고 다음 배포 후 사이트 변경 사항을 볼 수 있습니다.
병합 요청 파이프라인 사용 시작하기
위의 파이프라인 구성을 사용하면 사이트가 성공적으로 파이프라인이 완료될 때마다
배포되지만, 이는 이상적인 개발 워크플로우가 아닙니다.
기능 브랜치 및 병합 요청에서 작업하고, 변경 내용이 기본 브랜치로 병합될 때에만
사이트를 배포하는 것이 더 좋습니다.
이 단계에서는 다음을 소개합니다:
-
rules
: 각 작업에 규칙을 추가하여 해당 파이프라인에서 실행되는지를 구성합니다. 병합 요청 파이프라인, 예약된 파이프라인, 또는 다른 특정한 상황에 작업을 설정할 수 있습니다. 규칙은 위에서 아래로 평가되며, 규칙이 일치하면 작업이 파이프라인에 추가됩니다. -
CI/CD 변수: 구성 파일 및 스크립트 명령어에서
작업 동작을 구성하는 데 이러한 환경 변수를 사용합니다.
미리 정의된 CI/CD 변수는 일반적으로
$CI_
로 접두어가 붙어 있으며, 수동으로 정의할 필요가 없는 변수입니다. 이러한 변수는 자동으로 파이프라인에 주입되므로 파이프라인을 구성하는 데 사용할 수 있습니다. 변수는 보통$변수_이름
과 같이 형식화됩니다.
이 단계에서는:
- 새 기능 브랜치를 만들고 기본 브랜치가 아닌 브랜치에서 변경 사항을 만듭니다.
- 각 작업에
rules
를 추가합니다:- 사이트는 기본 브랜치의 변경 사항에 대해서만 배포되어야 합니다.
- 다른 작업들은 병합 요청이나 기본 브랜치의 모든 변경에 대해 실행되어야 합니다.
- 이 파이프라인 구성을 사용하면 작업을 실행하지 않고 기능 브랜치에서 작업할 수 있으며, 이는 자원을 절약합니다. 변경 사항을 검증할 준비가 되면 병합 요청을 만들고, 병합 요청에서 실행할 작업이 구성된 파이프라인이 실행됩니다.
- 병합 요청이 승인되고 변경 사항이 기본 브랜치로 병합되면, 새로운 파이프라인이 실행되며 이는
pages
배포 작업도 포함합니다. 작업이 실패하지 않는다면 사이트가 배포됩니다.
stages:
- build
- test
- deploy
build-job:
stage: build
image: node
script:
- npm install
- npm run build
artifacts:
paths:
- "build/"
rules:
- if: $CI_PIPELINE_SOURCE == 'merge_request_event' # 모든 병합 요청 소스 브랜치 변경 사항에 대해 실행
- if: $CI_COMMIT_BRANCH == $CI_DEFAULT_BRANCH # 기본 브랜치 변경 사항에 대해 실행
lint-markdown:
stage: test
image: node
dependencies: []
script:
- npm install markdownlint-cli2 --global
- markdownlint-cli2 -v
- markdownlint-cli2 "blog/**/*.md" "docs/**/*.md"
allow_failure: true
rules:
- if: $CI_PIPELINE_SOURCE == 'merge_request_event' # 모든 병합 요청 소스 브랜치 변경 사항에 대해 실행
- if: $CI_COMMIT_BRANCH == $CI_DEFAULT_BRANCH # 기본 브랜치 변경 사항에 대해 실행
test-html:
stage: test
image: node
dependencies:
- build-job
script:
- npm install --save-dev htmlhint
- npx htmlhint --version
- npx htmlhint build/
rules:
- if: $CI_PIPELINE_SOURCE == 'merge_request_event' # 모든 병합 요청 소스 브랜치 변경 사항에 대해 실행
- if: $CI_COMMIT_BRANCH == $CI_DEFAULT_BRANCH # 기본 브랜치 변경 사항에 대해 실행
pages:
stage: deploy
image: busybox # 기본 `node` 이미지가 필요하지 않은 `pages` 배포 작업
dependencies:
- build-job
script:
- mv build/ public/
artifacts:
paths:
- "public/"
rules:
- if: $CI_COMMIT_BRANCH == $CI_DEFAULT_BRANCH # 기본 브랜치 변경 사항에 대해 실행
병합 요청에서 변경 사항을 커밋하여 기본 브랜치를 업데이트합니다. 새로운 파이프라인이
사이트를 배포하는 pages
작업을 포함하는지 확인합니다.
앞으로 파이프라인 구성 변경에는 기능 브랜치 및 병합 요청을 사용하세요. Git 태그를 만들거나 파이프라인 일정을 추가하는 것과 같은 다른 프로젝트 변경 사항은 규칙을 추가하지 않는 이상 파이프라인을 트리거시키지 않습니다.
중복된 구성 줄이기
파이프라인은 이제 모든 작업이 동일한 rules
및 image
구성을 가지고 있습니다.
이러한 규칙을 반복하는 대신 extends
및 default
를 사용하여 단일 참 소스를 만드세요.
이 단계에서는 다음을 소개합니다:
-
숨겨진 작업:
.
로 시작하는 작업은 파이프라인에 추가되지 않습니다. 재사용하고 싶은 구성을 보유하는 데 사용합니다. -
extends
: 여러 위치에서 구성을 반복하여 사용하기 위해 extends를 사용합니다. 숨겨진 작업에서 구성을 업데이트하면, 숨겨진 작업을 확장하는 모든 작업은 업데이트된 구성을 사용합니다. -
default
: 정의되지 않은 경우 모든 작업에 적용되는 기본 키워드를 설정합니다. - YAML 재정의:
extends
또는default
로 구성을 재사용할 때 작업에서 명시적으로 키워드를 재정의할 수 있습니다.
이 단계에서는:
-
build-job
,lint-markdown
,test-html
작업에서 반복되는 규칙을 보관할.standard-rules
숨겨진 작업을 추가합니다. -
extends
를 사용하여 세 작업에서.standard-rules
구성을 재사용합니다. -
default
섹션을 추가하여image
의 기본값을node
로 정의합니다. -
pages
배포 작업은 기본node
이미지가 필요하지 않으므로 명확하게busybox
를 사용합니다.
stages:
- build
- test
- deploy
default: # `image` 키워드의 기본값을 정의하는 default 섹션 추가
image: node
.standard-rules: # 일반적인 규칙을 보유하는 숨겨진 작업 추가
rules:
- if: $CI_PIPELINE_SOURCE == 'merge_request_event'
- if: $CI_COMMIT_BRANCH == $CI_DEFAULT_BRANCH
build-job:
extends:
- .standard-rules # `.standard-rules`에서 구성 재사용
stage: build
script:
- npm install
- npm run build
artifacts:
paths:
- "build/"
lint-markdown:
stage: test
extends:
- .standard-rules # `.standard-rules`에서 구성 재사용
dependencies: []
script:
- npm install markdownlint-cli2 --global
- markdownlint-cli2 -v
- markdownlint-cli2 "blog/**/*.md" "docs/**/*.md"
allow_failure: true
test-html:
stage: test
extends:
- .standard-rules # `.standard-rules`에서 구성 재사용
dependencies:
- build-job
script:
- npm install --save-dev htmlhint
- npx htmlhint --version
- npx htmlhint build/
pages:
stage: deploy
image: busybox # 기본 `node` 이미지의 기본값을 명시적으로 재정의하여 `busybox`를 사용합니다
dependencies:
- build-job
script:
- mv build/ public/
artifacts:
paths:
- "public/"
rules:
- if: $CI_COMMIT_BRANCH == $CI_DEFAULT_BRANCH
이 파이프라인 구성을 기본 브랜치에 커밋하는 병합 요청을 사용합니다. 파일이 간소화되었지만, 이전 단계와 동일한 동작을 수행해야 합니다.
여러분은 방금 전체 파이프라인을 만들고 효율적으로 최적화했습니다. 잘 했어요! 이제 이 지식을 활용하여 [.gitlab-ci.yml] 키워드의 나머지를 알아보고 자체적인 파이프라인을 구축할 수 있습니다.