hexo를 이용해 github page hosting과 command line명령을 쉽게 만드는법을 포스팅 해보려고 한다.
1. Git page Repository를 생성한다.
Git page의 clone or download를 선택해 URL 정보를 복사해 온다.
URL의 형식은 https://github.com/UserName/UserName.github.io 형식으로 되어있다.
그럼 Window환경이기때문에 Git Bash를 이용해 github repository를 로컬에 복사해 온다.
2. github repository 로컬에 복사하기
| $ git clone https://github.com/UserName/UserName.github.io |
이미 한번 받았기 때문에 나는 이렇게 뜬다;;;ㅋㅋ
3. 잘 연동 되는지 확인하기!(Git Push 해보기!)
- 다운을 받았다면 다운받은 경로에 가서 index.html 파일에 "Hello 서파르타"라는 글을 올려본다
| $ cd username.github.io | 로컬에 받은 repository의 경로로 이동한다. |
| $ echo "Hello 서파르타" > index.html | index.html 에 "Hello 서파르타"를 출력한다! |
- Push! (Git Push 하는법)
| $ git add --all |
| $ git commit -m "commit 하는 내용" |
| $ git push -u origin master |
위에 명령어를 차례로 입력 한 후, https://UserName/github.io 에 접속해 "Hello 서파르타"가 출력되는지 확인한다.
"Hello 서파르타"가 출력되면 성공!!
※ index.html 파일을 찾지 못함으로 에러가 뜬다면 index.html 파일을 하나 생성해주길 바란다.
- 로컬 저장소에서 index.html파일 생성 후, 명령어 echo "Hello 서파르타" > index.html 입력후 push
- 또는 github repository에 index.html 파일 하나 생성 후, 명령어 git pull 한 후 3번의 처음부터 다시 시작.
4. Hexo 설치!!
※ hexo를 설치전 필요한것이 있다. Node.js, Git 이 두가지는 필수로 설치 바란다.
| $ npm install hexo-cli -g | hexo cli를 설치 |
| $ hexo init blog | blog라는 폴더에 hexo 생성 |
| $ cd blog | blog폴더로 이동 |
| $ npm install | 다운~~ |
위와 같이 작업을 했다면 blog파일 안에 _config.yml 이라는 설정파일이 생성되어 있을것이다!
_config.yml 파일의 내용은 추후 포스팅 할 예정이다^^
간단히 몇가지만 수정해 보자!
| title : 안뇽~ | 타이틀을 설정한다. |
| subtitle | 서브 타이틀을 설정한다. |
| url : https://UserName.github.io |
| deploy: type: git repo: 본인의 Repository 경로 적기 |
5. Hexo 로컬에서 테스트
| $ hexo server |
서버가 구동되면 https://localhost:4000 에서 구동이 되는지 확인할수 있다.
위와 같이 뜬다면 성공!!
6. 배포하기
| $ hexo generate | hexo 설정을 통해 정적 리소스 생성 |
| $ hexo deploy | 배포하기 |
위의 명령어를 한번에 하는 방법도 있다.
| $ hexo deploy --generate |
배포가 완료되면 UserName.github.io에 접속해 정상적으로 배포되었는지 확인한다!!
※ hexo의 deploy기능을 통해 정상적으로 배포가 되었음에도 불구하고 업데이트가 되지 않거나 안된다면
$ hexo clean 후 위의 작업을 해보길 바란다.
※ https://hexo.io/themes/ 테마를 고르고 싶다면 theme가 적용된 페이지를 가져오면 된다.
Theme을 적용하기 위해서는 hexo를 clean후 재배포 해야한다.
| $ hexo clean |
| $ hexo deploy --generate |
참고 : https://www.holaxprogramming.com/2017/04/16/github-page-and-hexo/