휴고와 함께 블로그를 만드는 방법

• 소개
• 전제 조건
• 1 단계 : Hugo 프로그램 설치
• 2 단계 : 사이트 구축
• 3 단계 : Hugo 저장소에서 테마 설치
• 4 단계 : 기본 구성 변경
• 5 단계 : 컨텐츠 작성
• 6 단계 : Hugo 서버로 컨텐츠 조정
• 7 단계 : 사이트 게시

소개

Hugo는 매우 빠른 렌더링 속도와 뛰어난 사용 편의성을 갖춘 정적 사이트 생성기입니다. 모든 컨텐츠 지향 기능 덕분에 환경을 구축하지 않고 컨텐츠 작성에 항상 집중할 수 있습니다.

• Hugo를 사용하면 지루한 종속성이나 데이터베이스에 관계없이 몇 분 안에 실행중인 정적 사이트를 구축 할 수 있습니다.
• 가장 편리한 쓰기 스타일 인 Markdown으로 콘텐츠를 작성하고 웹에서 변경 한 내용을 즉시 볼 수 있습니다.
• 또한 Hugo의 풍성한 테마 저장소와 빠르게 성장하는 커뮤니티를 최대한 활용할 수 있습니다.

이 튜토리얼에서는 Hugo를 설치하고 사용하여 CentOS 기반 Vultr LEMP 서버 인스턴스에서 정적 블로그 사이트를 빌드하는 방법을 보여줍니다.

전제 조건

sudo 권한이있는 루트가 아닌 사용자로 인스턴스에 로그인하십시오. 이 기사 에서 그러한 사용자를 작성하는 방법을 참조 하십시오 .

1 단계 : Hugo 프로그램 설치

Hugo는 거의 모든 주류 플랫폼에 설치할 수 있습니다. CentOS의 경우 최신 프로그램 파일을 .tar.gz아카이브 에 다운로드하여 편리한 위치에 압축 해제하면됩니다. 작성 당시 최신 버전은 0.15입니다.

sudo yum update -y
sudo yum install git -y
cd ~
wget https://github.com/spf13/hugo/releases/download/v0.15/hugo_0.15_linux_amd64.tar.gz
tar -zxvf hugo_0.15_linux_amd64.tar.gz
sudo mv hugo_0.15_linux_amd64/hugo_0.15_linux_amd64 /usr/local/bin/hugo

다음 명령으로 설치를 테스트하십시오.

 hugo version

2 단계 : 사이트 구축

Hugo를 사용하면 서버의 모든 폴더에서 사이트를 구축 할 수 있습니다. 여기에서는 mysite/홈 디렉토리 아래 의 디렉토리 에 사이트를 구축했습니다 .

cd ~
hugo new site ~/mysite

사이트의 아키텍처를 보려면 다음 명령을 실행하십시오.

cd mysite
ls -lF

보시다시피이 사이트의 현재 아키텍처는 다음과 유사합니다.

원형

config.toml

함유량/

데이터/

레이아웃 /

공전/

다른 두 생성 할 디렉토리,로 themes/와 public/하는 휴고 사이트의 전체 구조는 컴팩트하면서도 포괄적이다.

우선, 콘텐츠가 디렉토리에 저장되어 있어야합니다 content/.

3 단계 : Hugo 저장소에서 테마 설치

Hugo 저장소에서 모든 테마를 설치하려면 다음 명령을 실행하십시오. themes/사이트 디렉토리에 이름이 지정된 디렉토리가 생성 되고 Hugo 테마 저장소에서 모든 테마가 다운로드됩니다.

cd ~/mysite/
git clone --depth 1 --recursive https://github.com/spf13/hugoThemes.git themes

단일 테마 만 설치하려면 Hugo 테마 저장소 를 방문 하여 좋아하는 테마를 결정하십시오. URL을 복사하여 git clone아래 명령에 붙여 넣으 십시오.

cd ~/mysite/
mkdir themes
cd themes
git clone https://github.com/jaden/twentyfourteen

4 단계 : 기본 구성 변경

