Contents
그동안 개발을 하면서 헤맸던 부분들 정리해서 공유하고 싶었던 마음이 있었습니다.
2021년 부터는 매월 하나의 포스트 이상은 작성해보자는 계획을 세우고 일단 블로그를 구성하였습니다.
첫 포스트는 그 블로그를 구성한 이야기 입니다.
1. Hugo 설치 & 사이트 생성
1.1 Github 에서 Repository 2개 생성
- Repo 1: Hugo의 컨테츠, 설정, 소스파일을 포함할 Repository
(blog
사용. 이름 상관 없음. Private 가능) - Repo 2: github.io를 통해서 static site를 제공할 Repository
(<USERNAME>
.github.io Public Only)
1.2 Repo 1에 Hugo site 생성
git clone https://github.com/<USERNAME>/blog
1.3 Hugo 설치 (https://gohugo.io/getting-started/installing/)
Homebrew (macOS / Linux)
brew install hugo
MacPorts (macOS)
port install hugo
Chocolatey (Windows)
choco install hugo -confirm
or
choco install hugo-extended -confirm
Scoop (Windows)
scoop install hugo
or
scoop install hugo-extended
1.4 Hugo Site 생성
hugo new site blog -f yaml --force
git clone
으로 blog 디렉토리가 있기 때문에--force
로 생성합니다.yaml
이 익숙해서yaml
로 생성하였으면 기본은toml
입니다.
1.5 static site repositry submodule 등록
<USERNAME>.github.io Repo
를 blog의 submodule로 등록합니다.
git submodule add https://github.com/<USERNAME>/<USERNAME>.github.io.git public
2. Hugo Theme 적용
2.1 테마 선택
- https://themes.gohugo.io/ 에서 Demo사이트를 확인하여 원하는 테마를 고릅니다.
- 선택한 테마의 가이드 혹은 github 확인
- 테마를 서브 모듈로 추가 (아래는 uBlogger)
git submodule add https://github.com/upagge/uBlogger.git themes/uBlogger
2.2 테마에 맞게 config.yaml 수정
- 테마 설정을 보다보면
yaml
을 쓰는 것도 있고toml
을 쓰는것도 있어 아래 사이트에서 변환하면서 설정하였습니다. - https://www.convertsimple.com/
3. Hugo Plugin
3.1 설치
- Webstorm :
Preference - Plugin - Market
에서Hugo Integration
플러그인 검색 후 추가
3.2 Local에서 실행
Run/Debug Configuratio
에Hugo Run
추가 후 실행
3.3 Post 추가
blog/content
에posts
디렉토리 생성 후New -> Hugo New
로 생성