Hexo 이미지 추가

• Hexo 블로그 작성 시, 이미지 파일을 추가하는 방법에 대해 배운다.
• 주요 참고자료
  • Asset Folders: https://hexo.io/docs/asset-folders
  • Asset Folders | Hexo - Static Site Generator | Tutorial 9: https://youtu.be/feIDVQ2tz0o

방법 1. Global Asset Folder

• 가장 간편한 방법은 source 폴더 아래 images 폴더를 별도로 만든다.
• 마크다운에서 아래와 같이 입력을 한다.

![](/images/image.jpg)

• 실제로 테스트를 해본다. (logo.md)
  • image file: https://upload.wikimedia.org/wikipedia/commons/e/e9/Hexo-logo.png

# hexo logo 테스트
- 이미지
![](/images/Hexo-logo.png)

• hexo server를 실행한 뒤 결과를 확인한다.

개요

• 간단하게 Hexo 블로그를 만들어 본다.

I. 필수 파일 설치

• 1단계: nodejs.org 다운로드
  • 설치가 완료 되었다면 간단하게 확인해본다.

$ node -v

• 2단계: git-scm.com 다운로드
  • 설치가 완료 되었다면 간단하게 확인해본다.

$ git --version

• 3단계: hexo 설치
  • hexo는 npm을 통해서 설치가 가능하다.

$ npm install -g hexo-cli

II. 깃허브 설정

• 두개의 깃허브 Repo를 생성한다.
  • 포스트 버전관리 (name: myblog)
  • 포스트 배포용 관리 (name: rain0430.github.io)
  • rain0430 대신에 각자의 username을 입력하면 된다.
• 이 때, myblog repo를 git clone을 통해 적당한 경로로 내려 받는다.

$ git clone your_git_repo_address.git

III. 블로그 만들기

• (옵션) 적당한 곳에 경로를 지정한 다음 다음과 같이 폴더를 만든다.

$ mkdir makeBlog # 만약 Powershell 이라면 mkdir 대신에 md를 쓴다. 
$ cd makeBlog

• 임의의 블로그 파일명을 만든다.

$ hexo init myblog
$ cd myblog
$ npm install
$ npm install hexo-server --save
$ npm install hexo-deployer-git --save

+ ERROR Deployer not found: git
+ hexo-deployer-git을 설치 하지 않으면 deploy시 위와 같은 ERROR가 발생합니다.

• _config.yml 파일 설정
  • 싸이트 정보 수정

title: 제목을 지어주세요
subtitle: 부제목을 지어주세요
description: description을 지어주세요
author: YourName

+ 블로그 URL 정보 설정

url: https://rain0430.github.io
root: /
permalink: :year/:month/:day/:title/
permalink_defaults:

+ 깃허브 연동

# Deployment
deploy:
  type: git
  repo: https://github.com/rain0430/rain0430.github.io.git
  branch: main

IV. 깃허브에 배포하기

• 배포 전, 터미널에서 localhost:4000 접속을 통해 화면이 뜨는지 확인해본다.

$ hexo generate
$ hexo server
INFO  Start processing
INFO  Hexo is running at http://localhost:4000 . Press Ctrl+C to stop.

• 화면 확인이 된 이후에는 깃허브에 배포한다.