튜토리얼: 처음부터 GitLab Pages 웹사이트 만들기

Jekyll을 사용하여 처음부터 GitLab Pages 사이트를 만드는 단계별 튜토리얼입니다.

이 튜토리얼에서는 정적 사이트 생성기(SSG)인 Jekyll 로 Pages 사이트를 처음부터 만드는 방법을 설명합니다. 빈 프로젝트에서 시작해 러너 에 지시를 내리는 CI/CD 설정 파일을 직접 만듭니다. CI/CD 파이프라인 이 실행되면 Pages 사이트가 생성됩니다. 이 예시는 Jekyll을 사용하지만 다른 SSG도 비슷한 단계를 따릅니다. 이 튜토리얼을 진행하는 데 Jekyll 이나 SSG에 익숙할 필요는 없습니다. Note 순수 HTML로 Pages 사이트를 만들려면 CI/CD 템플릿으로 GitLab Pages 웹사이트 만들기 튜토리얼을 참고합니다. 사용할 수 있는 템플릿 목록은 프로젝트 템플릿 에서 확인합니다. GitLab Pages 웹사이트를 만드는 순서는 다음과 같습니다. 1단계: 프로젝트 파일 생성 2단계: Docker 이미지 선택 3단계: Jekyll 설치 4단계: 출력용 public 디렉터리 지정 5단계: 아티팩트용 public 디렉터리 지정 6단계: 웹사이트 배포 및 확인 시작하기 전에 # GitLab에 빈 프로젝트 가 있어야 합니다. 프로젝트 파일 생성 # 루트(최상위) 디렉터리에 파일 3개를 만듭니다. .gitlab-ci.yml : 실행할 명령을 담는 YAML 파일입니다. 지금은 파일 내용을 비워 둡니다. index.html : 원하는 HTML 콘텐츠를 채워 넣을 수 있는 비어 있지 않은 HTML 파일입니다. 예를 들면 다음과 같습니다. < html > < head > < title > Home </ title > </ head > < body > < h1 > Hello World! </ h1 > </ body > </ html > Gemfile : Ruby 프로그램의 의존성을 기술하는 파일입니다. 다음 내용을 채워 넣습니다. source "https://rubygems.org" gem "jekyll" Docker 이미지 선택 # 이 예시에서 러너는 Docker 이미지 로 스크립트를 실행하고 사이트를 배포합니다. 여기서 사용하는 Ruby 이미지는 DockerHub 에서 관리됩니다. .gitlab-ci.yml 파일 맨 앞에 다음 CI/CD 설정을 추가해 파이프라인의 기본 이미지를 지정합니다. default: image: ruby:3.2 빌드에 NodeJS 가 필요한 SSG 라면 파일 시스템에 NodeJS가 포함된 이미지를 지정해야 합니다. 예를 들어 Hexo 사이트에서는 image: node:12.17.0 을 사용할 수 있습니다. Jekyll 설치 # Jekyll 을 로컬에서 실행하려면 먼저 설치해야 합니다. 터미널을 엽니다. gem install bundler 를 실행해 Bundler 를 설치합니다. bundle install 을 실행해 Gemfile.lock 을 만듭니다. bundle exec jekyll build 를 실행해 Jekyll을 설치합니다. 프로젝트에서 Jekyll을 실행하려면 .gitlab-ci.yml 파일을