개인 블로그 구축: Gitee와 Hexo 활용

Hexo를 사용하여 개인 블로그를 구축하려면 다음과 같은 소프트웨어가 필요합니다.

  • Git (명령어 git 제공): 공식 사이트
  • Node.js (Hexo 의존성): 공식 사이트
  • 7z (압축 프로그램): 공식 사이트

다음 링크는 필요한 도구들을 통합한 파일입니다. 링크, 암호: im6o

Gitee 계정도 필요하며, 여기서 호스팅할 저장소를 생성합니다.

설치 과정

Node.js, Git, 7z 등 기본적인 소프트웨어 설치는 생략하겠습니다. 주요 내용은 Hexo의 설치 및 설정입니다. 명령줄에서 git, npm 명령어가 제대로 작동하는지 확인하세요.

NPM 설정

국내 미러를 사용하여 속도를 개선합니다.

npm config set registry https://registry.npm.taobao.org
npm info hexo

Hexo 설치

전역으로 Hexo를 설치합니다.

npm install -g hexo

테스트 디렉토리를 생성하고 필요한 패키지를 설치합니다.

hexo init myblog
cd myblog
npm install

블로그 서버를 실행합니다.

hexo clean
hexo generate
hexo server -p 80

브라우저에서 http://localhost에 접속하여 결과를 확인합니다.

테마 변경

기본 테마가 마음에 들지 않으면 새로운 테마를 적용할 수 있습니다. 예를 들어 "NexT" 테마를 사용해보겠습니다.

  1. NexT 테마 다운로드 후 themes 디렉토리에 복사합니다.
  2. _config.yml 파일 수정:
theme: next

변경된 설정을 반영하기 위해 다시 서비스를 시작합니다.

hexo clean
hexo generate
hexo server -p 80

게시물 작성

새로운 게시물을 작성합니다.

hexo new "My First Post"

게시물은 source/_posts 디렉토리에 Markdown 형식으로 저장됩니다. Markdown 문법에 대한 자세한 정보는 관련 문서를 참고하세요.

Gitee에 배포

  1. Gitee에서 저장소를 생성합니다.
  2. Hexo 구성 파일(_config.yml)에 다음 내용 추가:
deploy:
  type: git
  repo: https://gitee.com/yourname/yourrepo.git
  1. 배포 플러그인 설치 및 초기 설정:
npm install hexo-deployer-git --save
git config --global user.email "your-email@example.com"
git config --global user.name "Your Name"
  1. 배포 실행:
hexo deploy

배포 중 Gitee 로그인 정보를 입력해야 합니다.

  1. Gitee Pages 설정 활성화 후 저장소 URL로 접속합니다.

이미지 사용 문제 해결

이미지를 포함한 게시물을 처리하려면 다음 플러그인을 설치합니다.

npm install hexo-asset-image --save

또한 _config.yml에 다음 옵션을 추가합니다.

post_asset_folder: true

새로운 게시물을 생성하면 자동으로 폴더가 생성되며, 해당 폴더에 이미지를 넣으면 정상적으로 표시됩니다.

hexo new "Image Test"

Markdown 파일에서 이미지 경로를 상대 경로로 지정합니다.

태그: Hexo Gitee markdown

7월 5일 18:20에 게시됨