Jekyll,Git 을 몰라도 무료 Github Pages 즐기기
Github Pages 는 Github에서 제공하는 무료 웹사이트 서비스로써 자신의 프로젝트 소개나 회사를 소개하기에 편한 곳이지만 Jekyll 엔진이 돌고 있으니 간단한 블로깅이 가능하다. 다시말해서 무료로 회원들이 블로깅 서비스를 누릴 수 있다. “워드프레스에서 Jekyll로 마이그레이션” 에서 소개했듯이 많은 장점을 갖고 있지만 git 을 배워야 하고 Jekyll을 깔아야 하는 번거로움과 어려움이 따른다.
이 글에 소개되는 Fork를 이용한 Pages 사용법은 진입장벽이 높을 수 있는 Pages 를 간단한 방법으로 온라인에서 즐길수 있도록 하는 방법이다. 이 방법이 어떤 앱이나 프레임워크등의 전혀 새로운 아이디어가 아님을 밝힌다.
이 글의 대상은 Github 조차도 모르는 상황의 유저이며 아무런 사전 지식 없이 무료로 블로깅을 시작하도록 돕는 목적으로 쓰여졌다.
이 과정을 마치면 얻게되는 결과물은 이러하다.
- 온라인 상에서 자신의 주소 (http://유저아이디.github.io) 로 블로깅이 가능하다.
- 모든 작업은 github.com 에서 이루어지므로 컴퓨터에 설치해야 할 것은 없다.
- github.com 에서 파일을 추가하고 수정할 수 있게된다.
워드프레스에서 Jekyll + Github 으로 마이그레이션을 진행한 이야기는 바로 이전 글을 참고하기 바란다.
Github 가입
- Github.com 에서 Username 과 이메일, 암호를 적고 곧바로 가입을 한다.
- 가입후 Github 플랜을 골라야 한다. 무료가 이미 선택되어 있으니 하단에 Finish sign up 을 눌러 가입을 마무리 한다. 본인 확인을 위한 이메일이 도착해 있을테니 가입시 기입한 이메일 주소의 메일함으로 가서 확인 바란다. 이메일의 본인확인 링크를 클릭하여 확인하지 않을 경우 서비스를 사용할 수 없다.
Fork 하기
가입 후 알아야 할 용어는 repository 와 fork 이다.
- repository 는 각 계정의 프로젝을 넣는 공간이라고 이해할 수 있다. Repo 라고 줄여 부르기도 한다. 여러개의 repo 를 만들 수 있고 누구든지 공개된 repo 에 들어가서 볼수 있다.
- Fork 는 복사/클론 이라고 이해하면 될듯 하다. 누군가의 repo 에 들어가서 Fork 버튼을 누르게 되면 내 repo 안에 복사되어 저장된다.
용어를 알았다면 https://github.com/barryclark/jekyll-now 를 Fork 하여 내 저장공간인 repo 로 그대로 복사해오자. 링크를 따라가면 오른쪽 상단에 fork 버튼이 보일것이다.
몇초가 걸리긴 하지만 Fork가 끝나면 여러 파일이 들어있는 repo가 생겼을 것이다. 왼쪽 상단을 보면 유저이름 / jekyll-now 라고 되어 있을것이다.
Setting 수정 - Repo 이름 바꾸기
Repository 이름을 jekyll-now 에서 자신의 유저이름.github.io 로 바꾸어야 한다. Github이 해당 repo가 블로그 사이트로 사용되는걸 인증하는 방법이다.
오른쪽 Settings 을 누른후 Repository name 란에 jekyll-now 대신 자신의 아이디.github.io 라고 수정한다.
Jekyll-now 에서 지금까지의 과정을 gif 로 만들어 올렸다.
Customize Settings
파일을 수정하는 간단한 방법은 해당 파일을 클릭 후 연필 모양의 Edit 버튼을 누르는 것이다.
사이트의 기본틀을 가져왔으니 기본 설정파일인 _config.yml 을 수정하고 사이트가 정상적으로 작동하는지 확인한 후 다음 단계인 글을 써보겠다.
- _config.yml 파일을 클릭한 후 Edit 버튼을 누른다.
- 각각의 비어있는 공간을 채워준다.
- 모든 정보를 기입할 필요는 없으나 적어도 name 과 url 은 수정해준다.
- url은 “http://자신의 아이디.github.io” 라고 표기한다.
- 수정을 마쳤다면 하단에 Commit changes 버튼을 눌러준다. 가능하다면 버튼 바로위의 빈칸에 무엇을 수정하였는지 설명을 넣어주자. 올바른 연습이 될 것이다.
모든 수정을 마쳤다면 새 브라우저를 열어 자신의 블로그 주소로 접속해 보자. 가장 처음으로 사이트를 띄우는 상황이니 30분까지도 걸릴 수 있다. 참고 기다려보자. 이메일확인을 했는지도 꼭 확인하자.
첨부된 글을 수정하며 문법 배우기
모든 블로그 글은 _posts 폴더안에 있어야 한다. 첫 글은 이미 폴더 안에 첨부되어있으니 그 글을 수정하며 글 작성에 필요한 부분을 살펴보겠다.
- _posts 안의 2014-3-3-Hello-World.md 를 수정한다.
- 수정을 누르면 몇가지 눈에 띄는 부분이 보일것이다.
- — 3개의 대쉬가 위 아래로 있으며 이전의 _config.yml 파일처럼 지정 이름이 있고 값이 지정되어 있다. Front-matter 라고 부르는 부분이다. 모든 글의 상단에는 바로 이 Front-matter 가 첨부되어야 한다. 글의 제목, layout 파일이름, 날짜를 꼭 넣으며 categories 등도 적어 넣을 수 있다.
- layout: post 는 _layouts 폴더의 post.html 을 지정하며
- title: 은 글의 제목을 지칭한다. 글의 웹 주소를 지칭하지는 않는다. 글의 웹 주소는 파일 이름을 따라 지정된다.
- 글 안을 보면 ![대체텍스트](/폴더/이미지 주소) 형식의 부분이 보일 것이다. 이미지를 나타내는 부분인데 !표를 빼면 단순 링크를 나타낸다. [링크이름](링크주소)
- 타 사이트 이미지를 보여주는 것은 가능하나 이미지를 자신의 repo에 웹을 통하여 첨부하고 사용하는 방법이 없다.1 그나마 간단한 방법은 issue 를 사용하여 이미지를 사용하는 방법이다. 이는 맨 하단에서 설명하도록 하겠다.
- 이러한 표기법은 markdown 이라고 부르는데 글 작성시에 markdown 형식으로 글을 작성해야 한다. 그다지 어려운 형식은 아니니 꼭 배우기 바란다.2 간단히만 보면
- # 는 h1(글제목), ## 는 h2, > 는 blockquote(인용문구), * 는 list. **를 양쪽에 쓰면 strong(강조).
- 하단의 Commit changes 버튼을 누르고 수정이 적용 되었는지 확인해보자.
새로운 글을 써보기
수정한것과 마찬가지의 순서이다.
다시 _posts 폴더에 들어가서 branch: master 옆의 주소 끝 부분에 있는 + 를 눌러준다.
새 파일을 만드는 페이지가 나오면 제일 먼저 파일 이름을 먼저 정해준다. 년-월-일-글제목.md 로 정해주어야 한다.
그리고 내용란에 Front-matter 를 먼저 적어준다.
---
layout: post
title: "Github Pages 에 올리는 첫 글"
date: 2015-01-28 17:30:00
---
그 후 적고 싶은 글을 적어본다. 그리고 하단의 Commit new file 을 클릭한다. 첫 글이 올라갔을테니 확인해 본다.
그 외
첫 글은 올렸지만 아직 수정해야 할 것들이 남았다.
- 방문자가 잘못된 경로로 접속하거나 페이지 에러가 났을때에 출력되는 404.md 페이지
- 현 repo 소개를 나타내는 (파일리스트 밑의 긴 글) README.md
- 실제 소개페이지가 될 about.md 를 자신의 소개로 채워보자. 사이트에서 About 클릭시 출력되는 페이지 이다.
이미지를 첨부하여 보여주기
위에서 잠깐 언급했지만 직접 이미지를 자신의 repo 에 업로드 하여 사용 하는 방법은 자신의 컴퓨터에 git을 설치하여 직접 자신의 repo 와 연결하는 방법 뿐이다. 이는 정석이긴 하나 글의 목적과는 다르므로 그것을 우회하는 편법은 Issues 를 사용하는 방법이다.
- 오른쪽 메뉴의 Settings 를 누른 후 Issues 를 체크하여 사용 가능토록 한다.
- 오른쪽 메뉴 상단에 Issues 메뉴가 생겼을 것이다. 클릭한 후 “New Issue” 를 선택한다.
- 제목은 아무거나 적을수 있지만 기왕 하는거 이미지를 넣을 포스트 제목을 넣는다.
- 그리고 이미지를 드래그 하여 글 란에 드랍한다.
- Submit new issue 를 누른 후 이미지의 주소를 복사하여 글 안에 삽입한다. ![대체텍스트](http://이미지주소.jpg)
웹에서 모든게 가능한 Github Pages
Github Pages 를 제대로 로컬 컴퓨터에 설치하여 사용하는 것은 하루 이틀정도의 배움의 시간이 들어가지만 위의 방법을 사용하면 아주 초보 사용자도 많은 지식이 없이도 1시간 안에 블로깅 서비스를 사용 할 수 있다. 깃헙 페이지 서비스가 나에게 맞는지 테스팅 해본다면 위의 방법을 추천해드리고 싶다. 언제든지 해당 repo 를 삭제하면 되고 서비스가 맘에 든다면 CNAME 파일을 수정하여 독립 도메인 사용도 몇분안에 가능하다.
이미 블로깅을 하고 계시는 분이라면 이전글 “워드프레스에서 Jekyll로 마이그레이션” 글을 읽어보셔도 도움이 되실듯 하다.