•    Main
  •    About
    • Study & Store photo

      Study & Store

      tinygun's blog

    • About me
    • Email
    • Github
    • Youtube
  •   Posts
    •   category/tag
      • category
      • tag
    •   All
  •   Search

블로그 갖고 싶어 시작한 jekyll(1)

20 Dec 2019

Reading time ~3 minutes

1. github 블로그 시작

공부하다 보니 코드를 보기 쉽게 정리해둘 필요성을 느꼈다.
주석을 간단히 달아두는 정도로는 보기 너무 불편했다.
그래서 생각한 것이 블로그였다.
하지만 기존 블로그들은 뭔가 마음에 들지 않았을 때 보인 블로그 형식이 바로,

“github.io”

뭔가 있어보이는 저런도메인을 쓰고 싶었다.

처음엔 n*ver나 d*um처럼 개인 공간 주고 꾸미는 줄 알았다.
얼핏 듣기로도 만들기는 쉽다고 들었다.

하지만 내가 직접 호스팅하는 것이었고…
그렇게 블로그 제작의 수렁으로 빠졌다.



2. jekyll 시작하기에 앞서서…

github에 호스팅하는 것은 여러 방법이 있는 듯 하다.
jekyll은 그 중 하나다.
한국어 jekyll 설명서를 보면서 해보면 어느 정도 만들 수 있다.

그렇다. 아주 심플하게 날 속였다.

나는 Windows 10 에서 만들고자 한다.
필요한 절차는 다음과 같다.

(1) Ruby, Ruby+Devkit 다운 받기

(2) Start Command Prompt with Ruby를 윈도우 검색창에 치고 관리자 권한으로 실행

(3) 다음 코드 실행

chcp 65001						   ## 인코딩 오류 방지
gem install bundler jekyll			## bundler, jekyll 받기
jekyll new my-awesome-site 			## 작업중인 디렉토리에서 "my-awesome-site"라는 폴더 만들고 거기다 설정파일 생성.
cd my-awesome-site				    ## 만든 폴더로 들어가기
bundle add webrick				    ## Ruby 3.0.0 이상 사용 시 추가
bundle exec jekyll serve			## jekyll 실행.

bundle을 이용하지 않고 jekyll serve만 실행하면 각종 dependency 문제가 발생한다.
(주로 매우 구버전에서 만든 것에서 호환성 문제가 많은 듯하다. 가끔 bundle도 안된다)

위와 같이 실행한 후, 127.0.0.1:4000로 들어가거나 localhost:4000로 들어가면 기본 화면이 나온다.

Jekyll이 잘 작동중이다


3. 게시판을 만들어보자

글들을 정리해서 넣기 위해 각종 게시판을 만들려고 했다.
그런데, 아무리 봐도 내가 생각하던 블로그가 아니다.
게시판을 만들 수 있는 관리자 링크가 없다.
아니, 애초에 글쓰기 부분도 없다.



4. 글이라도 써보기

우선 첫 화면에 Welcome to Jekyll! 이라는 글처럼 하나 써보기라도 해야하지 않는가?
이건 그래도 markdown 문서를 사용하면 가능하다.
markdown 편집 프로그램 중 Typora 가 편해서 잘 사용하고 있다.
jupyter notebook 덕에 markdown을 많이 사용했는데, 이게 제작진행에 도움이 되었다.

만든 폴더를 살펴보면 _posts라는 폴더가 보인다.
yyyy-mm-dd-welcome-to-jekyll.markdown 같은 이름의 문서가 들어있다.
이 문서 보면서 비슷하게 만들면 된다.
YEAR-MONTH-DAY-title.md 형식으로 파일을 만들어주면 포스트로 인식해준다.
파일 이름에 한글이 있으면 업로드가 안 되는데… 그냥 영문도 모른채 영문으로 작성했다.

첫 줄을 보면 아래와 같은 부분이 있다. 필요한 부분을 수정하자.

layout: post				# post에 올리기
title:  "Welcome to Jekyll!"		# 글 제목을 "" 사이에 넣기. 이건 한글도 괜찮다.
date:   2019-12-20 17:48:56 +0900	# 날짜. 시간은 안 넣어도 괜찮다.
categories: jekyll update		# 카테고리. 당장은 수정하는 느낌이 안 난다.

여기서 포기할걸



5. 꾸미는 방법들

템플릿은 Liquid 라는 언어로 구성되어 있다고 한다.
그럼 이걸로 바로 만들면 되겠지만, 내 스펙으로 웹문서 작성은 너무 힘들다.

Infomation
1. head, body, a color 등 매우 다양한 태그를 이용하여 "Hello world!" 작성 가능
2. 저열한 태그 이해도


5-1. jekyll admin 이용하기

jekyll admin 설명 원문

jekyll은 나같은 사람도 쓸 수 있게 무려 관리 페이지를 만들어주는 기능이 있다.
ruby 콘솔에 gem install jekyll-admin 쳐서 다운받자.
그 다음, 만든 폴더 내부에 파일 확장자 없이 Gemfile이라고만 써있는 것이 하나 있다.
얘를 열어서 마지막 줄에 gem 'jekyll-admin', group: :jekyll_plugins 를 추가한다.
ruby 콘솔 창에 bundle install 쳐주면 설치는 완료되었다.

작동법은 다음과 같다.

(1) 아까처럼 bundle exec jekyll serve을 ruby 콘솔창에 쳐서 서버 작동.

(2) http://localhost:4000/admin 으로 접속.

뭔가 그럴싸한 관리페이지가 생겼다

글 쓰는 부분이나 페이지 만드는 부분들이 있다. 보통 블로그보단 불친절하다.
글은 markdown 편집기로 쓴 다음, 시간같은 메타데이터를 여기서 변경하면 좋아보인다.

여기까지 하는데 5시간 넘게 걸렸는데 언제 다하나

5-2. jekyll theme 이용하기

jekyll은 각종 테마를 제공하고 있다.
다른 위인들께서 만든 것을 공유하는 듯하다. 마음에 드는 테마 들어가서 다운로드 받자.

다운로드 말고 Fork를 통해 바로 github에 집어넣는 방법도 있다.
하지만, 나는 로컬에서 돌려보는 것이 목적이라 바로 다운로드 받았다.

압축 해제한 폴더로 ruby 콘솔로 들어간 후, 아까처럼 bundle exec jekyll serve 치자.
폴더에 들어가서 _config.yml 파일과 다른 파일들을 수정하면 거의 호스팅 완료 단계까지 만들어진다.

그러나, 맹점이 하나 있다. 수정이 어렵다.
내 스펙이 증명하듯, 수정하려면 뭘 알아야 하는데 모르니까 너무 힘들었다.
많이 쓰는 테마들은 맘에 안들고,
별로 안 쓰는 테마들은 친절한 수정 설명이 부족했다.

결국, 내가 사용하고 싶은 테마의 기능을 만들기 위해서는 다른 사람들 github 파일이 어찌 다른지 확인하는 편이 빨라보였다.
jupyter notebook 간단한 색깔 설정 바꾸는 것도 css 잘 몰라서 2일 걸렸는데

다음을 기약하며 빠른 수면을 택했다.



jekyllgithub Share Tweet +1