[Detailed tutorial on building a hexo blog] 1. Build a usable blog from scratch

1. Start

2. Environment and tool preparation

This tutorial is mainly for Windows users

Operating system: Windows 10
Node
Git
Hexo
Text editor (VSCODE is highly recommended)
GitHub account
A domain name (it is highly recommended to buy a domain name)
Cloud server (optional)

3.Node installation

Open the Node official website and download the Node installation program that matches your system, otherwise installation problems will occur. Download address: Download | My personal version of Node.js is 12.19.0. The current version has been updated to 19.0.0. According to personal experience, you can choose a lower version, which can be the same as mine, otherwise various problems will appear later .
Incompatibility problem! I installed version 16 before, but the system couldn't recognize it. If you encounter problems, I suggest you choose a lower version! Historical version download page: Previous Releases | Node.js
After downloading, install. The installation directory can use the default directory [C:/Program Files/nodejs/], or you can customize the path.
There are many pitfalls in this environment path switching. If your C drive has enough space, you can directly install the C drive. If you want to switch to other drives or switch the environment traversal to a custom path, you can also follow the detailed tutorial on Baidu (but there are more pitfalls)!
After the installation is complete, check whether the installation was successful. Press the win + R keys on the keyboard, enter CMD, and then press Enter to open the CMD window and execute the node -v command. If you see the version information, the installation is successful.
Modify npm source. npm downloads various modules. By default, it is downloaded from the national server, which is slow. It is recommended to configure it as a Taobao mirror. Open the CMD window and run the following command:
SHELL
1
npm config set registry https://registry.npm.taobao.org

4. Install Hexo

Enter Git BASHthe following command to install

SHELL
1
npm install -g hexo-cli
After installation, enter hexo -v to verify whether the installation is successful.

5.Github registration and creation of warehouse

Enter the official website GitHub: Let's build from here · GitHub
Click Sign up in the upper right corner
Fill in your email, password, username and other information, and then verify with your email to complete.
After registration is completed, click +the button in the upper right corner and select New repositoryto create a <用户名>.github.iowarehouse.

The format of the warehouse must be: <用户名>.github.io (Note: the prefix must be the user name, don’t wait for the 404 later to come back to why!!!)
Description: describes the warehouse (optional)
Check Initialize this repository with a README to initialize a README.md file
Click Create repository to create

6.Git installation

Enter the official website: Git - Downloads . Since the official website download is too slow, you can download the open source mirror through Taobao: CNPM Binaries Mirror . You can choose the download version to meet your own needs.
After downloading, you can install Git in a fool-proof way. The installation directory can use the default directory [C:/Program Files/Git], or you can customize the path.
Click Start in the lower left corner of your computer to see it Git Bash.

Git CMD It is the command style of Windows command line.
Git Bash It is the command style of Linux system (recommended)
Git GUIIt is a graphical interface (not recommended for beginners to learn)

Common commands

SHELL

1
2
3

git config -l //View all configurations 
git config --system --list //View system configuration 
git config --global --list //View user (global) configuration

Configure username and email

SHELL

1 2	git config --global user.name "your username" git config --global user.email "your email"

By git config -l checking whether the configuration is successful, the git installation and configuration are now complete.

7. Connect to Github

Execute the following command to generate an ssh public key. This public key is used to connect your computer to Github.

SHELL
1
ssh-keygen -t rsa -C "your email"
Then open the .ssh folder in the user folder under the C drive and you will see id_rsa.pub

Use Notepad to open the public key (id_rsa.pub) in the above picture, copy the contents, and then start configuring the ssh key in github.
Configure SSH KEY to GitHub
. Enter github, click on the avatar in the upper right corner to select settings, enter the settings page and select SSH and GPG keys, name it as you like, and fill in the public key in Keythat column.
To test the connection, enter the following command

SHELL
1
ssh -T [email protected]
The message connecting to the account appears, indicating that you are done and the environment preparation is completed.

8. Initialize the Hexo project

Open the cmd command window in the target path (the path I chose here is [C:/Hexo-Blog]) and execute the hexo initinitialization project.

SHELL
1
hexo init blog-demo(project name)
Enter blog-demo and enter npm ithe installation related dependencies.

SHELL
1 2
cd blog-demo //Enter the blog-demo folder npm i
After initializing the project, blog-demoit has the following structure:

[node_modules]: dependent package
[scaffolds]: some templates for generating articles
[source]: used to store your articles
[themes]: theme
[.npmignore]: files ignored when publishing (can be ignored)
[_config.landscape.yml ]: Theme configuration file
[config.yml]: Blog configuration file
[package.json]: Project name, description, version, operation and development and other information

Enter hexo server or hexo s to start the project
Open the browser and enter the address: http://localhost:4000/ . If you see the following effect, your blog has been successfully built.

9. Mount static blog to GitHub Pages

Install hexo-deployer-git

SHELL
1
npm install hexo-deployer-git --save
Modify the _config.yml file.
The _config.yml in the blog-demo directory is the configuration file of the entire Hexo framework. Most configurations can be modified there. For details, please refer to the official configuration description .
Modify the configuration on the last line and change the repository to your own github project address, and change the branch to represent the mainmain branch (note the indentation).

YAML
1 2 3 4
deploy: type: git repository: [email protected]:Fomalhaut-Blog/Fomalhaut-Blog.github.io.git branch: main
After modifying the configuration, run the following command to deploy the code to GitHub (Hexo Sanlian).

SHELL
1 2
hexo clean && hexo generate && hexo deploy // Git BASH终端 hexo clean; hexo generate; hexo deploy // VSCODE终端
- hexo clean: Delete previously generated files. If no static files have been generated, you can ignore this command.
- hexo generate: Generate static articles, you can use hexo gabbreviations
- hexo deploy: Deployment articles, hexo dabbreviations can be used
  
  Note: You may be asked to enter username and password when deploying.
  
  If it appears Deploy done, the deployment was successful.
  
  Wait for two minutes, open the browser and visit: https://Fomalhaut-Blog.github.io . At this time we can see the blog content.