hexo+GitHub方式部署博客

一开始知道这种方式部署博客我很不理解,不知道为什么这样的方式也可以搭建博客
我对搭建博客的概念是那种买个云主机,搭建一个WordPress。

整体理解:
1、在本地主机上将所有需要的支持的软件以及代码都给部署好
2、借助GitHub的仓库功能,将本地的文件推送到GitHub的仓库,用户直接访问GitHub的方式来访问到我们的博客。

第一步:下载node.js稳定版(https://nodejs.org/zh-cn/)
作用:创建运行环境,让JavaScript运行在服务端的开发平台
打开cmd命令行:node -v
测试是否成功

第二步:注册GitHub并创建仓库
将创建的这个仓库作为我们的站点目录(可以简单这么理解)
创建仓库名称时有要求,必须是(用户名)xxxx+.github.io

hexo+GitHub方式部署博客_第1张图片
新建一个index.html文件,测试网页是否可以打开运行
并提交

hexo+GitHub方式部署博客_第2张图片

测试访问

在这里插入图片描述

第三步:下载 git(https://git-scm.com/)
git是什么:开源的分布式版本控制系统,可以有效、高速地处理从很小到非常大的项目版本管理。
下载安装之后,在cmd命令行输入:git 如果输出很多关于git的参数则说明安装成功

第四步:GitHubssh配置
打开git-bash 输入:
ssh-keygen -t rsa -C “邮箱名”
三段回车
打开GitHub–头像–设置—ssh----将公钥粘贴

第五步:hexo(https://hexo.io/)

hexo:静态博客框架;WordPress是动态的博客框架;
在自己的电脑磁盘上选择一个目录,新建文件夹
cmd命令行:进入新建的文件夹
比如:E盘 blog文件夹
C:\Users\my>cd E:
E:
E:>cd F:\blog
安装hexo
npm install hexo-cli -g
初始化:
hexo init 博客名
进入初始化的博客名(其实是一个文件)
安装依赖
npm install
本地运行hexo s -p 5555
指定5555端口

本地浏览器输入:localhost:5555
测试验证

第六步:安装sublime text3
作用:文档编辑器,利于我们修改hexo的文件,用于后期写博客等。

安装完成后直接将刚才的那个博客目录拖拽进来。

hexo+GitHub方式部署博客_第3张图片

这个目录就是我们的初始化hexo时,用于测试的那篇博客了。

第七步:hexo发布到GitHub上
原理:将仓库作为站点目录,将本地的hexo的文件以及我们以后写的博客,推送到GitHub的仓库下面,直接访问GitHub的仓库名,就可以访问到我们的博客了。

配置文件

hexo+GitHub方式部署博客_第4张图片
修改部分:
第一部分:
hexo+GitHub方式部署博客_第5张图片
type:git 类型
repo:复制我们GitHub的ssh地址
branch :增加分支,默认为master
第二部分:

在这里插入图片描述
我们的”域名“,也就是刚才注册GitHub测试使用的

打开cmd命令行:
npm install hexo-deployer-git --save 下载插件
输入:
git config --global user.email “邮箱”
git config --global user.name “GitHub用户名”

hexo g 在GitHub生成文件

git config --global user.email “邮箱”
git config --global user.name “GitHub用户名”

hexo d 推送本地博客目录下的文件

提交成功后就可以访问到我们的博客了

第八步:主题的使用
(这里以hexo-theme-matery-master)主题为使用:个人比较喜欢
下载地址(https://github.com/blinkfox/hexo-theme-matery)
下载后解压,然后将解压后文件中的主题改名字为matery
放入到博客目录下的themes中

hexo+GitHub方式部署博客_第6张图片
修改配置文件

重新
hexo g 读取修改的目录文件

本地预览:
hexo s -p 5555

本地测试没有问题后,重新推送到GitHub中即可。

hexo g
hexo d

根据bilibili视频总结:
https://www.bilibili.com/video/BV1cW411A7Jx?p=5

个人博客地址:

https://liushiya-github.github.io/

你可能感兴趣的:(小型服务)