오늘은 빠르고 간결하기로 소문난 정적 사이트 생성기(Static Site Generator, SSG), Hugo를 사용하여 macOS 환경에서 나만의 블로그를 만드는 방법을 알아보겠습니다. 워드프레스와 같은 동적 사이트와 달리, Hugo는 데이터베이스나 복잡한 서버 로직 없이 순수 HTML, CSS, JS 파일로 웹사이트를 생성합니다. 덕분에 비교할 수 없이 빠른 속도, 강력한 보안, 그리고 무료에 가까운 호스팅 비용이라는 엄청난 장점을 가집니다.
본격적인 시작에 앞서 준비물 확인하기#
딱 한 가지만 준비하면 됩니다. 바로 Homebrew입니다. Homebrew는 macOS용 패키지 관리자로, 터미널 명령 한 줄로 각종 소프트웨어를 간단하게 설치할 수 있게 해주는 필수 도구입니다. 터미널을 열고 아래 명령어를 입력해 Homebrew가 설치되어 있는지 확인해 보세요.
brew --version
만약 버전 정보가 출력된다면 이미 설치된 것입니다. command not found와 같은 메시지가 나온다면, 아래 명령어를 터미널에 붙여넣어 Homebrew를 설치해 주세요.
/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"
Hugo 설치하기#
Homebrew가 준비되었다면 Hugo 설치는 식은 죽 먹기입니다. 터미널에 다음 명령어를 입력하세요.
brew install hugo
설치가 완료되면 Homebrew 때와 마찬가지로 버전 확인 명령어로 제대로 설치되었는지 확인합니다.
hugo version
버전 정보가 보인다면 성공입니다. 이제 블로그를 만들 모든 준비가 끝났습니다.
내 블로그 사이트 생성하기#
이제 Hugo를 이용해 블로그의 뼈대를 만들어 보겠습니다. 원하는 경로로 이동한 후, 다음 명령어를 실행하세요. my-blog 부분은 여러분이 원하는 폴더 이름으로 변경해도 좋습니다.
hugo new site my-blog
명령을 실행하면 my-blog라는 폴더가 생성되고, 그 안에 Hugo 사이트를 구성하는 기본 폴더와 파일들이 자동으로 만들어집니다.
생성된 my-blog 폴더로 이동해 볼까요?
cd my-blog
ls -l 명령어로 폴더 구조를 살펴보면 다음과 같은 폴더들이 보일 겁니다.
archetypes: 새 콘텐츠 파일의 기본 양식을 정의합니다.content: 여러분이 작성할 블로그 글(마크다운 파일)이 저장되는 곳입니다.data: 사이트에서 사용할 수 있는 구조화된 데이터 파일(YAML, JSON, TOML)을 저장합니다.layouts: 웹사이트의 HTML 템플릿 파일이 위치합니다.static: 이미지, CSS, JavaScript 파일 등 정적 자원들을 저장합니다.themes: 블로그의 디자인을 담당하는 테마가 설치되는 폴더입니다.hugo.toml: 사이트의 전반적인 설정을 담당하는 가장 중요한 파일입니다.
블로그 디자인(테마) 입히기#
뼈대만 있는 블로그는 의미가 없겠죠? 이제 디자인을 입힐 차례입니다. Hugo는 전 세계 개발자들이 만들어 공유하는 수많은 무료 테마를 제공합니다.
Hugo 공식 테마 사이트 에서 마음에 드는 테마를 골라보세요.
이 가이드에서는 입문용으로 가장 많이 사용되는 Ananke 테마를 기준으로 설명하겠습니다.
먼저, 방금 만든 내 블로그 폴더를 Git 저장소로 초기화해야 합니다. 테마는 보통 Git Submodule이라는 기능으로 관리하는 것이 가장 편리하기 때문입니다.
git init
이제 아래 명령어로 Ananke 테마를 themes 폴더 안에 설치합니다.
git submodule add https://github.com/theNewDynamic/gohugo-theme-ananke.git themes/ananke
테마 설치 후, Hugo에게 우리가 이 테마를 사용할 것이라고 알려줘야 합니다. hugo.toml 파일을 열어 다음 한 줄을 추가해 주세요.
theme = 'ananke'
첫 번째 글 작성하기#
드디어 첫 번째 글을 작성할 시간입니다. Hugo는 명령어를 통해 아주 쉽게 새 글의 초안 파일을 만들 수 있습니다.
hugo new posts/my-first-post.md
이 명령은 content/posts 폴더 안에 my-first-post.md 라는 마크다운 파일을 생성합니다. 파일을 열어보면 상단에 다음과 같은 Front Matter가 자동으로 생성된 것을 볼 수 있습니다.
+++
title: "My First Post"
date: 2025-06-25T16:29:43+09:00
draft: true
+++
여기서 가장 중요한 것은 draft: true 입니다. 이는 이 글이 아직 초안 상태임을 의미합니다. 글을 발행하려면 이 값을 false로 변경해야 합니다.
이제 Front Matter 아래에 마크다운 문법으로 자유롭게 글을 작성해 보세요.
+++
date = '2025-06-25T22:46:21+09:00'
draft = false
title = 'My First Post'
+++
## It is first post
Hello world!
로컬 서버에서 블로그 확인하기#
내가 작성한 글이 블로그에 어떻게 보이는지 확인해 볼까요? Hugo는 내 컴퓨터에서 바로 사이트를 확인해 볼 수 있는 강력한 로컬 서버 기능을 내장하고 있습니다.
터미널에서 아래 명령어를 실행하세요.
hugo server -D
여기서 -D 옵션은 draft: true 상태인 초안 글까지 모두 포함해서 보여달라는 의미입니다. 개발 중에는 아주 유용한 옵션이니 기억해 두세요.
서버가 실행되면 터미널에 다음과 같은 메시지가 나타납니다.
Web Server is available at http://localhost:1313/ (bind address 127.0.0.1)
이제 웹 브라우저를 열고 주소창에 http://localhost:1313 을 입력해 보세요.
Ananke 테마가 적용된 여러분의 첫 블로그가 눈앞에 나타났을 겁니다! 방금 작성한 my-first-post를 클릭해서 들어가 보세요. 글의 내용을 수정하고 저장하면, 브라우저가 자동으로 새로고침되며 변경사항이 즉시 반영되는 것을 확인할 수 있습니다.
마무리#
축하합니다! 여러분은 이제 Hugo로 만든 자신만의 블로그를 갖게 되었습니다.
오늘 우리는 macOS 환경에서 Hugo를 설치하고, 새 사이트를 만들고, 테마를 적용하고, 첫 글을 작성하여 로컬 서버에서 확인하는 전 과정을 함께했습니다.
궁금한 점이 있다면 언제든지 댓글로 질문해 주세요.
참조
- Hugo 공식 사이트: https://gohugo.io/
- Hugo 공식 테마: https://themes.gohugo.io/
- Homebrew: https://brew.sh/