Deploy Hexo & Hexo-Admin

https://github.com/jaredly/hexo-admin

:::info
Hexo is a good static blog framwork, but everytime you need to upload a new blog, you have to login to the shell to upload your markdown file or upload it to your repo then wait for a auto or manully regenerate.
Hexo-Admin fix this problem perfectly by adding a online editing feature and a online deploy feature.
:::

Install Hexo & Hexo-Admin

We will install hexo & hexo-admin via docker-compose
The docker image used is: https://hub.docker.com/r/spurin/hexo

apt install docker.io docker-compose

Create a hexo.yml file in your working directory.

version: '3.1'

services:

  hexo:
    image: spurin/hexo
    container_name: hexo
    restart: always
    volumes:
      - /etc/hexo:/app
    ports:
      - "4000:4000"
    environment:
      - HEXO_SERVER_PORT=4000

Deploy docker container

docker-compose -f hexo.yml up

Manage docker container

docker container start hexo
docker container stop hexo
docker container restart hexo

The settings for Hexo could be managed in _config.yaml, see example below

# Hexo Configuration
## Docs: https://hexo.io/docs/configuration.html
## Source: https://github.com/hexojs/hexo/

# Site
title: Jindom's Blog
subtitle: '一个记笔记的地方'
description: ''
keywords:
author: Jindom
language: zh-CN
timezone: ''

# URL
## Set your site url here. For example, if you use GitHub Page, set url as 'https://username.github.io/project'
url: https://blog.jinzz.cc
permalink: :hash/
permalink_defaults:
pretty_urls:
  trailing_index: true # Set to false to remove trailing 'index.html' from permalinks
  trailing_html: true # Set to false to remove trailing '.html' from permalinks

# Directory
source_dir: source
public_dir: public
tag_dir: tags
archive_dir: archives
category_dir: categories
code_dir: downloads/code
i18n_dir: :lang
skip_render:

# Writing
new_post_name: :title.md # File name of new posts
default_layout: post
titlecase: false # Transform title into titlecase
external_link:
  enable: true # Open external links in new tab
  field: site # Apply to the whole site
  exclude: ''
filename_case: 0
render_drafts: false
post_asset_folder: false
relative_link: false
future: true
highlight:
  enable: true
  line_number: false
  auto_detect: false
  tab_replace: ''
  wrap: true
  hljs: false
prismjs:
  enable: false
  preprocess: true
  line_number: true
  tab_replace: ''

# Home page setting
# path: Root path for your blogs index page. (default = '')
# per_page: Posts displayed per page. (0 = disable pagination)
# order_by: Posts order. (Order by date descending by default)
index_generator:
  path: ''
  per_page: 20
  order_by: -date

# Category & Tag
default_category: uncategorized
category_map:
tag_map:

# Metadata elements
## https://developer.mozilla.org/en-US/docs/Web/HTML/Element/meta
meta_generator: true

# Date / Time format
## Hexo uses Moment.js to parse and display date
## You can customize the date format as defined in
## http://momentjs.com/docs/#/displaying/format/
date_format: YYYY-MM-DD
time_format: HH:mm:ss
## updated_option supports 'mtime', 'date', 'empty'
updated_option: 'mtime'

# Pagination
## Set per_page to 0 to disable pagination
per_page: 10
pagination_dir: page

# Include / Exclude file(s)
## include:/exclude: options only apply to the 'source/' folder
include:
exclude:
ignore:

# Extensions
## Plugins: https://hexo.io/plugins/
## Themes: https://hexo.io/themes/
theme: butterfly

# Deployment
## Docs: https://hexo.io/docs/one-command-deployment

# Local search
#search:
#  path: search.xml
#  field: post
#  content: true
#  template: ./search.xml

# hexo-admin authentification
admin:
  username: jindom
  password_hash: $2a$10$zo7YqCFauGWfG/QxTUHhj.P4/fGd3HDhOt20gv2vlEd/msGJLo1ua
  secret: jindomjindomjindomjindom
  deployCommand: './hexo-deploy.sh'

Install theme

The theme I used is: https://github.com/jerryc127/hexo-theme-butterfly

Go inside docker to execute following command to install the theme

docker exec -it hexo bash
git clone -b master https://github.com/jerryc127/hexo-theme-butterfly.git themes/butterfly
npm i hexo-theme-butterfly hexo-renderer-pug hexo-renderer-stylus

Remember to change the theme settings in the _config.yml

The theme settings could be changed in theme/butterfly/_config.yml
:::danger
Please note that some function or feature in the theme setting may require to install additional npm package, otherwise the hexo generate command would fail
RTFM: https://butterfly.js.org/posts/ceeb73f/
:::

Configure the Hexo-Admin

Enable the authentication

Go to Admin –> Settings in the http://server_ip:4000/admin/, and click “Setup authentification here”.

Type in necessary information, it will auto generate a config string, paste the config string in the end of the _config.yml file, restart hexo and it will enable authentication for Hexo-Admin backend.

Enable the deploy function

Create a hexo-deploy.sh in the root dir of the project, here is the example content.

hexo clean
hexo generate
hexo deploy

Then chmod g+x hexo-deploy.sh

Add deployCommand: './hexo-deploy.sh' in the admin section of the _config.yml file

Done