Markdown을 이용한 Hexo 블로그 포스팅
[이미지 출처: Hexo Landscape theme default image]
Hexo를 이용한 포스팅 방법은 3단계로 나눌 수 있다. 새로운 포스트를 생성한 다음 GFM: Github Flavored Markdown syntax를 이용하여 포스트 내용을 작성하고 github에 배포한다.
Post 생성
|
|
Hexo에서 제공하는 markdown file생성 명령어는 $ hexo new [layout] <title>이지만 github에 배포하기 전까지는 로컬의 내용이 반영되지 않기 때문에 무의미 하다 생각되어 이외의 내용은 고려하지 않았다. 생성된 마크다운 파일은 /source/_posts에 위치한다.
Post 작성
생성된 파일을 열어보면 다음과 같다.
|
|
Front-matter
포스트 최상단에 ---로 구분해 놓은 부분은 Front-matter라 하며, YAML 또는 JSON을 이용한 포스트 환경설정 부분이다. Front-matter가 끝나는 부분은 YAML의 경우 세 개의 대시(-) 로, JSON의 경우 세 개의 세미콜론(;)을 넣어서 구분한다. 이 부분은 scaffolds폴더의 해당 파일(이곳에서는 post.md)의 수정을 통해 초기값을 변경할 수 있다.
scaffolds
Front-matter 설정 값
| 설정 | 설명 |
|---|---|
| layout | 레이아웃 |
| title | 타이틀(파일명) |
| date | 파일 생성일 |
| update | 파일 업로드일 |
| comments | 포스트에서 comment 기능을 사용할 지 여부 |
| category | 카테고리 |
| tag | 태그 |
| permalink | 포스트의 기본 permalink를 override |
categories & tags
태그의 경우 계층의 구분이 없기때문에 작성순서가 중요하지 않으나, 카테고리는 작성한 순서에 따라 계층구조로 적용된다.
|
|
본문 작성
Front-matter 다음 라인(---)부터 컨텐츠 내용을 GFM에 맞춰서 작성하면 된다. 이미 만들어진 테마를 사용할 경우 그 테마의 css설정에 따라 원하는 디자인과는 다른 형태로 나타난다거나, markdown 문법이 다양하지 않음으로 인한 한계가 있을 수 있다. 이 경우에는 css 파일을 수정하거나 md파일 내에 직접 html 코드를 입력하여 원하는 형태로 표현할 수 있다. 또한 헥소에서 제공하는 문법인 Tag plugins을 사용하여 포스트를 작성할 수 있다.
markdown editor
다양한 IDE(Visual studio) 및 editor에서 markdown 작성을 지원해주고 있다.
Post 배포
포스트 작성이 완료된 후 github에 배포하기 전 로컬서버를 통해 포스트 내용을 확인해 볼 수 있으며, 포스트를 배포하기 위해서는 정적파일을 생성해야 한다.
|
|
정적파일이 생성된 후 원격서버에 이를 배포한다. 배포명령어는 입력하면 _config.yml에 입력했었던 repository url에 push를 하기위한 github의 정보를 요구한다. 이를 입력해주면 배포가 완료되었다는 메시지가 나타난다.
|
|
포스트 내용의 업데이트가 완전히 이루어 지지 않았을 경우에는 $ hexo clean을 통해 database와 public folder를 삭제한 후 다시 정적파일 생성 및 배포를 하면 된다.
기타 환경설정
여기까지가 포스팅을 위한 기본적인 내용이며, 추가적인 환경설정(github namecard 추가, 네이버 & 구글 사이트 등록 및 구글 광고 추가 등)은 Eric Han님의 헥소관련 포스팅에 자세히 나와있다.
Hexo posting 환경 유지
/public폴더에 생성된 정적파일만 원격저장소에 저장되기 때문에 해당 블로그에 대한 설정파일(generator)을 유지하기 위해서는 github의 다른 repository에 블로그 폴더 전체파일을 push하는 방법도 있으나, 나의 경우에는 Cloud storage(dropbox)에 동기화 시켜 사용하고 있다. nodejs, git, hexo package만 설치해준 뒤, 블로그폴더 동기화를 거치면 포스팅 환경이 다시 만들어 진다.