creating a new hexo blog

Posted on Edited on

Welcome to Nate Liu’s Blog! This is step by step I created this blog with Hexo.

Step 1 install Git and Node

Official Website:

Git

Node

1
2
brew install git
brew install node

Step 2 install hexo

1
npm install hexo-cli -g

Step 3 initilize hexo-blog

1
2
3
4
hexo init hexo-blog
cd hexo-blog
npm install
hexo server

Step 4 generate html pages

1
2
3
hexo generate 
or
hexo g

Step 5 testing in local

1
2
3
hexo server 
or 
hexo s

Step 6 deploy into github.io with One-command-deployment

1
npm install hexo-deployer-git --save

modify _config.yml, go to the end and add following lines:

1
2
3
4
deploy:
  type: git
  repo: https://github.com/nateliu/nateliu.github.io.git
  branch: master

Step 7 launch with following lines

1
2
3
hexo clean
hexo generate
hexo deploy

Step 8 go to chrome to see the result.

My Hexo Blog: My-Hexo-Blog

Step 9 my source for hexo-blog

hexo-blog

Step 10 using GitHub actions automatically deploy hexo

  1. Generate public and private keys
    1
    2
    3
    cd hexo-blog
    git checkout main
    ssh-keygen -t rsa -b 4096 -C "jinliangliu@163.com" -f github-deploy-key -N ""
    Two files are generated in the directory:
  • github-deploy-key.pub —Public key file
  • github-deploy-key —Private key file

    Remember to add public and private keys to .gitignore Medium!!!

  1. GitHub adds public key
    In GitHub, in hexo-blog project, follow the Settings->Deploye keys->Add deploy key Find the corresponding page and add the public key. In this page, Title You can customize it,Key Add github-deploy-key.pub The contents of the document.

    Don’t copy more spaces!!!
    Remember to check it Allow write access. Otherwise, deployment will not be possible. Use below command to copy the contents into pasteboard

    1
    pbcopy < github-deploy-key.pub

  2. GitHub adds private key
    In GitHub, in nateliu.github.io project, follow the Settings->Secrets->Add a new secrets Find the corresponding page and add the private key. In this pageNameYou can customize it,ValueAdd github-deploy-key The contents of the document.

    Don’t copy more spaces!!!
    Use below command to copy the contents into pasteboard

    1
    pbcopy < github-deploy-key

  3. Create compilation script
    Create it in the hexo-blog branch (I’m here main branch).github/workflows/ci.yml The contents of the document are as follows:

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    name: Build and Deploy
    on:
      push:
        branches:
          - main
    jobs:
      hexo-blog:
        runs-on: ubuntu-latest
        steps:
          - name: Checkout source
            uses: actions/checkout@v2
            with:
              ref: main
          - name: Use Node.js ${{ matrix.node-version }}
            uses: actions/setup-node@v2
            with:
              node-version: '${{ matrix.node-version }}'
          - name: Setup hexo
            env:
              ACTION_DEPLOY_KEY: ${{ secrets.DEPLOY }}
            run: |
              mkdir -p ~/.ssh/
              echo "$ACTION_DEPLOY_KEY" > ~/.ssh/id_rsa
              chmod 600 ~/.ssh/id_rsa
              ssh-keyscan github.com >> ~/.ssh/known_hosts
              git config --global user.email "jinliangliu@163.com"
              git config --global user.name "nateliu"
              npm install hexo-cli -g
              npm install
          - name: Hexo deploy
            run: |
              hexo clean
              hexo generate
              hexo deploy

  4. Hexo configuration
    Modify in project root _config.yml, add deployment related content:

1
2
3
4
deploy:
  type: git
  repo: git@github.com:nateliu/nateliu.github.io.git 
  branch: master

It looks like Step 6 before mentioned, but update the repo:

  1. Verification
    Now the hexo-blog has been integrated with GitHub actions, push the code into main branch to automatically compile and deploy. specific
    The execution process can be performed in ActionsView

Hexo GitHub pages
GitHub actions automatically deploy hexo
Hexo Action