jekyll - September 01, 2020 · 3 mins read

무료 깃허브 블로그 시작하기 - GitHub Pages with Jekyll

무료 깃허브 블로그 시작하기 - GitHub Pages with Jekyll

깃허브 페이지와 지킬을 이용하여 무료로 나만의 깔끔한 블로그 사이트를 만들어 보자. 먼저, 깃허브 페이지를 이용해 아주 간단한 웹 호스팅 서버를 만들어 보자.

심플 웹호스팅 깃허브 페이지

말이 필요없다. 그냥 아래 그림대로 따라하면 금방 웹호스팅 받지않고도 쉽게 자기만의 웹호스팅 서버를 만들어 낼 수 있다. 당연히 https 도 지원해 준다. 따로 인증서를 발급받지 않아도 되니 엄~~~~~~청 편리한 서비스다. 깃허브 페이지

  • 일단 빈 저장소를 GitHub 에서 생성한다. 그냥 기본 생성되는 README.md 파일에 원하는 글자를 써 본다. 다음, Settings 를 눌러 설정 창으로 들어 간다. 들어가서 깃허브 페이지를 활성화 할 것이다. 깃허브 저장소 생성

  • 쭉 내려가다 보면 GitHub Pages 라는 설정 공간이 있다. 여기서 Source 를 master 브랜치로 지정한다. 깃허브 페이지 소스 선택

  • 그제서야 나타나는 Save 버튼을 누르면 깃허브 페이지 설정 완료!! 넘 간단. 깃허브 페이지 설정

  • 이제 생성된 자신의 깃허브 페이지 주소를 볼 수 있다. 여기로 접속하면 된다. 깃허브 주소 생성

  • 접속해보니, 저장소에 있던 README.md 파일이 웹 호스팅 된 것 처럼 떡하니 나타남!! 완성~~~~ 완성된 깃허브 페이지

이젠 간단한 HTML 문서나 md 파일은 그냥 쉽게 웹호스팅 할 수 있게 되었다. 여기 저장소에 막 적어넣고 손수 적어놓은 파일명을 주소뒤에 붙여 쓰면 그냥 웹으로 접근할 수 있다.

그래도 블로그 플랫폼 처럼 보이려면 지킬 정도는 설치해 줘야 한다. 지킬은 깃허브 페이지가 지원하는 정적 사이트 생성기인데, 조금 사이트 처럼 만드려면 이 정도는 해 줘야 블로그 글 올리기 정도를 할 수 있다. 이제 지킬을 올려보자. 설치라기 보다는 복사 정도의 일이라고 보면 된다. (안바꾸고 그대로 쓴다면 ^^;;;)

깃허브 페이지 지킬 블로그 만들기

현재 레포에 있는 파일을 다운받아서 1개의 파일 정도만 수정하고 아까 자신이 만든 저장소에 올리기만 하면 된다. 아차차!!! 하나더 꼭 _posts 디렉토리 밑에 있는 샘플 글들은 참고만 하고 싹다 지우고 자신의 글로 채우세요 ^^

방문할 페이지는 여기 - https://github.com/bjnhur/jekyll 여기 지킬베이스는 지킬 + Clean 테마 (부트스트랩 포함) 를 활용하여 만들었습니다.

  • Clean Blog - A fully functional version of Start Bootstrap’s Clean Blog theme adapted for Jekyll - a static site generator

지킬베이스 업로드

  • 수정할 파일은 _config.yml 이다. 자신의 정보로 잘 수정 하도록 하자.
  • _config.yml 을 열고 자신의 공간에 맞게 8개만 수정하자. (깃허브 페이지가 공개되어 있지만, 찝찝해 몇개는 모자이크 처리 ㅜㅜ)
  • 3번의 baseurl 은 자신의 저장소 이름이 되겠다. 앞에 / 가 붙어 있는 거 주의하시고…
  • 8번의 repo_edit_url 은 “자신의 github 주소/저장소주소/edit/master” 이렇게 적으면 된다. (우리는 master 브랜치 내용이 그대로 GitHub Pages로 올라가기 때문에. 만약 다른 브랜치를 썼다면 그 브랜치 이름을 쓰면 된다) 지킬베이스 _config.yml 수정

깃허브 페이지 지킬 블로그 완성!

이제 아까 setting 에서 본 사이트 주소를 들어가면 엄청 잘 꾸며진(?) 지킬 블로그를 공짜로 사용할 수 있다. 예제에 나온 지킬 베이스 - 오늘을 살자 블로그 방문

지킬베이스 랜딩페이지