字数：3354
阅读时间：15分钟
介绍
这可能是您见过的关于如何使用 Gitee 和 Hexo 构建个人博客网站的最清晰的教程。 即使您是新手，不了解某些概念，您仍然可以按照本文中的方法和步骤完成网站建设。本教程的目的是建立您自己的博客并使其运行。 更高级的定制操作稍后会介绍。
撰写时间为2022/7/10，教程中使用的工具和网站以当前日期为准。
根据
首先，我们来介绍一下这些概念。
静态网站
根据网站的组成和结构，网站可以分为静态网站和动态网站。 其静态表现是用户访问完全固定的代码。 除非网站开发者做出一些改变，否则用户收到的内容永远不会改变。 两者之间有几个主要区别：
/吉泰
Gitee和Gite都是基于git的代码托管平台（世界上最常用的开源平台）。 利用它们提供的Pages功能，可以满足我们托管静态网站的需求，最重要的是，它们是免费的！
使用它们构建静态网站需要经常使用git。 不知道如何使用的读者需要了解一下git。 请参考以下链接：
Git 教程 - 新手教程
由于目前访问不稳定，有时甚至无法访问，本教程还将介绍如何使用Gitee搭建博客。
赫索
Hexo 是一个用 Node.js 编写的简单高效的博客框架。 目前大多数博客都使用 Hexo。
Hexo 使用渲染引擎来解析文章。 用户编写文章内容，Hexo 将其渲染为网页。 Hexo 有很多主题供您选择。
它是一种轻量级的标记语言，或者说是一种排版语言，人们可以用它来快速编写具有一定排版的文章。 你现在读到的这篇文章就是它写的。 使用方式与Word类似，但它可以让你专注于内容写作。 学习起来比较简单。 不懂的读者需要去理解。 请参考以下链接：
教程 - 新手教程
原则
当用户访问一个网站时，一般的流程是：
在浏览器中输入域名并按 Enter 键。 经过一系列的DNS信息查询步骤，就得到了服务器的IP地址。 通过获取到的IP和端口，经过三次握手后，与服务器建立TCP连接（不出意外的话，未来QUIC将会取代TCP）。 通过 HTTP/HTTPS 协议请求 Web 内容。 如果通过，服务器将回复“OK”并传送网页内容。 浏览器获取 HTML 内容，对其进行解析并将其呈现到用户看到的网页中。
当我们使用或者Gitee创建静态网页时，并不涉及服务器的构建和处理。 我们只需要关心我们网站内容的建设即可。 这是一个纯粹的前端工作，与客户端的通信以及其他任务都留给了服务器。 等等，我们的服务器在哪里？
在这里，Gitee的Pages服务解决了我们服务器需要的工作。 当用户访问特定域名时，通过DNS服务器获取IP并指向/Gitee的Pages服务器，并与其建立连接。 当客户端发送请求时，服务器会从数千条数据中找到对应的一条，然后将我们的网页返回给用户。 那么我们的网页应该放在哪里呢？
我们只需要在/Gitee上创建一个仓库，并将我们的网页代码放在上面即可（首页始终是index.html）。 我们在其中写入的内容将是我们看到的网页。 由于/Gitee Pages的服务是基于我们创建的代码仓库，所以我们只能在上面创建静态网站。
也就是说，在/Gitee上进行一些配置就相当于我们创建了服务器。 以后如何创建网页内容完全是我们的自由。 那么 Hexo 是做什么的呢？
正如之前提到的，Hexo 是一个博客框架。 它的作用是帮助我们创建更加漂亮的博客网页。 我们不需要学习HTML5等新语言。 我们把它交给前端我们来做。 你自己的作品（如果你是前端工程师，可以尝试自己写一个漂亮的网页）。
我们的整体流程是：
使用Hexo或者自己编写，在电脑本地生成静态网站文件。 使用git或者Hexo（基于git）将文件同步到我们的代码仓库。 （甚至可以直接上传到仓库，只要不太麻烦）服务配置好后就可以访问我们的网站了。
以下是使用本教程中的方法创建网站所需的内容列表。 该工具版本的官方下载链接如下。 Linux可以使用apt自行安装。
基础知识：
所需工具：
需要做什么：
开始
以下是安装和创建博客的完整步骤。
配置 Hexo
这一步将首先创建网站的基本框架。
首先安装Git、Node.js。 请在安装过程中勾选“添加到路径”以全局使用它。
安装完成后，打开命令行，分别输入git和node。 如果没有报错并且出现版本信息则表示安装成功。
创建一个专用于您的博客的文件夹，其路径名应为全英文。 打开文件夹中的命令行并输入以下命令。
npm install hexo-cli -g
# 全局安装hexo
hexo init blog
# 初始化创建blog文件夹
cd blog
# 移动到blog文件夹
npm install
# 初始化执行完所有命令后，博客的本地文件就已经构建完毕。
这时我们可以输入以下命令在本地预览我们的网站内容。
hexo server
# 或 hexo s键入后，按住 Ctrl 并单击出现的链接以跳转到浏览器。
如果出现这样的界面，那么恭喜你，你已经制作好了自己的网站。 接下来你需要做的就是修改内容并让其他人看到。 预览结束后，可以按Ctrl+C结束。
配置本地Git
首先注册一个Gitee账号，具体取决于你想使用哪个平台。
打开 Git bash 并输入以下命令。
git config --global user.name "你的GitHub/Gitee用户名"
git config --global user.email "你的GitHub/Gitee注册邮箱"
# 用于配置本地用户信息
ssh-keygen -t rsa -C "你的GitHub/Gitee注册邮箱"
# 用于生成SSH Key，之后出现三个选项，直接回车即可由于本地 Git 存储库和 /Gitee 存储库之间的传输是通过 SSH 加密的，因此我们需要配置身份验证信息。 Git通过非对称加密的公钥和私钥完成加密。 公钥放置在远程存储库（/Gitee）上，私钥放置在客户端上。 每次同步时，都需要输入账号密码来验证推送用户是否为合法用户。 为了省去每次输入密码的步骤，这里使用了SSH。 推送时，Git 会匹配公钥和私钥是否合法，匹配成功则允许推送。
我们的SSH公钥和私钥文件默认存放在C:\Users\你的用户名\.ssh\路径下（Linux默认为/home/.ssh）。
配置/版本
登录后，首先打开个人设置中的SSH公钥设置，打开我们的SSH公钥文件夹中的.pub文件，复制其全部内容，粘贴到公钥中。
然后在git bash或者shell中输入以下代码判断是否成功：
这样我们就可以使用Git直接同步仓库的内容了。
然后在Gitee中创建一个仓库。 仓库名称可以任意选择，但仓库路径需要和你的用户名一致，这样才能用来创建网站。
另外我们还需要添加文件，没有其他要求。
完成此步骤后，复制存储库的 SSH 地址。
然后我们就可以打开blog文件夹，打开里面的.yml文件，修改编辑最后的以下内容：
deploy:
type: git
# 若之后出错，可用单引号括起git，即 'git'
repo: git@gitee.com:flatig/blog.git
# 这里是你刚刚复制的地址
branch: main
# 仓库分支，gitee一般为master，可在仓库首页查看编辑并保存后，即可进行下一步。
版本
登录后，首先打开SSH和GPG密钥，打开SSH公钥文件夹中我们的.pub文件，复制其所有内容，并将其粘贴到公钥中。
然后在git bash或者shell中输入以下代码判断是否成功：
这样我们就可以使用Git直接同步仓库的内容了。
然后在 中创建一个仓库，仓库名称需要这样的格式：用户名..io
没有其他要求。 完成此步骤后，复制存储库的 SSH 地址。
然后我们就可以打开blog文件夹，打开里面的.yml文件，修改编辑最后的以下内容：
deploy:
type: git
# 若之后出错，可用单引号括起git，即 'git'
repo: git@github.com:Flatigers/Flatigers.github.io.git
# 这里是你刚刚复制的地址
branch: main
# 仓库分支，GitHub一般为main，可在仓库首页查看编辑并保存后，即可进行下一步。
同步到/Gitee
完成以上所有操作后，在blog文件夹中打开终端或shell并输入以下命令：
npm install hexo-deployer-git --save
# 安装Hexo的git同步插件完成后输入以下命令同步仓库：
hexo clean
# 清除旧文件，可以简写为 hexo c
hexo generate
# 生成新文件，可以简写为 hexo g
hexo deploy
# 推送并同步，可以简写为 hexo d
# hexo新版本默认deploy前自动generate，故可省略hexo g
# 以上命令可以同时简写为：
# hexo c | hexo d同步完成后，打开您的 /Gitee 存储库，您将看到更多文件。
使用它的用户此时已经可以访问自己的网站了。 他们只需要在浏览器中输入用户名..io
使用Gitee的用户还需要启用Pages服务。
如果出现问题，您可以选择强制启用HTTPS，然后就可以通过提供的域名进行访问。
结束
至此，整个网站建设工作已经基本完成。
除此之外，还有一些其他的操作，比如绑定高级域名、更改主题、设置评论区、自定义404等，这些都可以在Hexo的官方文档中找到，以后可能会更新。
继续探索多彩的网络世界！
