반응형

Github에서 제공하는 Page 기능을 이용해  

Windows 환경에서 간편하게 블로그 페이지를 생성하는 법을 살펴볼까 한다.


사실 필요한 툴들을 살펴보면 전혀 간편해 보이지도 않고 

티스토리의 위지윅 에디터와 비교해서도 이렇게까지 해가면서  

불편하게 블로그를 만들어야 하나 싶겠지만 

한편으로는 수동(Manual)의 매력이 느껴진다.  


그래도 역시 그림이 많이 들어가는 포스팅은 MakrDown보다 위지윅(WYSIWYG)이 편하다...  

지금도 아톰에디터에서 글을 써보고 있지만 도저히 엄두가 나질 않는다.  


얼른 티스토리를 켜고 그림을 덕지 덕지 붙혀야지.  

우선은 다음의 순서대로 진행하고자 한다.

1. 루비를 설치한다.
2. GitHub 클라이언트 프로그램을 설치한다.
3. 루비는 Jekyll를 실행하기 위해 필수적이고 GitHub 클라이언트는 GitHub Page 레파지토리와 쉽게 연동(?)하기위해 필요하다.
4. Jekyll는 정적 사이트 생성툴. 이걸로 GitHub Page 사이트를 생성한다.

그래서 첫번째. 1. 루비를 설치한다.

정적 사이트 툴 Jekyll를 실행하기 위해서는 Ruby가 필요하다. 
루비를 설치하도록 하자. 
우분투나 맥에서는 RVM 을 이용해서 설치하지만 Windows는 RubyInstaller를 다운로드 받아서 설치하도록 한다.

설치가 완료되고 나면 윈도우 시작메뉴에서  Ruby Prompt를 찾을 수 있다.



:설치완료후 윈도우 메뉴에서 커맨드 프로그램을 찾을 수 있다.


2. GitHub 클라이언트 프로그램을 설치한다.

설치가 완료되면 GitHub 클라이언트 프로그램을 설치한다. 

GitHub 클라이언트 프로그램을 이용하면 GitHub 계정으로 로그인 하는 것만으로도 SSH-Key 관련 설정을 간단하게 해결할 수 있다.

그러니 GitHub 사이트에서 클라이언트 프로그램을 다운로드 받아 설치하도록 하자.



:Github Client를 다운로드하고 설치하도록 하자.


설치 이후에는 윈도우 메뉴에서 GitHub 클라이언트 프로그램과 GitShell 프로그램을 찾을 수 있다.

먼저 GitHub 클라이언트 프로그램을 실행한다.

그리고 좌측 상단의 + 버튼 > Clone 에서 log in 을 클릭한다.

설치한 클라이언트 프로그램과 GitHub 서버와의 연동을 위해서는 로그인 과정이 필요하다. 

로그인이 정상적으로 완료되면 SSH Key 가 등록되었다는 메일이 올 것이다. 


이후에는 GitShell 프로그램도 별도의 권한 문제나 인증과정 없이 사용할 수 있다.

GitShell 에서는 GitHub 사이트에서 생성한 블로그 용 레파지토리를 로컬 PC에 Clone 하도록 하자.

이 과정은 3번에서 계속.




3. 루비는 Jekyll를 실행하기 위해 필수적이고 

GitHub 클라이언트는 GitHub Page 레파지토리와 쉽게 연동(?)하기위해 필요하다.

이제 Github에서 블로그 페이지를 관리할 Git Repository를 생성하도록 하자.

레파지토리 이름은 Github계정명.github.io 으로 해야 웹브라우저에서 https://계정명.github.io 주소로 바로 접근할 수 있다.


생성후에는 GitShell 에서 GitHub 사이트에서 생성한 블로그 용 레파지토리를 로컬 PC에 Clone 하도록 하자.

이제부터 이곳에서 Jekyll를 이용해 블로그 페이지를 생성할 것이다.


:레파지토리 이름은 Github계정명.github.io 으로 한다.



:블로그용 레파지토리를 로컬에 clone


4. Jekyll는 정적 사이트 생성툴. 이걸로 GitHub Page 를 생성한다.

제반 사항 모두가 준비된 것 같다.

이제는 Jekyll를 설치하자. Jekyll는 RubyGem을 이용해서 설치한다.

윈도우 메뉴에서 Start Command Prompt with Ruby 를 실행하고 다음의 명령을 실행한다. 

실행하고 나면 아래와 같이 설치가 진행된다.



설치 이후에 바로 jekyll new . 를 실행해보면 정상적으로 동작하지 않는데 이것은 의존성을 갖는 패키지들의 설치가 필요하기 때문이다.

에러를 보면서 하나하나 설치를 해도 된다.

여기서는 관련된 패키지를 모두 설치하고 jekyll 를 실행해보자.


아래의 명령대로 의존성을 갖는 패키지를 설치하자.


하나라도 설치되어 있지 않으면 아래의 에러 로그 중에 하나가 나타날 것이다.


:bundler가 없을때.


:minima가 없을때.


:jekyll-feed가 없을때.


:tzinfo-data가 없을때.


설치가 끝나면 

jekyll new . 를 다시 실행해보자. 



정상적으로 생성된다.

이대로 jekyll serve를 실행해보자.

jekyll 가 내장하고 있는 서버가 동작하고 로컬PC에서도 생성된 사이트를 확인할 수 있다.

로컬에서 확인하기 위해서는 브라우저에서 http://localhost:4000 으로 접속해보자.


:http://localhost:4000으로 접속해보면 이렇게 생성된 사이트를 확인할 수 있다.


지금 확인한 것은 로컬상에서의 동작을 확인했던 것이고 

실제로 GitHub에 우리가 생성한 사이트를 반영(호스팅)하기 위해서는

Jekyll를 이용해 생성한 파일들을 [Github계정명.github.io] 레파지토리에 push 하면된다. 

우리는 이미 [Github계정명.github.io] 레파지토리에서 jekyll new . 를 했으므로 그대로 git push를 해보자.

이때 git push는 gitShell 프로그램을 사용한다.


그리고 웹브라우저에서 https://github계정명.github.io 으로 접속해보자.


:완성.


여러 툴을 섞어서 GitHub 에서 호스팅하는 페이지를 생성해보았다.

원래 이 페이지 기능은 레파지토리별 프로젝트를 설명하는 용도였다고 한다.


어쨌든 여기서는 블로그 '생성'에 중점을 둔 맛보기였고

실제로 글을 쓰고 사용하는 방법에 대해서는 다시 적어보려고 한다.


사실 사용에 관해서는 어렵거나 복잡한 부분은 없다. 

그냥 마크다운으로 글을쓰고 YAML로 메타정보를 기입하고 간간히 Liquid 를 사용하면된다. 


사용과 관련된 더 자세한 내용은 Jekyll 공식 사이트를 참고하도록 하자.


http://jekyllrb-ko.github.io/docs/home/

반응형