깃허브 페이지(블로그)는 Hexo라는 라이브러리를 통하여 쉽게 생성이 가능하다.
Jekyll(지킬)과 다르게 Hexo는 컴파일이 필요하고, 깃저장소로 올리는 명령어를 지원해준다.
설치 및 환경설정
Hexo를 이용하여 만들어낼 페이지를 git저장소에 호스팅 하기위해 git설치가 필요하다.
https://git-scm.com/에 접속하여 git을 설치한 후
바탕화면 마우스 우클릭
'Git Bash Here'를 실행하여
'git --version'을 입력하여 버전 및 설치를 확인한다.
▶ Github생성
Github에 로그인 후 'New Repository'를 이용하여
Repository Name을 '계정이름.github.io'로 생성
( 해당 주소가 깃허브페이지의 주소가 된다. )
ex ) gunbin91.github.io
▶ Git설정
Git Bash실행 후
'git config --global user.name 계정명'
'git config --global user.email 사용자 이메일'
을 입력한다. ( 초기에 한번만 입력하면 된다. )
▶ Node.js 및 NPM 설치
Hexo는 Node.js기반의 정적 사이트 생성 라이브러리이기 때문에
Hexo를 사용하기 위해서는 Node.js설치가 필요하다.
또한 NPM은 자바스크립트의 패키지 관리도구로 Hexo설치시에 필요하다.
https://nodejs.org/ko/로 접속하여 다운로드 후
CMD창을 실행하여
'node -v' 및
'npm -v' 를 입력하여 설치를 확인한다.
▶ Hexo 설치
명령프롬프트(CMD)를 열어 'npm install -g hexo-cli'
를 입력하여 설치
( hexo-cli 라는 모듈을 어디서든 사용가능하게(-g) 설치 )
▶ 페이지관리 디렉터리 생성
페이지를 관리할 자신이 원하는 적당한 경로로 이동하여
'shift + 마우스 오른쪽' -> '여기서 명령창 열기' 실행
( 또는 명령프롬프트에서 해당 경로로 이동한다. )
1. "hexo init 디렉토리명" 을 입력하여 블로그 디렉토리 생성
2. "cd 디렉토리명"으로 해당 블로그 디렉토리로 이동
3. "npm install"을 입력하여 디렉토리블로그에 필요한 모듈 설치
▶ Hexo블로그 Github연동 설정저장
: 블로그 디렉토리에 생성된 ‘_config.yml’파일을 열어
# Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:
type: git
repo: https://github.com/계정이름/계정이름.github.io.git
형식의 구조를 찾아 위 코드와 같이 수정한다.
그 후 해당 경로의 CMD창에서
명령어를 입력하게 되면 해당 깃허브url과 연동사항이 저장된다
- 추후 페이지 수정을 위해 ‘config.yml’파일을 수정했을 경우
그때마다 위 명령어를 통해 해당사항을 저장해 주어야 한다.
Hexo 사용법
▶ 블로그 포스트 생성하기
블로그 디렉터리경로의 CMD창에서 "hexo new post 포스터명"을 입력하면
/source/_posts 경로에 해당 '포스터명.md파일'이 생성된다.
.md확장자는 markdown언어로 작성되는 파일로,
해당 md파일 하나하나를 통해 블로그 포스터를 작성 및 수정 할 수 있다.
▶ Hexo빌드
md파일 포스터 작성 완료 후 실제 브라우저에 보여지게 될 html로 변환하는 작업이 필요하다.
블로그 디렉터리경로의 CMD창을 열어 "hexo generate" 또는 "hexo g"를 입력한다.
=> public디렉토리가 생성되고 그 안에 실제 블로그 페이지 구조가 변환되어 만들어진다.
▶ 로컬에서 확인하기
Hexo에서도 자체 서버를 지원해 준다.
단, 서버용PC가 아닐경우 관리하기 어려움이 있음으로 로컬확인은 실제 깃허브 호스팅 전
테스트용으로 사용하도록 한다.
CMD 창을 열어 "hexo server"을 입력하면 서버가 켜지고,
브라우저를 열어
"https://localhost:4000"로 접속하게 되면 브라우저에서
페이지를 확인할 수 있다. ( Hexo 자체 서버의 포트는 4000 )
▶ Github에 업로드(호스팅)하기
깃허브 호스팅 서비스를 사용하면, 서버를 직접 실행하지 않고도 서버를 풀가동 할 수 있기 때문에 관리가 용이하다. ( 단, 깃허브 호스팅 서비스는 블로그같은 정적 페이지만을 지원한다. )
CMD창을열어 "hexo deploy" 또는 "hexo d"를 입력
=> _config.yml'파일에서 설정한 깃허브 경로로 해당 블로그 파일들이 업로드 된다.
"https://계정명.github.io"
로 접속하게 되면 자체 서버를 가동하지 않아도 블로그에 접속할 수 있게 된다.