- Obsidian으로 로컬에서 글을 작성후 Hugo + Bear Blog 테마 + Cloudflare Pages 조합으로 빠르고 무료로 개인 블로그를 배포
- GitHub를 통한 버전 관리와 자동 배포로 운영이 편리함. 글을 작성하고 저장, 커밋만 하면 즉시 퍼블리시가 완료
- 초기 세팅은 약간의 개발 지식이 필요하지만, 이후 워크플로우는 매우 단순해짐
- 경량으로 지속 가능한 블로깅 방법을 찾는 사람들에게 적합
상세 구성
-
Obsidian을 사용해 모든 글을 작성함
- 로컬 파일 저장 방식으로 모든 데이터가 본인 소유임
- Minimal 테마로 깔끔하고 방해 없는 인터페이스 제공
- iCloud를 통해 다양한 기기 간 무제한 동기화 가능 (Dropbox, Google Drive도 가능함)
- 퍼블리싱 하기
- Hugo: 초고속 정적 사이트 생성기
- Bear Blog 테마: 미니멀하고 빠른 블로그 테마
- GitHub + Cloudflare Pages: 무료로 웹사이트 배포 가능
- 장점: 구독료 없음, 벤더 종속 없음, 플랫폼 정책 변경 위험 없음
시스템 셋팅
- Hugo를 설치한 후 새 사이트를 생성함
hugo new site myblog cd myblog
- Bear Blog 테마를 추가
git init git submodule add https://github.com/janraasch/hugo-bearblog.git themes/hugo-bearblog
-
config.toml
파일을 Bear Blog 테마로 설정함theme = 'hugo-bearblog'
- Obsidian을 Hugo와 연결
- Hugo의
content/blog
폴더에 글을 작성 - Obsidian에서 "Open folder as vault" 기능을 사용해 해당 폴더를 연동
- 이렇게 하면 Obsidian에서 작성한 글이 바로 Hugo 사이트의 포스트로 연결됨
- Hugo의
- Obsidian에서 작성하는 글 상단에 Hugo용 Front Matter 템플릿을 추가함
+++ title= "Your Post Title" date= YYYY-MM-DD tags= ["post"] draft= true +++
- 퍼블리시할 준비가 되면
draft
값을false
로 변경함 - Hugo의 로컬 서버 기능을 사용해 글을 브라우저에서 미리보기 함
hugo server -D
- 새 GitHub 리포지토리를 생성하고 로컬 프로젝트를 연결함
git remote add origin https://github.com/yourusername/yourblog.git git add . git commit -m "Initial commit" git push -u origin main
- Cloudflare에 가입 후 Pages 프로젝트를 생성함
- GitHub 리포지토리를 연결하고 다음 빌드 설정 적용
- 빌드 명령어:
hugo --minify
- 출력 디렉토리:
public
- 빌드 명령어:
- GitHub 리포지토리를 연결하고 다음 빌드 설정 적용
퍼블리싱 워크플로우
- Obsidian에서 포스트 작성
- Front Matter 템플릿의
draft: true
를draft: false
로 변경 - GitHub에 커밋 및 푸시
git add . git commit -m "Publish new post" git push
- Cloudflare Pages가 자동으로 변경사항을 감지하고 사이트를 재빌드하여 1~2분 내에 적용됨
저도 Hugo 블로그 운용중이에요.
Obsidian에서 글 작성 후, Github repository push를 트리거로 Cloudflare pages에서 호스팅하는 방식을 사용합니다.
그리고 여기에 Algolia 검색 서비스 넣고 새 글 작성시마다 인덱싱을 위해 sh 파일 하나 만들어서 git, 인덱싱 등의 연계 명령어들 죄다 때려넣고 sh 명령 실행으로 글 발행하고 있어요.
작성한 글들을 종종 그래프뷰로 묶어서 살펴보는 재미때문에 주로 Obsidian을 사용합니다.
제가 며칠 전에 마침 Hugo로 블로그를 하나 만들어서 무척 반가운 내용이네요.
저는 푸시 시 GitHub pages로 배포하도록 세팅해서 이용하고 있습니다. ㅎㅎㅎ
옵시디언도 너무 좋아하지만 vscode에서 "Front Matter"라는 확장도구를 사용하시는 것을 추천합니다.
간이 CMS 기능을 제공하는데 아주 완벽하진 않아도 나쁘지 않더라구요.
저도 비슷하게 해오다가 이제는 github.com의 저장소에서 직접 작성하고 있습니다. (github pages가 jekyll을 자동으로 빌드해주는 기능을 이용)
저도 Hugo로 블로그 만들고 있어서 반갑네요!
Obsidian을 주 편집기로 쓸까도 했었는데 컴퓨터가 있는 환경이라면 VSCode가 더 나은 것 같습니다.
변경사항에 대해서 밀리초 단위로 반영하니 딱히 옵시디언의 필요성을 못 느끼겠더라구요.
Hacker News 의견
- 이 스택은 완전한 통제권을 제공함: 구독 없음, 공급업체 종속 없음, 플랫폼이 사라지거나 정책이 변경될 위험 없음
- 저자는 이를 통해 "완전한 통제"의 의미가 크게 변화했음을 보여줌
- 정적 블로그 운영은 자가 호스팅하기 가장 쉬운 시나리오 중 하나임
- 두 외부 회사의 무료 계층에 의존하면서 "완전한 통제"와 "플랫폼 사라질 위험 없음"을 논하는 것이 이상하게 느껴짐
- 1년 후 "내 블로그를 어떻게 재구축했는지"라는 다음 블로그 게시물을 기대함
- "내 블로그를 [next.js/Gatsby 등]로 어떻게 만들었는지"를 구글링하는 것이 재미있는 취미임
- 수백 개의 개발자 블로그가 블로그 구축 방법을 발표하는 글 외에는 게시물이 없음
- Obsidian 선택이 이 맥락에서 약간 이상하지만 흥미로움
- Hugo 프로젝트의 하위 폴더를 Obsidian에서 여는 대신 VSCode나 유사한 IDE에서 전체를 열 수 있음
- Obsidian의 마크다운 편집 경험은 일반적인 IDE와 다름
- Obsidian의 기능 세트를 선호한다면 선택이 이해됨
- 마크다운의 강점 중 하나는 다양한 편집기에 의해 지원된다는 것임
- 비슷한 설정을 가지고 있지만, 자산 압축/프론트매터 변환/번들을 Github 블로그 저장소로 푸시하는 커스텀 Obsidian 플러그인을 작성함
- Github는 Pelican을 사용해 HTML로 변환하고 VPS에 배포함
- WYSIWYG 인터페이스를 쉽게 가질 수 있음
- VSCode는 마크다운 블로깅에 충분함
- Hugo는 저장 시 페이지를 컴파일하므로 빠르게 반복 가능함
- 플랫폼이 사라지거나 정책이 변경될 위험은 여전히 존재함
- Jekyll은 큰 콘텐츠에 느리지만 Hugo는 빠름
- Github Pages, CloudFlare Pages, Netlify, Vercel 간에 쉽게 이동 가능함
- Kirby CMS가 가장 잘 맞음
- SSG는 몇 년 동안 방치되면 소프트웨어 부패가 발생할 수 있음
- Obsidian Publish를 사용하여 Huge, Github, Cloudflare를 제거할 수 있음