정적 사이트 생성#

기술 블로그를 시작하기전에 Github과 연동하여 운영하고싶어 정적 사이트를 만들만한 프레임워크들을 조사했다.

Jekyll#

• 루비 기반
• 가장 보편적이고 인기많은 정적 사이트 제작 프레임워크
• 문서가 많아지면 빌드하는데 5분이상이 소요될 수 있음
• 다양한 테마

Hexo#

• 자바스크립트(Node.js) 기반
• 한글 레퍼런스 꽤 많음
• 다양한 테마

Hugo#

• Golang 기반
• 매우 빠른 빌드속도
• 잘 정리된 문서화
• 사용할만한 테마는 부족

Hugo? Hexo?#

처음에 빠른 빌드속도가 빠른것이 장점이라고 많이 알려져있어서 Hugo로 시작했으나..

하지만, Go언어 기반으로 되어있고 및 테마 사용 시 구조 파악 및 커스텀화 시키기가 매우 어려웠음.

결국, 현재 자바스크립트를 많이 사용하고 있으니 Hexo 프레임웤을 사용하기로 결정.

Hexo 설치#

Hexo는 Node.js 기반이기 때문에 Node.js가 설치되어있어야 한다.

1. 글로벌하게 hexo-cli 설치한다.

2. hexo로 Blog 프로젝트를 만들어준다.

3. 테마적용을 위해 git clone 진행 (필자는 icarus 테마를 선택)

• hexo 테마

4. themes 폴더안에 clone 받은 테마의 폴더명을 hexo-theme-icarus -> icarus로 변경해준다.
5. 루트 경로에서 _config.yml 파일을 아래처럼 수정해준다.

6. 테마에 필요한 npm 패키지들을 설치해준다. (icarus 경우 아래 패키지들이 필요함)

• bulma-stylus
• hexo-component-inferno
• hexo-renderer-inferno
• inferno
• inferno-create-element

7. hexo s 명령어로 로컬에서 테마가 적용됬는지 확인

GitHub Pages#

깃헙 페이지를 이용해 블로그를 배포하기 위해 우선 Repository를 생성해둔다.

"GitHub사용자이름".github.io 로 Repository를 생성해주면 https://사용자이름.github.io/ 블로그 주소로 사용 가능

깃헙 페이지로 홈페이지 만들기

Hexo-Deployer-Git#

Hexo에서 Git으로 정적파일을 생성후 편하게 배포하기위한 패키지를 받아준다.

Github에서 만들어둔 Repository의 Clone 주소를 Hexo 프로젝트 설정파일에 적어준다.

_config.yml

publish용 정적파일 생성

Github 배포

동시 생성 & 배포

업데이트가 안될 경우#

캐쉬때문에 간혹 업데이트가 반영이 안될경우가 있는데 아래 명령어 후 다시 배포를 진행하면 된다.

정적 사이트 생성기#

내가 찾아본 정적 사이트 생성 프레임웤 외에도 정말 많은 사이트와 자료들이 있으니 잘 찾아보고 활용 후 본인에게 맞는것을 사용했으면 좋을 것 같다.

참고#

• GitHub.io
• Hexo Deploy