config.toml사이트 디렉토리에 이름이 지정된 파일 에는 Hugo 사이트의 글로벌 구성이 포함되어 있습니다. 텍스트 편집기로 파일을 편집하여 아래 나열된 기본 구성을 변경하십시오. 특정 조건에 따라 값을 교체해야합니다.

baseurl = "http://[YourSiteIP]/"
languageCode = "en-us"
title = "Your Site Name"
theme = "twentyfourteen"

5 단계 : 컨텐츠 작성

사이트 디렉토리에서 다음 명령을 입력하여 디렉토리에 컨텐츠 페이지를 작성하십시오 ~/mysite/content/post/.

cd ~/mysite/
hugo new post/about.md

텍스트 편집기에서 파일을 엽니 다. 파일 형식은 다음과 같아야합니다.

+++
date = "2015-12-25T03:21:23Z"
draft = true
title = "about"

+++

두 줄 사이에는 +++콘텐츠 페이지에 대한 메타 정보가 있습니다. 여기서 줄을 제거하고 draft = true원하는대로 제목 줄을 수정할 수 있습니다 .

두 번째 +++줄 아래 에 웹 페이지에 표시 할 컨텐츠를 추가하십시오. 마크 다운 언어로 콘텐츠를 작성해야합니다.

## This is an H2 headline

Text goes here.

이 편집을 마친 후에는 나중에 사용할 수 있도록 텍스트 편집기를 열어 두십시오.

6 단계 : Hugo 서버로 컨텐츠 조정

Hugo의 내장 웹 서버를 사용하여 사이트를 배포 할 수 있으며 텍스트 편집기에서 콘텐츠를 수정하자마자 웹 페이지에 변경 사항을 즉시 표시 할 수 있습니다.

다른 터미널을 열고 iptablesHugo 서버의 기본 포트 1313에서 사이트에 액세스 할 수 있도록 규칙을 구성하십시오 .

sudo iptables -I INPUT -p tcp --dport 1313 -j ACCEPT

Hugo 서버를 시작하십시오.

hugo server --bind="[YourServerIP]"

브라우저에서 사이트를 방문하십시오.

http://[YourServerIP]:1313

이제 이전 터미널에서 페이지 파일의 내용을 편집하거나 페이지 파일을 추가 / 제거 할 수 있습니다. content/디렉토리의 모든 수정 사항이 브라우저 화면에 동시에 반영됩니다. 보다 나은 작성 환경을 위해 수정 사항을 항상 즉시 볼 수 있기 때문에 바쁜 블로거에게 유용한 기능입니다.

편집 Ctrl+C이 끝나면를 눌러 Hugo 서버를 중지하십시오.

7 단계 : 사이트 게시

이제 웹에 사이트를 게시 할 차례입니다. 다음 명령을 실행하면 Hugo는 public/디렉토리 내에서 공개하기에 적합한 모든 정적 컨텐츠를 생성합니다 .

cd ~/mysite
hugo

참고 : Hugo는 위 명령을 실행할 때 이전에 생성 된 이전 파일을 삭제하지 않습니다. 예기치 않은 결과를 피하기 위해 다음 명령과 같이 명령 public/을 실행하기 전에 항상 디렉토리를 삭제 hugo하거나 새 출력 대상을 지정할 수 있습니다.

hugo --destination=public2

Nginx 웹 서버가 이미 서버에서 실행 중이므로 ~/mysite/public/디렉토리 또는 다른 사용자 정의 대상 디렉토리의 내용을 웹 디렉토리에 복사하기 만하면 /usr/share/nginx/html/됩니다.

원본 파일을 삭제하십시오.

cd /usr/share/nginx/html/
sudo rm -rf background.jpg index.php logo.png

정적 사이트 파일을 웹 디렉토리에 복사하십시오.

cd ~/mysite/public
sudo cp -R ~/mysite/public/. /usr/share/nginx/html/

그게 다야. 이제 브라우저에서 초고속 정적 사이트를 방문 할 수 있습니다 : http://[YourServerIP].

자세한 내용을 보려면 명령을 사용 hugo help하거나 Hugo 공식 웹 사이트를 방문하십시오 .