Hugo와 Jekyll: 무엇이고 어떻게 사용하는가

 Hugo와 Jekyll: 무엇이고 어떻게 사용하는가

HugoJekyll정적 사이트 생성기(Static Site Generator, SSG)로, 빠르고 효율적인 웹사이트 또는 블로그를 구축하는 데 사용됩니다. 이들은 동적 서버 없이 정적 파일(HTML, CSS, JS)을 생성해 웹사이트를 배포하므로, 속도와 보안이 뛰어나며 유지보수가 간편합니다. 아래는 Hugo와 Jekyll의 개요와 사용 방법입니다.


1. Hugo와 Jekyll의 비교



항목HugoJekyll
사용 언어GoRuby
빌드 속도매우 빠름상대적으로 느림
주요 용도정적 블로그, 포트폴리오, 사이트블로그, 문서 사이트
호환 플랫폼GitHub Pages, Netlify, VercelGitHub Pages
테마 지원다양한 무료/유료 테마GitHub Pages 기본 테마와 호환
확장성플러그인 필요 없음Ruby 플러그인 필요

2. Hugo 사용 방법

1) Hugo 설치

  • macOS:
    bash
    brew install hugo
  • Ubuntu:
    bash
    sudo apt-get install hugo
  • Windows:
    Hugo의 공식 사이트에서 바이너리를 다운로드해 설치합니다.

2) 새 프로젝트 생성

bash
hugo new site my-blog cd my-blog

3) 테마 추가

Hugo는 다양한 테마를 제공합니다. 예를 들어 Ananke 테마를 추가합니다:

bash
git init git submodule add https://github.com/theNewDynamic/gohugo-theme-ananke themes/ananke

4) 설정 파일 수정

config.toml 파일에 다음을 추가합니다:

toml
baseURL = "https://your-site.com/" languageCode = "en-us" title = "My Hugo Blog" theme = "ananke"

5) 새 글 작성

bash
hugo new posts/my-first-post.md

작성된 파일은 content/posts/my-first-post.md에 저장됩니다.

6) 로컬 서버 실행

bash
hugo server -D

브라우저에서 http://localhost:1313로 접속해 사이트를 확인할 수 있습니다.

7) 정적 파일 생성 및 배포

bash
hugo --minify

빌드된 파일은 public/ 디렉터리에 저장되며, 이를 GitHub Pages, Netlify 등에 배포할 수 있습니다.


3. Jekyll 사용 방법

1) Jekyll 설치

Jekyll은 Ruby 기반이므로, 먼저 Ruby를 설치합니다:

  • macOS: Homebrew 사용:
    bash
    brew install ruby
  • Ubuntu:
    bash
    sudo apt-get install ruby-full

그런 다음 Jekyll을 설치합니다:

bash
gem install jekyll bundler

2) 새 프로젝트 생성

bash
jekyll new my-blog cd my-blog

3) 설정 파일 수정

_config.yml 파일에 다음을 추가합니다:

yaml
title: My Jekyll Blog description: "A simple blog built with Jekyll" baseurl: "" url: "https://your-site.github.io"

4) 로컬 서버 실행

bash
bundle exec jekyll serve

브라우저에서 http://localhost:4000으로 접속해 사이트를 미리보기합니다.

5) 새 글 작성

_posts 폴더에 다음과 같은 파일을 생성합니다:

perl
_posts/2024-10-23-my-first-post.md

내용 예시:

markdown
--- layout: post title: "My First Post" date: 2024-10-23 --- Welcome to my first blog post on Jekyll!

6) GitHub Pages 배포

  1. GitHub 리포지토리 생성.

  2. 로컬 프로젝트를 리포지토리에 연결:

    bash
    git remote add origin https://github.com/username/my-blog.git git branch -M main git push -u origin main
  3. GitHub Pages 설정:
    GitHub의 Settings > Pages에서 main 브랜치를 배포 대상으로 설정합니다.


4. 배포 플랫폼 선택

  • GitHub Pages: Jekyll과 Hugo 모두 쉽게 배포 가능.
  • Netlify: CI/CD 파이프라인을 통해 Hugo/Jekyll 사이트를 자동 배포.
  • Vercel: 빠른 배포와 글로벌 캐싱 지원.
  • AWS S3 + CloudFront: 대규모 트래픽 처리를 위한 배포.

5. 결론

HugoJekyll은 정적 사이트 구축에 강력한 도구입니다. Hugo는 빠른 속도와 간편한 설정으로 유명하며, Jekyll은 GitHub Pages와의 호환성에서 강점을 가집니다. 두 생성기를 활용하면 고품질의 블로그와 웹사이트를 쉽게 구축하고 배포할 수 있습니다.