Minimal Mistakes theme 기반 깃허브 페이지 블로그 개설하기

0. 개설하기 전에…

개인적으로 블로그를 하나 운영하고 싶어서 네이버 블로그, 티스토리, 카카오 페이지 등등 유명 플랫폼들을 살펴봤는데, 티스토리는 초대장 받기가 힘드네요. 가능하면 마크다운 (Markdown) 기반으로 수식도 추가해가면서 깔끔하게 포스팅 하고싶었는데, 카카오 같은 경우는 마크다운 방식으로 돌아가긴 하지만 수식 넣는것도 힘든 것 같고 작가 등록이 필요합니다.

대체할만한 것을 찾기위해 웹서핑을 해본 결과, 깃허브(GitHub)와 지킬 (Jekyll)을 활용해서 쉽게 블로그 생성이 가능하다는 소식을 듣고 블로그를 한번 만들어 보았습니다. 생각보다 쉽게 만들지는 못했던 것 같아서, 블로그 생성 및 구성 과정에 대해 쉬운 것부터 하나하나 포스팅 해 가려고 합니다.

1. 마크다운 (Markdown)이란?

마크다운은 문서 양식을 편집하는 문법이라고 합니다. 그래서 글쓸때 한글처럼 블록 지정해서 글자 크기, 글자 색, 문단 등을 설정하는게 아니라, 정해진 코드와 함께 글을 쓰면 그에 해당하는 양식으로 자동적으로 변환됩니다. 그래서 문서 양식 설정하는데 크게 집중하지 않아도 깔끔하게 글을 쓸 수 있습니다. 간단한 마크다운 문법의 예는 다음과 같습니다.

문법 예시 실행 결과
# 제목 #제목
* 기울기 * 기울기
** 강조 ** 강조
` 코드 작성 ` 코드 작성

2. 지킬 (Jekyll)이란?

지킬은 정적 사이트 생성기라고 하는데, 사실 이쪽 분야의 일을 하지 않아서 정확하게 어떻게 동작하는 건지는 잘 모릅니다. 대충 블로그를 한번 만들어보니, 마크다운 문법을 통해 확장자가 (.md)인 포스트를 작성하면, 포스트 맨 앞부분에 위치한 YAML 헤더에 따라서 html 파일들이 생성되고 블로그를 자동적으로 구성해주는 프로그램인 것 같네요. 덕분에 마크다운으로 글만 잘 작성하면 쉽고 깔끔하게 포스팅이 되는 것 같습니다.

3. 깃허브 (Github)란??

전문 개발자는 아니지만 대학원에 다니면서 깃허브의 존재는 어렴풋이나마 알고있었는데, 실제로 활용을 할 기회가 별로 없었습니다. 어떤 프로젝트를 위한 코드나 문서를 작성하다보면 이것저것 수정을 하게되는데 수정할때마다 생성되는 다양한 버전의 파일들을 관리하는게 꽤나 번거로운 일입니다. 깃(Git) 이러한 문제를 해결하기위한 분산 버전 관리 툴인데, 깃허브(GitHub)는 깃(Git)을 사용하는 프로젝트들을 웹에 저장하는 웹 호스팅 서비스라고합니다.

그런데 깃허브에서는 깃허브 페이지 (GitHub Pages) 서비스를 통해서 지킬 기반의 개인 사이트를 무료로 지원합니다. (일인단 한개 사이트) 결국 지킬이라는 사이트 생성기를 통해 만든 개인 블로그를 깃허브를 통해서 호스팅하여 블로그를 운영하는 것입니다.

4. 블로그 생성하기

블로그를 생성하기 위해서 가장 먼저해야 하는 일은 깃허브에 가입하는 것입니다. 가입이 완료되면 지킬 테마 모음 사이트에 가셔서 맘에드는 테마를 고르시면 됩니다. 지금 이 블로그는 Minimal Mistakes 테마를 기준으로 작성되었는데, 테마 선택 페이지에 들어가서 홈 페이지로 들어가시면 해당 테마의 깃허브 저장소가 뜹니다.

alt
깃허브 테마 소개 페이지

