포트폴리오를 위한 깃허브 페이지: 로컬 테스트 환경 구성

이 과정은 우분투 리눅스를 기준으로 작성되었습니다. 윈도우 환경에서 리눅스를 사용하려는 경우에는 아래 포스트를 참고하세요. 윈도우에서 로컬 테스트 환경을 구성하는 것은 상당히 귀찮고 불편합니다.

• 포트폴리오를 위한 깃허브 페이지: WSL 개발 환경 구성

깃허브 페이지(GitHub Pages)는 몇 가지 플러그인을 포함한 지킬(Jekyll)을 사용하여 정적 웹페이지를 구성할 수 있습니다. 이 지킬은 루비(Ruby) 언어로 짜여진 템플릿 엔진이며, 템플릿을 구성하는 파일은 기존의 문서에 리퀴드(Liquid) 라는 템플릿 언어를 혼합하여 작성합니다.

환경 구성과정에서 설치한 모든 것을 다룰줄 알아야 할 필요는 없습니다. 특히 루비는 깃허브 페이지를 작성하면서 쓰이는 일이 없습니다.

우분투 업데이트 & 업그레이드

새로운 패키지를 설치하기 전에는 항상 새로운 패키지 목록을 갱신합니다. 필요하다면 업그레이드도 수행합니다.

(Bash) 패키지 목록 갱신:

sudo apt update

이후 apt list --upgradable명령으로 업그레이드 대상인 패키지 목록을 출력할 수 있습니다.

(Bash) 패키지 업그레이드:

sudo apt upgrade

Jekyll과 종속성 패키지 설치

깃허브 페이지(GitHub Pages)는 루비 기반의 정적 웹페이지 생성기인 지킬(Jekyll)의 특정 버전을 사용하고 있습니다.

• 깃허브 페이지 종속성 목록 문서

(Bash) 종속성 설치:

sudo apt-get install ruby-full build-essential zlib1g-dev

지킬 공식문서에는 루비의 패키지인 잼(Gem)의 위치를 변경해야 하는 이유와 변경하는 방법이 소개되어 있습니다. 다음 명령은 홈 디렉토리의 .bashrc 파일에 새로운 잼 경로릉 추가합니다.

(Bash) 루비 Gems 위치 재지정:

echo '# Install Ruby Gems to ~/gems' >> ~/.bashrc
echo 'export GEM_HOME="$HOME/gems"' >> ~/.bashrc
echo 'export PATH="$HOME/gems/bin:$PATH"' >> ~/.bashrc
source ~/.bashrc

루비의 잼 버전을 추적관리하는 번들러를 설치합니다.

gem install bundler

종속성 잼 설치

먼저 깃허브 페이지를 로컬에 복제합니다. 이미 만들어진 페이지가 없다면 깃허브 페이지에 나온 순서에 따라 페이지 저장소를 생성합니다.

git clone {페이지 저장소의 URL}

복제한 저장소의 이름으로 하위 디렉토리가 생성됩니다. cd {디렉토리 이름}으로 이동한 뒤 필요한 잼을 설치합니다. 디렉토리에 Gemfile이라는 이름으로 파일을 생성하고, 아래 내용을 입력한 후 저장합니다.

source "https://rubygems.org"
gem 'github-pages', group: :jekyll_plugins

유일하게 설치하는 github-pages 잼은 깃허브 페이지의 모든 종속성을 담고 있습니다.

테스트 페이지 접속

페이지 디렉토리에서 다음 명령을 실행합니다.

bundle exec jekyll serve

정상적으로 사이트 생성을 성공하면 웹 브라우저를 이용해 http://127.0.0.1:4000로 접속하여 페이지를 미리볼 수 있습니다. 만약 방화벽이나 기타등등의 문제로 사이트 생성은 정상적으로 끝마쳤지만 미리보기 페이지에 접속할 수 없는 경우가 있습니다. 그런 경우 호스트와 포트를 별도로 설정해서 해결할 수 있습니다.

bundle exec jekyll serve -H 0.0.0.0 -P 8080

이 명령은 미리보기 페이지의 URL을 http://localhost:8080로 변경합니다.