블로그를 시작하면서 마주치는 선택지와 내가 선택한 것들을 정리해보고자 한다.

플랫폼

기존의 blog 서비스 ( Tistory, Naver, velog 등… )

• 안정적으로 서비스 됨. ( 배포, 댓글 이런거 신경 안 써도 됨. )
• 미리 어느정도 템플릿이 잡혀있음.
  • 커스터마이징에 제한.

Github Pages를 이용

• 배포, 댓글 같은 점들을 내가 직접 설정
• Markdown 이용.
• 기존의 Blog 서비스를 이용하는게 더 stable하다는건 알지만, 그래도 뭔가 새로운 시도를 해보고싶어서 Github Pages를 이용해 배포하는걸로 결정!
  • + 올해 들어 Obsidian을 통해 markdown으로 생각이나 정보같은걸 정리하고 있었는데, 이 방식을 통해 Markdown 문서를 더 많이 작성하면 Markdown에 더 익숙해 질 것 같았다!

블로그(Github Pages) 프레임워크(Static Site Generator)

Jekyll

• Ruby 기반
• Github Pages에서 사용하고 있어 호환성이 높다
• 윈도우를 공식적으로ㅠㅠ 지원ㅠㅠ 하지않음ㅠㅠ.

Hexo

• js 기반
• 만든 사람이 대만인.

Hugo

• Go 기반
• 반응속도가 다른 프레임워크들 보다 월등히 빠르다.
• 윈도우를 공 식 적 으 로 지 원 함.

Hugo를 선택한 이유

• Star 갯수 (2023. 01. 22 기준)
  • Hugo (64.9k) »»> Jekyll (46k) »> hexo ( 36.1k )
• Windows를 공식적으로 지원한다는 점.
• Go를 이번 기회에 한 번 써보고 싶었음.
• 소위 홍대병이라고 하는 힙스터 기질이 발동해서(….)
• + Hugo Themes에서 Theme를 찾아보는데, 맘에 드는 Theme를 발견했다.
  (반응형도 잘 되길래 더 꽂혀버림…)

Hugo 설치 및 설정

• Windows 환경에 Hugo를 설치할 때, 다양한 방법이 있지만 이미 빌드된 바이너리들을 사용하는 방법으로 설치하기로 했다.
  • Hugo의 Github Repository의 최신 release를 다운받고, 시스템 전역변수에 Path로 추가해준다.

사이트 생성

• hugo new site myHugo 명령어를 통해 새로운 site를 생성한다.

테마 추가

• Hugo Themes에 들어가서 원하는 테마를 찾아본다.
• 본인의 경우, Hugo Theme Stack 이라는 테마를 선택함.
• 웬만하면 Downloads 링크가 Github Repository로 연결되어 있을 것인데, 해당 Repo를 Site 폴더의 submodule로 추가해준다.
  

  git init
  git submodule add [theme repo 주소] themes/[테마 이름] 
  

• 이후 추가적인 설정을 위해 theme 폴더 안의 config 파일이나, site 폴더 안의 config 파일을 수정한다.

글 쓰기

• hugo new post/파일명.md 를 통해 새 문서를 만든다.
• 이러면 Hugo가 해당 위치에 Front Matter라고 부르는 해당 글에대한 metadata가 미리 작성되어 있는 Markdown 파일을 만들어 준다.

로컬단에서 확인해보기

• hugo server 명령어를 통해 로컬단에서 미리 블로그가 어떻게 보일지를 확인할 수 있다.
• 보통 http://localhost:1313/로 접근할 수 있다.
• VS Code에서 Live Server 쓰는것 마냥 변경사항이 바로바로 반영되어서 확인하기 편했다!

Build 및 Git에 올리기

Build

• hugo -t [테마 이름] 명령어를 사용하면, /public 폴더 안에 빌드된 Site 데이터들이 저장된다.
• 참고로 밑에서 git에서 submodule을 추가할 때, public 폴더가 이미 존재하면 추가가 안되니 먼저 submodule add를 해주고 build 작업을 진행해야 한다.

Git에 올리기

• 아까 Theme 설치할 때, Git init 작업을 진행했으므로, init은 생략한다.

  git remote add origin [Hugo Site 폴더 저장할 Repo 주소]
  git submodule add -b master [실제 Github Pages에 올릴 Repo 주소] public
  

  이후 두 Git Repo에 대해 각각 add -> commit -> push 과정을 수행하면 된다.

참고한 글

• IALY1595님 블로그
  • 되게 자세하게 문서화 해주시고, 추가로 Theme Customizing에 관한 글도 써두셔서 블로그 만드는데 도움이 정말 많이 되었습니다… 감사합니다 (_ _)
• self invest님 블로그
  • 마찬가지로 자세히 문서화 해주시고, 추가로 github action으로 자동화하는 방법까지 작성해주셨다. 아직 자동화까진 적용 안해봤지만 참고할 예정… 감사합니다 (_ _)