BR000
0%

手把手教你搭博客，看这一篇就够了

Posted on Edited on

写在前面：很多人有写文章、发布文章的需要，目前最普遍的方式是将文章发布在知乎、CSDN、博客园等平台上。这种方式有很多好处，但存在一些问题，例如：平台提供的服务未必称心如意、存在文章被删除的风险。而将文章发布在个人博客上能够在一定程度上解决这些问题。可惜的是，在传统意义上，个人博客意味着域名、服务器、数据库等一系列对普通用户挑战很大的东西，所以很多有意于个人博客的普通人只好望洋兴叹。

为了帮助大家搭建自己的博客，本文介绍一种近年比较流行，同时对初学者极为友好的搭建方法：GitHub Pages 结合 Hexo 。作者从零开始，手把手教学，真正确保大家能搭出自己的博客。

本文介绍的方法有以下优势：

  1. 无需域名
  2. 无需服务器
  3. 低代码，不涉及网页的知识
  4. 无需维护
  5. FREE

总之，这种方法极为简便，不需要深入了解计算机和通信的相关知识，对于只想搭建博客、发布文章的用户非常友好。

简介

1.Github Pages

Github Pages是Github提供的服务，效果是托管我们的静态网页。通过它，我们可以得到一个可供他人访问的网站，从而绕过购买域名和搭建服务器的问题。

2.Hexo

Hexo是一种博客框架，效果是用我们的文章生成网页。有了Hexo的帮助，我们就可以专心写文章，不跟代码打交道也能制作网页。

3.Git

通过Git实现文件的下载上传以及本地与Github的通信。

4.Node.js

Node.js用于提供Hexo的运行环境

准备

1.Git

  • 点击下载链接：https://git-scm.com/download/win

  • 选择“Git for Windows Setup”中符合自己操作系统位数的安装包下载，之后一直选择默认选项

  • 最后，按Windows+R，输入cmd打开命令行窗口，输入git --version

出现版本号即安装成功

输入以下两条命令（这里”用户名“和”邮箱“填自己的）：

1
git config --global user.name "用户名"
1
git config --global user.email "邮箱"

这是在初始配置你的Git

2.Node.js

  • 点击下载链接：https://nodejs.org/zh-cn/

  • 选择“长期维护版”下载，一直选择默认选项

  • 在命令行窗口中输入node -v验证安装结果

出现版本号即安装成功

3.特别说明

如果出了问题，请检查环境变量是否配好（一般不会有问题的）。

具体方法如下：桌面右键“我的电脑”，选“属性”，在右侧选“系统属性”，“高级”标签的下侧点击“环境变量”。双击打开“系统变量”的“Path“。看有没有，没有就点右边”新建“手动加。

4.Hexo

  • 在任意文件夹点鼠标右键，选择Git Bash Here打开Bash

  • 输入npm install hexo-cli -g等待安装成功

  • 输入hexo -v验证

得到以hexo-cli: x.x.x等很多行信息，说明安装成功

创建Github Pages

  • 打开Github：https://github.com/

  • 如果你还没有账号，就在左边的框里面输入邮箱地址，然后点旁边绿色的Sign up for GitHub，再点continue，在Create a password中设置密码，之后点continue，在Enter a uesrname中输入用户名，如果提示Username [用户名] is not available，就说明名字被占用了，要换个用户名。之后点continue，回答一些验证问题，点下面绿色的Create an account。在邮箱中找到验证码回来输入，再回答一些个性化问题，账号就创建成功了。

    此时跳转到Github主界面，点击左边绿色的Create repositorie进入创建仓库的界面

  • 如果你在Github创建过账号，在主界面点击Repositories旁绿色的New进入创建仓库的界面

  • 在Repository name一栏填入[用户名].github.io。

  • 往下滑，勾选Add a README file，简单编写一下这个文件，这是为了生成main分支

  • 点击绿色的Create repository创建仓库

  • 此时跳转到仓库内，点击在Code、Issue同排右侧的Settings

  • 往下滑滚轮，左边的标签中点击Pages

  • 选择Source，把Branch改为main，点右边的save。建立Pages成功

连接本地与Github

  • windows+R，输入cmd打开命令行，输入ssh-keygen -t rsa -C "注册git时的邮箱"，会有一大串结果，最后是左下角的一个图表，就生成成功了

  • 按路径进入C:/[用户名]/.ssh，有个id_rsa.pub，打开它，复制

  • 打开Github主页，点右上角你的头像旁的倒三角，点开settings，点开左边SSH and GPG keys，点你的SSH key那一栏右边的绿色New SSH key，粘贴到Key那个表格当中，点下面的绿色的Add SSH key生成

  • 在任意文件夹点鼠标右键，选择Git Bash Here打开Bash，输入ssh -T git@github.com ，出现Hi xx! You've successfully authenticated, but GitHub does not provide shell access.就成功连接了

建立和部署Hexo博客

  • 在“我的电脑”中打开你希望博客安装的地方，鼠标右键选择Git Bash Here

  • 输入hexo init blog，出现INFO Start blogging with Hexo!表明下载完成，这步可能有点慢

  • 输入cd blog，进入blog文件夹

  • 输入npm install

  • 回到“我的电脑”，在刚刚创建的blog这个文件夹中找到config.yml，右键用记事本打开，往最下面滑，找到deploy，修改并保存为：

1
2
3
4
deploy:  
 type: git  
 repository: https://github.com/[用户名]/[用户名].github.io.git  
 branch: main

  • 回到Bash，输入npm install hexo-deployer-git --save安装上传器

  • 输入hexo g

  • 输入hexo d

现在，你可以在你的网页http://[用户名].github.io上看到一篇关于Hexo的文章，这是Hexo的默认文章，它使用了Hexo的默认模板。

到这里，你的个人博客就搭建成功了！接下来你可以在这里发布文章，以及装饰你的博客、赋予你的博客更多个性

填充博客

创作文章

在blog文件夹中打开Bash，输入hexo new "文章的名字"生成空白文章，文章的格式是Markdown。不会的朋友们可以在我的这篇文章中学学Markdown语法

这个文件在blog/source/_post里面，找到它之后点开，就可以开始写文章了

预览更新

在blog文件夹中：

用上文说过的方法打开Bash

输入hexo g可以将当前博客的状态生成网页，方便部署

之后输入hexo s打开服务器

现在可以在本地的http://localhost:4000上浏览更新

部署更新

如果已经预览并觉得满意，在Bash中输入hexo d即可把更新部署到个人网站上

如果不想预览，也可以直接hexo g生成后hexo d部署到网站上

总之，文章写完后不用hexo g，但是在发布前一定要hexo g生成一次

By the way，部署到GitHub pages可能有延迟，有时候要等一会再来看

使用主题

我们选择一款非常流行的主题：hexo-theme-next

  • 点开链接，点击绿色的Code，选择Download ZIP，下载到blog/themes文件夹中，选择“解压到这里”解压，你可以给解压后的文件夹改个名字

  • 在_config.yml中搜索到theme，把默认的landscape改成你解压出来的文件夹的名字，保存

  • 回到Bash，输入hexo g，他会生成一大堆文件

可以用hexo s浏览一下你的 新皮肤 新主题，之后可以把它部署到网站上

写在后面：我相信，这篇文章可以满足大家基本的需求，即从零开始搭建好一个适于发表文章的个人博客。考虑到时间和技术等问题，本文没有涉及个性化、部署域名等更深入的部分。之后，我会把一些更深入的部分写在下篇文章中，欢迎大家继续阅读 o( =•ω•= )m