Creating personal Github Pages

개인 Github Pages 구성

If you have visited this page trying to set up your personal blog or static pages with GitHub Pages, you probably looked for many methods you need.

만약 GitHub Pages로 개인 블로그나 정적 사이트를 구성하는 방법을 찾기 위해 이 페이지에 방문했다면, 이미 GitHub Pages를 사용하기 위해 여러 가지를 알아보고 왔을 확률이 높을 것이다.

So, let's skip intros, tutorials and try simple ways to compose personal GitHub Pages

그러므로 대략적인 소개와 튜토리얼은 생략하고, 개인 GitHub Pages를 구성하기 위해 간단한 방법으로 구성을 해보도록 하자.

If you try Theme Chooser following basic GitHub Pages tutorial, you'll have index.md or README.md file in your repository

기본적인 GitHub Pages 튜토리얼을 따라 Theme Chooser를 사용하면 기본으로 index.md, README.md 파일을 repository에 생성해준다.

To change chosen theme's layout, look for the theme in following link

우선 선택한 테마의 레이아웃을 수정하기 위해 다음 링크에서 해당 테마를 참고하였다.

https://github.com/pages-themes

Download, modify default.html in chosen theme's _layouts directory, and push it into _layouts directory in your repository.

선택한 테마의 repository의 _layouts 디렉토리에 정의 된 default.html를 입맛에 맞게 수정한 후 개인 repository _layouts 디렉토리에 넣는다.

If you want to compose your pages with header, footer, leftMenu.., split to separate *.md or *.html file, and declare {% include fileName %} at desired location.

좀 더 나아가 Header와 Footer, leftMenu 등으로 분리 하여 구성하려면 분리 할 부분을 _include에 *.md, *.html 확장자 파일로 생성 후, 원하는 위치에서 {% include 파일명 %}를 선언하여 레이아웃을 구성한다.

!!Caution {% include_relative } doesn't work at_layout directory, you should use {% include } instead.

!!주의 _layout에서는 {% include_relative } 구문이 동작하지 않으므로 {% include } 문을 사용해야 한다.

github.com : include_relative does not work with layout files

Now, let's create left categorized menu.

왼쪽의 카테고리별 메뉴를 구성한다.

Following link shows how to create categorized links without maintaining set of links.

아래의 링크는 따로 링크 목록 관리없이 메뉴를 생성하는 방법을 보여준다.

StackOverflow :generating-a-list-of-pages-not-posts-in-a-given-category

While applying methods above, met following problems.

위의 방법을 인용하여 구성하던 중 다음과 같은 문제에 도달했다.

!!Caution site.categories is preserved variable which derived from the directory structure. using site.categories will cause unexpected results.

!!주의 site.categories는 이미 예약된 변수로 _post 아래의 directory 구조에 따른 카테고리이다. site.categories를 사용하는 것은 예기치 못한 결과를 보인다.

Layout is done, move on to design.

레이아웃을 구성하였으면 이제 디자인을 수정한다.

You might already experienced that modifying layout requires several static resource such as stylesheets, javascript, images. To serve these kinds, create asset/js, asset/css, asset/img directory in your respository.(Directory name is less relevent unless name contains '_' prefix.)

이미 레이아웃을 구성할 때 css, script 구성이 필요하게 되는 데, 이러한 정적 Resource를 제공 하기 위해, 개인 repository에 asset/js, asset/css, asset/img 3개의 directory를 생성한다.( 이름은 큰 상관이 없으나 접근을 위해 directory 이름에 '_' prefix가 붙지 않도록 한다.)

After that, check index.md, index.html whether layout is properly set.

이후 index.md, index.html를 확인하여 레이아웃 및 구성이 제대로 되었는지 확인한 후 글을 작성한다.

Using basic post directory is fine, but document path can be any directory and filenames.

글을 작성하는 경로는 기존 post를 사용해도 무방하나, URL에 내용을 명시하려는 목적이 있는 경우 따로 directory를 만들어 파일 이름을 직접 지정해도 된다.

##Reference ##참고자료 https://jekyllrb.com https://devhints.io/jekyll https://stackoverflow.com/questions/24102498/escaping-double-curly-braces-inside-a-markdown-code-block-in-jekyll?newreg=484c8dbe7307499c94d6cb861bcb4df2