Obsidian + Hugo + GitHub + Cloudflare로 블로그 운영 하는 법

• 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 사이트의 포스트로 연결됨
• 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

퍼블리싱 워크플로우

• Obsidian에서 포스트 작성
• Front Matter 템플릿의 draft: true를 draft: false로 변경
• GitHub에 커밋 및 푸시
  git add . git commit -m "Publish new post" git push
• Cloudflare Pages가 자동으로 변경사항을 감지하고 사이트를 재빌드하여 1~2분 내에 적용됨