Hexo와 Github io로 시작하는 블로그 만들기 바로 시작합니다.
git repository 만들기
- Repository 이름은 USERNAME.github.io
- USERNAME : Github 사용자명
- Public / Private 중 Public 선택
hexo 설치
1 | npm install hexo-cli -g |
명령어 npm을 통해 hexo-cli 모듈을 global하게 설치한다는 명령어 입니다.
- 기본 블로그 구조 생성
- 새로운 포스트 생성
- github page에 올리기 위해 markdown을 html로 변환
- local(내 컴퓨터)에서 실행 테스트
- github에 업로드
Hexo 블로그 생성
블로그와 관련된 모든 행동은 hexo명령어로 시작됩니다.
이제 블로그를 생성해 보겠습니다. 먼저 적당하게 폴더를 하나 만든 후에 그 폴더에 접근 후 명령어를 입력합니다.
1 | $ hexo init myBlog |
만들어진 블로그 폴더를 열어 내용을 확인해봅니다.
- node_modules - hexo 블로그 사용에 필요한 기본적인 node.js 모듈
- scaffolds - hexo 페이지를 구성할 기본적인 markdown파일
- source - 실제로 포스트를 작성한 파일(markdown)과 이미지 등의 리소스가 저장되는 경로
- theme - 테마 파일이 저장되는 경로로 처음 hexo를 설치하게 되면 landscape 테마가 설치
- .gitignore - git을 통해 github에 블로그를 업로드할 때 업로드를 제외할 파일의 목록을 정의하는 파일
- _config.yml - hexo 블로그의 옵션을 지정하는 설정 파일
Hexo 블로그 Github에 연동하기
hexo를 사용하면 별도의 git 명령어가 없이도 알아서 github에 업로드를 해줍니다. 그러기 위해서는 hexo와 github간의 연결고리가 있어야 하는데 이 연결고리는 _config.yml을 통해 지정할 수 있습니다.
_config.yml을 열어봅니다. 여러 설정이 있지만 일단 넘어가고 마지막에 있는 #Depolyment를 봅니다. 여기에 deploy에 처음에 만든 github repository를 적어주면 github와 연동이 됩니다.
1 | # Deployment |
그리고 hexo에서 github에 업로드하기 위해 필요한 npm모듈을 설치합니다. 생성한 블로그 폴더 경로로 이동하여 명령 창을 실행하여 npm명령어를 입력합니다.
1 | $ npm install hexo-deployer-git --save |
포스트 생성하기
이제 포스트를 작성해봅시다. 생성한 블로그 폴더 경로로 이동하여 명령 창을 실행하여 아래처럼 입력합니다.
1 | $ hexo new post 포스트 파일명 |
hexo의 new post [포스트 파일명]명령어를 입력하게 되면 포스팅이 가능한 파일을 만들어 줍니다. 단 하나의 명령어 하나로 포스트 파일을 아주 쉽게 만들수 있습니다.
markdown언어를 사용하여 글을 작성해야 합니다.
1 | --- |
title - 실제 페이지에 출력될 포스트의 제목
date - 포스트를 생성한 날짜(hexo 빌드 시 date 날짜별로 폴더가 생성)
tags - hexo 블로그에서 관리 될 tag 목록
Hexo 빌드
1 | $ hexo generate 또는 hexo g |
로컬에서 확인하기
1 | $ hexo server |
localhost:4000 에 접속하면 방금 만든 블로그를 확인할 수 있습니다.
hexo-cli 설치하실 때 -g 부분을 빠뜨리면 hexo라는 명령어가 인식하지 않습니다.
만약 빼먹었다면 npm uninstall hexo-cli를 하시고 다시 설치하시면 됩니다.
Github에 업로드하기
1 | $ hexo deploy 또는 hexo d |
위의 명령어를 통해 github에 업로드를 하며, generate 명령어와 동시에 작성할 수 있습니다.
1 | $ hexo g --d |
간혹 hexo의 deploy기능을 통해 정상적으로 배포가 되었음에도 불구하고 페이지가 업데이트 되지 않는 현상이 있는데, 이 경우에는 아래와 같이 페이지를 clean후에 배포를 하면 해결됩니다.
1 | $ hexo clean |
Hexo 테마 적용 하기
USERNAME.github.io를 통해 성공적으로 블로그 접속이 되었다면, 멋진 디자인을 적용한 테마(Theme)를 적용하고 싶을 것이다. Hexo에서는 아래의 페이지에서 다양한 Theme가 적용된 페이지를 소개하고 있습니다.
Theme를 적용하기 위해서는 hexo-theme-chiangmai Github 페이지에서 자세한 내용을 확인 할 수 있다. 주의사항으로는 Theme를 적용하기 위해서는 아래와 같이 Repository 상태를 clean한 이후에 재배포 해야만 한다.
1 | $ hexo clean |