Posted 2020-02-09Updated 2023-08-16 HyeonGuJ blog6 minutes read (About 902 words)

[blog] hexo로 github page 블로그 만들기

블로그

여기저기 플렛폼을 옮겨다니기도하고, 삽질도하다보니 블로그를 만드는 나만의 방법을 공유하고자 포스팅을 하게 되었습니다.

다양한 사람들이 각자의 목적을 가지고 블로그를 만든다.
이 블로그는 평소에 경험하거나 공부했던내용을 복습, 정리, 공유하기위해서 만들었다.

블로그는 네이버블로그, 티스토리와같은 블로그 기능을 사용할수있는 다양한 플랫폼들이 있지만 그중에서 github page 를 통해 블로그를 만드는 방법을 알아보자

블로그 만들기 시리즈는 계속 포스팅 될 예정이다

https://pages.github.com/

github 에서 repository만 만든다면 자동으로 홈페이지를 만들어 주는 github의 서비스중 하나이다. 개설이 매우 쉽고 자유도도 높아 개발자들이 이 방법을 많이 선택한다.

이때 repository의 이름은 계정명.github.io로 한다.
이 블로그의 경우에는 hyeonguj.github.io라는 이름이 된다.
그리고 이곳은 홈페이지의 내용이 올라갈 저장소가 된다.

gitpage로 repository만 생성해도 블로그 웹 페이지는 할당이 된다. 하지만 다른 블로그들처럼 내프로필을 올리고, 글을쓰고, 내가 원하는대로 테마를 변경할수는 없다. 이런것들을 지원해주는 도구로는 가장 유명함 jekyll가 있다.

이번 포스트에서는 또 다른 도구인 hexo를 이용한 방법을 알아보려한다. (https://hexo.io/)
공식홈페이지의 소개에 따르면 simple,fast,powerful blog framework 이다.

hexo를 설치하기위해서는 2가지를 먼저 설치해주어야한다.
각각 아래에서 설치해주도록 하자

설치가 잘되었다면 단순히 아래 명령어를 실행시키기만 하면 블로그를 작성할 초기화작업이 끝난다.
먼저 원하는 폴더로 이동후 아래명령어를 실행시켜주도록하자

1 2	npm install hexo-cli -g hexo init

명령어 실행후 아래와 폴더안에 아래와같은 파일과 폴더들이 생성된것을 볼 수 있다.

1	_config.yml node_modules package-lock.json package.json scaffolds source themes

이곳은 블로그의 이름, 테마, 플러그인, 작성한 포스트 원본파일을 관리하는 최상위 폴더이다
이곳에서 hexo server 명령어를 실행해보자
실제로는 블로그에 반영되어있지 않지만 자신의 pc에서 실행시켜볼수 있는 기능을 사용 할 수 있다.

hexo server

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

그리고 웹브라우저에서 위 주소로 접속하게되면 아래와같은 hexo에서 만들어놓은 기본 화면을 볼 수 있다