Use hexo to build your own blog and deploy it to github

Build a Hexo blog and deploy it to Github

background

There are already many blogs on the market, such as CSDN, Nuggets, Blog Garden, Jianshu and so on. We can publish content directly on it, and the interaction is more user-friendly, and it can also be retrieved by search engines. But some friends want to build a blog of their own. Today, I will take you to build your own blog (under windows) by using Hexo + Github Pages.

Introduction to Hexo

Hexo is a static blog program based on Node.js, which can easily generate static web pages and host them on Github and Heroku. And many people have made many excellent themes for it, you can set it according to your own preferences.
Hexo is a fast, clean and efficient blogging framework. Hexo uses Markdown (or other rendering engines) to parse articles, and within seconds, it can generate static web pages with beautiful themes.

Environmental preparation

Before building, you need to do some preparatory work. First, you need to make sure that Git and Node.Js have been installed on your computer, and then you can start installing Hexo. First, let's take a look at how to prepare these environments.

  • install git
Window:https://git-scm.com/download/win
macOS:https://sourceforge.net/projects/git-osx-installer/
Linux(Debian,Ubuntu):sudo apt-get install git-core
Linux(Fedora、RedHat、CentOS):sudo yum install git-core
  • Configuration
    After the installation is successful, you need to bind git with your GitHub account, right-click to open Git Bash, and then set the configuration information:
    insert image description here
# 配置用户名和邮箱
git config --global user.name "github 用户名"
git config --global user.email "github 注册邮箱"
# 生成 ssh 密钥
ssh-keygen -t rsa -C "github 注册邮箱"
#我这里原本设置过,选择了overwrite重写

insert image description here
After executing the above command, two files, id_rsa and id_rsa.pub, will be generated in the C:/Users/.ssh/ directory. The former is our private property, while the latter is open to the outside world. Then find the id_rsa.pub key in the generated .ssh folder, copy the content;
insert image description here
then open the GitHub-Settings-Keys page, create a new SSH key, fill in the Title and Key, the Title can be arbitrary, and the content of the Key It is the content in the id_rsa.pub we just copied, and finally click Add SSH key;
insert the picture description hereinsert image description here

  • Node.js installation

Go to the official website to download the latest stable version of Node.JS. Generally, 64-bit is recommended (the computers you use now are basically 64-bit). The installation is very simple, basically just click on the next step. It should be noted that hexo requires Node.js 12 or above, and I downloaded version 12.22 here.
insert image description here

  • Verify
    After the installation is complete, to check whether the installation is successful, you can open the command prompt (Win + R), enter cmd to open the console, and enter the following command. If the corresponding version number appears, the installation is successful;
    insert image description here
  • Settings
    Since the download package is from a foreign server, the speed is relatively slow. Here I have configured a Taobao mirror
npm config set registry https://registry.npm.taobao.org

Hexo installation

Create a folder on your hard disk to store your blog files, for example, mine is in E:\Program Files\github\blog. Then enter the current folder from the command console, and the next step is the installation process.

  • Install Hexo
npm i hexo-cli -g
  • under the newly created folder
hexo init .
npm install
  • After initialization, the directory structure is as follows
.
├── _config.yml # 网站配置信息
├── package.json # 应用程序信息
├── scaffolds # 模板文件夹
├── source # 存放用户资源
|   ├── _drafts
|   └── _posts
└── themes # 主题文件夹

Generally, you can visit here through http://localhost:4000

  • Not surprisingly, I made an error
fatal: unable to access ‘https://github.com/…/.git/
#解决办法
git config --global --unset http.proxy 
git config --global --unset https.proxy

#在cmd下执行ipconfig/flushdns 清理DNS缓存
ipconfig/flushdns

New Test Blog

  • Order
# 新建博客
hexo new "博客名"
# 生成静态网页
hexo clean
hexo g  等同于generate
# 打开本地服务器
hexo s
#打开 localhost:4000就可以访问到本地的博客了  

Github personal repository

After completing the above steps, we can preview locally, but if we want to publish it online for others to see, we have to use the function of Github Pages. The following will introduce how to combine Hexo + Github Pages to Our blog is pushed online so that you can access it anywhere.
1. First of all, you must have a GitHub account. If you don’t have one, please go out and turn right to register an account.
2. After you have an account, create a new warehouse, and make sure your warehouse is public. If you want to make it private, who can access it? ? ? At the same time, the warehouse name must be

用户名.github.io

Deploy to Github
After completing the above steps, you should be able to preview locally. The next step is to push the website to Github Pages, and then we can be accessed by others.
Just set the site configuration file _config.yml in the root directory of our blog to your personal warehouse name. After
insert image description here
insert image description here
completing the above steps, the next

hexo clean
hexo g   或者 hexo generate
hexo d   或者 hexo deploy

At this point, it stands to reason that my local content has been pushed to the remote GitHub warehouse, and it should be accessed in the browser, but unfortunately, something went wrong again

出现ERROR Deployer not found: git
原因:少了hexo针对git的deploy组件
解决方法:npm install --save hexo-deployer-git

It should work now, it came out, but my newly created blog has been pushed over, but it is not displayed, so I couldn’t access the above page for a while, it was always a readme.md under the main branch content.
insert image description here
After some twists and turns, I found that all new libraries announced by github on 2020/10/1 will be named with the neutral word [main] to replace the original [master]. If we upload the warehouse through the method of git push -u gridin master , a master branch will appear in the github repository.
Solution:
1. In order to maintain consistency, you can change the default branch to main when local git init:
1. We only need to find >Repositories> in the personal settings of github and change the default main to master and then create the project Just warehouse.
Please add a picture description
It should be fine now, but it is still no, and it keeps prompting timeout, although it has already
insert image description here
insert image description here

But the link timed out, git crossed, and failed to connect to github.
insert image description here
That’s the way, open the road in the mountains, build bridges in the water, configure it.
First step: get the local ip address
cmd->ipconfig
insert image description here
Step two: ping
Test the network
insert image description here
to show that the connection is normal.
third step:

Find the hosts file in the git directory.

The general directory is C:\Program Files\Git\etc, I modified the path here, under E:\Program Files\Git\Git\etc.
Enter the file, find # localhost name resolution is handled within DNS itself. Just
add it. Ended with flowers, see you Nora
insert image description here


insert image description here

Guess you like

Origin blog.csdn.net/weixin_44834205/article/details/126437316