Hexo 시작하기

Blog
hexo

나만의 블로그

Github을 모르던 시절, 제가 만들었던 코드를 저장할 수 있고 설명할 수 있는 개인 블로그를 가지고 싶었습니다. 그래서 처음에는 네이버 블로그로 시작했지만, code를 적기에는 너무나 협소한 환경이었고 Tistory에 초청받아 사용해보았지만 불편한 것은 여전했습니다.

Github를 사용하기 시작하면서 markdown 언어를 알게 되었고 md를 통해서 블로그를 만들 수 있으면 좋겠다고 생각하고 Github Page를 통해 블로그를 만들기로 했습니다.

Github? Github Page? Hexo?

Github는 git을 사용하는 프로젝트를 지원하는 웹 호스팅 서비스이자 가장 인기있는 오픈소스 코드 저장소이기도 합니다. Github page는 사용자를 위해 static한 홈페이지(블로그)를 자동으로 만들어주고 이를 username.github.io으로 무료 호스팅해주는 서비스입니다. Hexo는 이 github pages를 이용한 블로그 프레임워크라고 말할 수 있죠. 초기 setting 후 간편한 명령어로 github에 deploy하면 자동으로 적용이 됩니다.

Hexo의 특징

  1. Blazing Fast
    Nodejs를 사용하여 빠른 속도로 생성하고, 빌드하는데에 필요한 수백개의 파일이 수초안에 해결이 됩니다.
  2. Markdown Support
    마크다운 언어를 지원합니다.
  3. One-Command Deployment
    하나의 명령어로 Github Page, Heroku, 다른 사이트에 배포가 가능합니다.
  4. Various Plugin
    Powerful한 플러그인들을 제공합니다.

다양한 기능과 특징이 있지만 웹프로그래밍언어 지식이 없으시다면 사용하기가 굉장히 어려울 것이라고 생각됩니다. HTML, CSS, JS, Git에 대한 이해가 요구됩니다.

Hexo 설치하기

Hexo를 설치하기 위해서는 다음 2개의 요소가 필요합니다.
-Node.js
-Git
이미 설치가 되신 상태라면 터미널에 다음과 같은 명령어를 입력하시면 됩니다.

1
$ npm install -g hexo-cli

자세한 설치 방법은 hexo hompage를 참고해주시기 바랍니다.

Hexo Setup하기

먼저 Blog를 구성하는 파일들을 저장할 폴더를 만듭니다. Github에 배포하실 분은 폴더명을 username.github.io로 만드시는 것을 추천해드립니다.

1
2
3
$ hexo init username.github.io
$ cd username.github.io
$ npm install

위의 절차를 거치셨다면 다음과 같은 디렉토리가 생성됩니다.

1
2
3
4
5
6
7
8
.
├── _config.yml
├── package.json
├── scaffolds
├── source
|   ├── _drafts
|   └── _posts
└── themes

가장 기본적인 테마로 만들어진 여러분의 블로그 파일입니다.
확인해보고 싶으시다면 로컬서버로 이를 확인할 수 있습니다.

1
$ hexo s

후에

1
2
INFO  Start processing
INFO  Hexo is running at http://localhost:4000/. Press Ctrl+C to stop.

라는 문구가 뜨시면 localhost:4000으로 들어가셔서 확인하실 수 있습니다.

글쓰기

먼저 글의 종류에는 다양하지만 일단 2가지를 설명하겠습니다.
-draft
draft는 말 그대로 초안문서로써 posting은 하지 않으나 source폴더내의 _draft폴더 안에서 관리합니다.
-post
post는 나의 Blog에 들어갈 문서입니다. 배포시에 Blog에 바로 적용이 됩니다.

글을 쓸 때에는 터미널에서 명령어를 입력해서 시작할 수 있습니다.

바로 post할 글을 쓰기 위해서는

1
$ hexo new <filename>

초안문서를 먼저 만들고 싶으시다면

1
$ hexo new draft <filename>

로 글을 작성하실 수 있습니다.
draft완성 후에 post로 옮기고 싶으시다면

1
$ hexo publish <filename>

으로 _draft폴더에서 _post폴더로 옮길 수 있습니다.

먼저 위의 글생성 명령어를 실행하시면 폴더내에 해당 파일 이름을 가진 markdown형식의 파일이 생성될 것입니다.

1
2
3
4
5
6
title : hexo init
tags:
    -hexo
date : 2017/02/23
---
My First Hexo!!

위와 같이 자신이 원하는 대로 글을 수정하시면 글을 생성하는 것이 완료되는 형식입니다.

Github에 배포하기

Github에 배포하기 위해서는 먼저 hexo-deployer-git이라는 플러그인이 필요합니다. 다른 플랫폼에 배포하기 원하시면 그에 해당하는 플러그인을 찾으신 후 설치하시면 됩니다.

1
$ npm install hexo-deployer-git --save

그리고 _config.yml에서 Github 정보를 입력해주셔야 합니다.

1
2
3
4
deploy:
    type: git
    repo: https://github.com/KorChris/korchris.github.io.git
    branch: master

위와 같이 본인의 git repo의 정보를 입력해주신 후에

1
$ hexo generate

정적파일을 생성해줍니다.

혹시나 로컬서버에는 적용이 되는데 github에 적용이 되지 않으면 hexo clean 후에 hexo generate을 실행하시면 잘 되실꺼에요.

생성이 완료되었다면 마지막으로

1
$ hexo deploy

Deploy 명령어를 실행합니다. 디플로이가 완료가 되면 Github Repository와 Github Page에 적용된 것을 확인하실 수 있습니다.(약 1분의 시간이 걸릴 때도 있네요)

Share 0 Comments