Basic Operations#
Select the content checked in the gray box, which is your GitHub, then click the Select
button, and then click GitHub
to choose the user you want to store Hexo under GIT SCOPE
. Fill in the repository name you want to store Hexo in at REPOSITORY NAME
, and check the Create private Git Repository
option, which sets the repository to private and invisible to others. Then click the Continue
button, and without modifying anything, click Deploy directly, waiting for it to complete the build automatically, which should take about 3 minutes, and it will distribute a free secondary domain name that can be temporarily used (it will not be reclaimed, but it is not recommended to use).
::: gallery
:::
After the deployment is complete, it will be bound to the repository you just filled in. Once there are any changes in your repository, it will automatically sync and deploy, and the whole process can be completed in about 5 minutes.
Next is the advanced gameplay, customizing themes and writing articles.
Advanced Gameplay#
Local Modifications#
Preparing the Environment#
- Windows operating system computer
- Git for Windows
- Node.js ≥ v12
- NPM
- Hexo
Environment Installation
If you already have these, you can choose to skip this step, or if you don't need to check if they can run, you can also choose to skip the installation.
This tutorial's environment is installed based on Windows 10 20H2.
Git (must install, even if you don't check if it can run normally)
To use Git on the Windows platform, you need Git for Windows, download and install it (if you find the official download speed too slow, you can go to Taobao NPM mirror to download).
I used this link to download Git-2.25.0-64-bit.exe
, with all default options installed.
Verify Installation
In the right-click menu of Explorer or the Start menu, you can find Git Bash
. After opening it, you will see a command line interface, which is essential for checking whether the Hexo system can run normally.
Open Git Bash
and check the version with the following code:
node -v
npm -v
If you see the version numbers, it means the environment installation was successful.
Hexo
Hexo is a fast, simple, and efficient blogging framework.
Open Git Bash
and run the following command to install Hexo (you may need to wait for a while after pressing Enter; I waited for 100s
here):
npm install -g hexo
If you see + hexo@{{version number}}
, it means the installation was successful.
GitHub & SSH key (this section is adapted from FlyingSky)
Go to GitHub to register your account (please verify your email address in a timely manner).
Open Git Bash
and run the following command:
ssh-keygen -t rsa -C "{{your email address}}"
Press Enter three times, and a directory containing public and private keys and other data will be generated in your user directory (usually C:/Users/{{your username}}/.ssh/
).
Open this directory, find the id_rsa.pub
file, and open it with your favorite text editor (Notepad) to copy its contents. Go to GitHub -> Settings -> SSH and GPG keys -> New SSH key
(i.e., this link):
Paste the copied content into Key
, fill in Title
with your preference, and click save (Add SSH Key
).
Set Up Git
Run the following commands:
git config --global user.name "{{your GitHub username}}"
git config --global user.email "{{your GitHub registered email address}}"
Verify Success
Open Git Bash
and run the following command:
ssh -T [email protected] # No need to change the email address here
If prompted with Are you sure you want to continue connecting (yes/no)?
, type yes
and press Enter.
Hi {{your GitHub username}}! You've successfully authenticated, but GitHub does not provide shell access.
If you see this message, it means the configuration was successful.
At this point, the local environment is set up, and you can start making modifications.
Local Modifications#
Use the git command to clone the repository stored on GitHub to your local machine.
git clone https://github.com/{{username}}/{{repository name}}.git
Note that cloning a private repository requires entering your GitHub account and password.
After cloning, you can choose to switch themes and then write an article.
Switching Themes
If you like the default theme, please skip this section.
I will demonstrate using SumiMakito/hexo-theme-Journal.
In your Hexo site directory, use Git Bash to run the following command to install the theme (you will need to wait):
git clone {{theme git file address}} themes/{{theme name}}
For example:
git clone https://github.com/SumiMakito/hexo-theme-Journal.git themes/journal
After downloading, modify _config.yml
to change theme: landscape
to theme: {{theme name}}
, and then execute hexo g
to regenerate.
If you encounter some inexplicable issues, execute hexo clean
to clear the contents of public
, and then regenerate and publish.
Installing Plugins
In your Hexo site directory, use Git Bash
to run the following command:
hexo new '{{article name}}'
After running, the source\_posts\
directory will have a new {{article name}}.md
file. Open this file with your favorite text editor (Notepad), and hexo
will have generated header information by default.
The file content structure is as follows:
---
title: {{article name}}
date: {{article time}}
categories: {{article category}}
tags: {{article tags [tag1,tag2,tag3]}}
description: {{article summary}}
---
{{article content}}
Article content supports Markdown
syntax.
Running Tests
After writing the article and installing the theme, you can check if it runs normally by executing the following command:
hexo g -s
After entering the command, visit localhost:4000
to check if it runs properly.
Deploying Hexo Blog#
If the previous step runs normally, you can push it to GitHub using Git Push, and Vercel will automatically pull and deploy. If you don't know how to push, you can search for tutorials on Baidu, CSDN, or Blog Park; this article will include a push tutorial at the end, but it won't be detailed, so it's recommended to learn it on your own.
CloudStudio Modifications#
Environment and Preparation#
- CloudStudio account https://cloudstudio.net/
- Hexo
Environment Installation
I won't teach you how to register for CloudStudio here.
After entering Coding, find CloudStudio on the left, authorize it, then click New Workspace
, select Node.js, and name it whatever you like, choosing an empty code source.
After creating the workspace, enter it, click on the terminal, and create a new terminal. Most of the following content needs to be completed in the terminal.
Verify Installation
In the terminal, enter the following content:
node -v
npm -v
If both show version numbers, you can start modifying in CloudStudio.
Hexo
Hexo is a fast, simple, and efficient blogging framework.
Open the terminal and run the following command to install Hexo:
npm install -g hexo
If you see + hexo@{{version number}}
, it means the installation was successful.
GitHub & SSH key
First, you can see that the path is RemoteWorking
, but we need to set the file storage path to root.
You can execute:
cd /root
We choose to open a folder and then enter the root folder.
In the terminal, enter:
ssh-keygen -t rsa -C "{{your email address}}"
Press Enter three times, and a directory containing public and private keys and other data will be generated in your user directory (usually C:/Users/{{your username}}/.ssh/
).
Open this directory, find the id_rsa.pub
file, and open it with your favorite text editor (Notepad) to copy its contents. Go to GitHub -> Settings -> SSH and GPG keys -> New SSH key
(i.e., this link):
Paste the copied content into Key
, fill in Title
with your preference, and click save (Add SSH Key
).
Set Up Git
Run the following commands:
git config --global user.name "{{your GitHub username}}"
git config --global user.email "{{your GitHub registered email address}}"
Verify Success
Open Git Bash
and run the following command:
ssh -T [email protected] # No need to change the email address here
If prompted with Are you sure you want to continue connecting (yes/no)?
, type yes
and press Enter.
Hi {{your GitHub username}}! You've successfully authenticated, but GitHub does not provide shell access.
If you see this message, it means the configuration was successful.
At this point, the local environment is set up, and you can start making modifications.
CloudStudio Modifications#
Then, use the git command to clone the repository stored on GitHub to CloudStudio.
git clone [email protected]:username/repository name.git
Note that cloning a private repository requires authorization; you can go to https://github.com/settings/tokens/new to generate a token with full permissions to submit to CloudStudio for authorization.
After cloning, you can choose to switch themes and then write an article.
Switching Themes
If you like the default theme, please skip this section.
I will demonstrate using SumiMakito/hexo-theme-Journal.
cd /{{directory where Hexo is located}}
Run the following command to install the theme (you will need to wait):
git clone {{theme git file address}} themes/{{theme name}}
For example:
git clone https://github.com/SumiMakito/hexo-theme-Journal.git themes/journal
After downloading, modify _config.yml
to change theme: landscape
to theme: {{theme name}}
, and then execute hexo g
to regenerate.
If you encounter some inexplicable issues, execute hexo clean
to clear the contents of public
, and then regenerate and publish.
Installing Plugins
Enter the directory where Hexo is located:
cd /{{directory where Hexo is located}}
In the terminal, enter the following command:
npm install hexo-deployer-git --save
Writing Articles
Enter the directory where Hexo is located:
cd /{{directory where Hexo is located}}
In the terminal, enter the following command:
hexo new '{{article name}}'
After running, the source\_posts\
directory will have a new {{article name}}.md
file. Click on the file, and hexo
will have generated header information by default.
The file content structure is as follows:
---
title: {{article name}}
date: {{article time}}
categories: {{article category}}
tags: {{article tags [tag1,tag2,tag3]}}
description: {{article summary}}
---
{{article content}}
Article content supports Markdown
syntax.
Deploying Hexo Blog#
Since local running tests cannot be completed, you can directly push. Generally, if there are no issues with the theme or plugins, pushing and deploying directly should not have any problems. If you don't know how to push, you can search for tutorials on Baidu, CSDN, or Blog Park; this article will include a push tutorial at the end, but it won't be detailed, so it's recommended to learn it on your own.
GitHub Push#
Here I only provide a code; specific situations need to be learned through Baidu. Git commands are as profound as Linux commands...
git status
git add .
git status
git commit -m 'comment'
git branch -m master
git push -f origin master
Generally, for the first push, you need to execute git add
before running this command.
Of course, you can also use IDE software for control, which is very convenient.
Conclusion#
Alright, this lengthy Hexo deployment tutorial is complete, and I will modify it based on circumstances in the future.
All reference materials:
- Let's build a Hexo site using GitHub Pages for reference methods
- Super detailed Hexo+Github Page setup tutorial for technical blogs【continuously updated】 for writing new articles
- The most detailed "screenshot" setup of Hexo blog and deployment to GitHub a piece of
hexo g -s
code - How to submit Cloud Studio code to other Git platforms confused my mind
Help me complete this article's needs:
- A cup of water
- A cup of milk
- GitHub Proxy Github proxy acceleration
- 50 songs averaging 4 minutes long
If there are errors, you will also need to learn deeply through Baidu or refer to the materials I have referenced.
This article is synchronized and updated to xLog by Mix Space. The original link is https://fmcf.cc/posts/technology/Hexo_on-_Vercel