[Github×Hexo] 블로그 시작 준비하기

블로그 시작 준비하기

우연히 본 한 블로그에서 30분이면 github X hexo 블로그 개설이 가능하다는 말만 믿고 시작했다. ‘포스팅 길이도 짧고, 진짜 30분이면 되겠네!’ 는 나의 착각이었지만. 일단, 이 삽질을 정리하는 것만으로도 꽤 도움이 될 것 같아서 차근차근 정리해 보고자 한다. 아! 저는 MacOS를 사용하고 있습니다.

필수 요소

다음 세 사이트는 블로그 만들기를 위해 꼭 필요하다.

• Github
• Hexo
• Disqus

Hexo는 정적 블로그를 예쁘게 만들어 줄 하나의 프레임워크이다. Github는 블로그가 ‘올라갈’ 저장소, Disqus는 블로그에 '댓글 달기 기능’을 넣기 위해 꼭 필요하다.

대부분의 블로그에서 Disqus는 선택 사항이라고 이야기하지만, 솔직히 그렇잖아요. 댓글창 없는 블로그라뇨? 네? 그러니 한 번에 가입하고 시작하는 게 최고 편합니다.

Github와 Hexo, 시작 전 팁

아래의 리스트는 24 시간의 삽질을 통해 얻은 팁. 만약 블로그를 다시 만든다면, 리스트에 있는 것들은 꼭 꼭 지키면서 만들 것이다.

1. Github repository를 두 개 만든다.

   • 블로그 본체가 될 repo 하나와, 어디서든 hexo를 사용할 수 있는 업로드형 repo 하나.

   • 일반적인 블로그는 언제든 그 사이트에 들어가서 수정하면 되지만, 정적 블로그인 hexo는 설정 파일들(지금부터 만들어 볼)이 있어야지만 블로그의 내용을 수정할 수 있다.

   • 고로, repo를 두 개로 관리하면 언제 어디서든지 pull과 push로 포스팅 생성, 수정, 삭제가 가능하다.

   • themes 폴더의 경우, fork로 관리하면 편하다.

   • fork에 익숙하지 않을 경우 블로그 폴더 전체를 클라우드와 연결해 두는 것을 추천한다.

2. 게시글 포스팅 전에 기본 테마에서 벗어나자.

   • 테마는 먼저 정하는 게 좋다. 그래야 흐름 안 끊기고 블로그 만들 수 있음.
   • 현재 적용한 테마는 hueman이고, 대부분의 개발 블로그에서 이 테마를 사용한다. 블로그 내부 게시글 검색 가능하고, 카테고리로 dropdown 메뉴도 만들어지고……. 여러모로 편리한 테마인 듯.
   • 테마는 만들 수도 있지만 보통은 검색해서 적용하는 것 같다.
   • 기술 블로그에 어울릴 것 같은 테마는 대락 다음의 두 가지. (여러 가지 확인했지만 내부 검색 기능이 있고 깔끔한 테마가 생각보다 많지 않음.)
     • human
     • maupassant

3. 나만의 블로그 로고가 필요하다면? 미리 만들자. (닉네임과 블로그 이름 등, 자잘한 것들도 포함.)

   • 테마에 로고를 바로 적용, 배포하기 위해서는 미리 만드는 게 편하다.

   • 만약 테마의 로고 사이즈가 120 * 80이라면, 실제 로고 사이즈는 120의 배수 * 80의 배수로 만들 것. 사이즈가 다르면 뭉개지고, 120 * 80으로 맞추면 픽셀이 깨져서 보인다. 나는 두 배로 잡아서 240 * 160으로 만들었던 듯.

   • 현재 블로그 로고가 별로인 이유: 미리 안 만들어서.

4. git과 node.js가 설치되어 있지 않다면 hexo 설치 전에 미리 설치한다.

5. 블로그 개설 준비 시에 여러 블로그를 참고하기보다 한 블로그를 따른다.

   • 혹은 많은 글들을 미리 훑어보고 전반적인 흐름을 인지한 후에 시작한다.

   • 참고했던 블로그는 다음과 같다.

     • Eric Han’s IT Blog Powered by Hexo
     • Sixth Challenge v.6.2.24
     • 컴공녀의 개발 블로그
     • 꿈꾸는 태태태의 공간

   • 1, 3 번의 블로그를 주로 읽었던 것 같다. 1 번 블로그에 굉장히 잘 정리되어 있었다.

6. (너무 당연하지만) Github, Disqus에 미리 가입한다.

7. 포스팅 이후에 404가 나온다? 다음과 같은 이유일 수 있다.

   1. 포스트가 없는 상태에서 hello-world.md 파일을 지울 경우 404를 뿜는다! 첫 포스팅 전까지는 hello-world.md 파일 유지를 추천. (어떤 블로그에도 없던 내용…….)
   2. local에서 테스트 할 때엔 포스트를 제대로 읽지만, git에 올려서 확인하면 index.html이 없다며 404가 나타난다면?! 아마 99%의 확률로 파일명이 '한글’일 것. 직접 테스트한 결과이다. 역시 파일명은 영어. 무조건 영어. 대신 파일 내용 안의 title은 한글로 적어도 상관없다. (너무 당연한 이야기라 어떤 블로그에도 없던 사항. 나는 왜 당연한 것을 두고 삽질을 하였나……………)

8. 마크다운 파일 이름은 ‘영어’ 혹은 '숫자’이어야 하며, 꼭 '소문자’를 사용하자.

   • 대문자로 사용할 경우 hexo-autonofollow 플러그인 사용에 문제가 생긴다. (문제: hexo-autonofollow이 만드는 url은 모두 소문자로 이루어진다. 대문자로 만들면 웹에서 검색되는 url과 실제 접근해야 하는 url이 달라진다. 404 not found 보고 싶으시면 대문자 사용하시면 됩니다.)

마크다운 에디터 추천

그리고 추가적으로, Hexo에 글을 포스팅 할 때 마크다운은 필수라고 해도 과언이 아니다. 마크다운을 편하게 쓰도록 도와주는 에디터가 여럿 존재하므로 취향에 맞춰서 골라 사용하면 된다. 아래 세 가지가 눈에 들어왔던 깔끔한 에디터.

• Typora (현재 사용 중인 에디터.)
• Writed (사용했던 에디터. 앱을 지우지는 않았지만 Typora에 일시 정착.)
• Atom (텍스트 에디터인 아톰을 마크다운 에디터로 사용할 수도 있다. 한번 써 보고 싶은 생각이 들긴 함.)