해당 테마 깃허브 페이지 위 쪽을 잘 살펴보면, 포크 (Fork) 버튼이 있는데, 깃허브 로그인 한 상태에서 포크를 누르면 해당 테마의 파일들을 나의 깃허브 저장소로 복사를 하게됩니다.

이제 해당 테마를 포크한 나의 깃허브 저장소 (repository)로 이동합니다. 들어가보면 화면 상단에 설정 (Setting) 탭이 있는데, 이걸 클릭해서 들어가보면 이제 최상단에 Repository name 설정하는 부분이 나옵니다.

alt
깃허브 저장소의 설정 탭을 클릭한다.

원래대로라면 포크된 저장소 이름이 아래의 스크린샷처럼 테마 이름과 같게 되어있습니다.

alt
깃허브 페이지를 통해 블로그를 생성하기 위해서 repository 이름 변경은 필수적이다.

깃허브 페이지 서비스를 이용하기 위해서는 이제 해당 저장소의 이름을 다음과 같이 변경해주시면 됩니다.

깃 허브 계정.github.io

Rename을 눌러서 설정 변경하고 정상적으로 진행되는 경우 설정 페이지 아래쪽으로 스크롤을 내려보시면 Github pages가 활성화 되었다고 초록색으로 뜹니다.

alt
깃허브 페이지 활성화

정상적으로 진행이 되었으면, 해당 주소 (깃허브 계정.github.io)로 접속을 하게되면 해당 테마 페이지의 기본 설정으로 블로그 개설이 됩니다. 해당 블로그의 기본적인 설정은 _config.yml 파일에서 정의가 되는데 제가 사용하는 Minimal Mistakes 테마에서는 다음과 같이 기본적인 정보를 설정하게 됩니다.

깃허브에서 _config.yml 파일을 열어서 블로그 세팅에 필요한 다음의 내용들을 개인 정보에 맞게 편집 후 저장합니다.

# Site Settings
locale                   : "ko"
title                    : "제목"
title_separator          : "-"
name                     : "이름"
description              : "블로그 설명"
url                      : https:// 깃허브 계정.github.io
# the base hostname & protocol for your site e.g."https://mmistakes.github.io"
baseurl                  : # the subpath of your site, e.g. "/blog"
repository               : 깃허브 계정/깃허브 계정.github.io
# GitHub username/repo-name e.g. "mmistakes/minimal-mistakes"
~~~~~~~~~~~~~~~~~~
# Site Author
author:
  name             : "내 이름"
  avatar           : # path of avatar image, e.g. "/assets/images/bio-photo.jpg"
  bio              : "안녕하세요."
  location         : "Somewhere"

잠시 후에 다시 본인의 깃허브 블로그 주소 (깃허브 계정.github.io)로 접속을 하면 수정 내용이 반영된 아래의 결과가 나오게됩니다.

alt
블로그 생성 결과

5. 요약

지금까지 깃허브와 지킬을 이용해서 제일 기본적인 형태의 블로그를 구성하는 과정에 대해 살펴보았습니다. 결과적으로 블로그를 생성하는 과정은 크게 다음의 3가지 단계를 거치면됩니다.

  1. 깃허브 (GitHub) 가입하기
  2. 원하는 블로그 테마 포크하기
  3. 저장소 (Repository) 이름 변경 및 _conf.yml 파일 수정하기

P.S. 추가적으로 깃허브 저장소에서 직접적으로 코드를 수정하지 않고 개인 컴퓨터로 블로그 구성 변경 등 이것저것 테스트를 하고싶다면 다음의 과정을 거쳐 블로그를 로컬하게 돌려보면됩니다.

  1. 루비 (Ruby)를 설치한다.
  2. 지킬 (Jekyll)을 설치한다.
  3. 깃허브 블로그 폴더를 복사한다.
  4. 복사본에서 이것저것 수정.
  5. 해당 폴더에서 지킬을 실행, 로컬호스트로 접속 후 수정 결과 확인.
  6. 수정 결과 반영하고 싶다면 Git을 통해 업로드.

댓글남기기