使用Github+Hexo搭建自己的博客

我的电脑是win10 64位的

前期准备

  • 去官网下载Node.js文件,下载地址:https://nodejs.org/en/
    安装完成后,windows运行窗口输入:node -v 会出现版本信息,则安装成功

  • 去官网下载Git安装包,下载地址:https://www.git-scm.com/download/win
    按照默认的安装方式,一直点next即可安装成功,默认是安装在C盘,记得修改安装盘符
    安装完成后,windows运行窗口输入:git --version 会出现版本信息,则安装成功

注意:安装成功之后,如果输入上述命令,没有出现对应的信息,则将安装路径添加到用户环境变量(我的是F:\Git\cmd),再次打开运行窗口输入命令即可。

Github Pages

Github Pages 其实本身就是 Github 提供的博客服务。 我们在 Github 中创建一个特定格式的 Repository,Github Pages 就会将里面的信息生成一个网页,展示出来。

操作如下:
  1. 注册 Github 账号,然后在 Github 中创建一个以 .github.io 结尾的 Repository。

    • Repository name: xxyxt.github.io
    • 勾选 Initialize this repository with a README
    • Create repository
  2. 简单地编辑一下 README.md 这个文档。 比如添加:this is a test blog. 保存(Commit changes)。

  3. 打开网页:xxyxt.github.io 这里就可以看到 README.md 里的内容了。

这个生成好的 Repository 就是用来存放博客内容的地方,也只有这个仓库里的内容,才会被 xxyxt.github.io 这个网页显示出来。

hexo 博客框架

  • 安装hexo

在准备工作中,我们已经安装了Node.jsGit,接下来直接安装 hexo 即可

  • 在windows运行命令窗口中输入 nmp install -g hexo-cli

  • 安装完成后,输入 hexo -v

得到版本信息,即安装成功

  • 设置全局配置 user.name 和 user.email
    鼠标右击,单击Git bash here,打开命令窗口,输入

    git config –-global user.name “张三” //(“”的账号是刚才Github里面自己注册的账号)
    git config –-global user.email “1234567@qq.com” //(""的邮箱是你自己注册的邮箱)

  • 生成SSH密钥设置到Github
    cd ~/.ssh
    ssh-keygen -t rsa -C “username” //username是自己的计算机用户名
    如果 cd ~/.ssh 显示No such file,可以输入命令 mkdir ~/.ssh 创建一个文件夹,然后执行相应的操作即可,出现下图,则设置成功在这里插入图片描述
    设置ssh key到GitHub 默认生成ssh key在C:\Users\username.ssh文件夹中,用记事本打开 id_rsa.pub文件,复制 i文件内容到 github->settings->SSH and GPG key->new ssh->key

  • ssh设置是否成功测试

    输入命令 ssh -T git@github.com

  • 创建本地博客

  • 在D盘下创建文件夹 test

  • 鼠标右键 test,选择 Git Bash Here

  • Git Bash 打开之后,所在的位置就是 test 这个文件夹的位置。(/F/test)

  • 输入 hexo init 将 test文件夹初始化成一个博客文件夹。

  • 输入 npm install 安装依赖包。

  • 输入 hexo g 生成(generate)网页。 由于我们还没创建任何博客,生成的网页会展示 Hexo 里面自带了一个 Hello World 的博客。

  • 输入 hexo s 将生成的网页放在了本地服务器(server)。

  • 浏览器里输入 http://localhost:4000/ 。 就可以看到刚才的成果了。

  • 回到 Git Bash,按 Ctrl+C 结束。
    此时再看 http://localhost:4000/ 就是无法访问了。

问题:假如页面一直无法跳转,那么可能端口被占用了。此时我们ctrl+c停止服务器,接着输入“hexo server -p 端口号”来改变端口号

  • 发布一篇博客

如果你按照前面的教程走下来,没有退出刚刚的Git Bash界面,当前路径是刚刚初始化的test路径,输入 hexo new "My First Post"

  • F:\test\source_posts路径下,会有一个 My-First-Post.md 的文件。 编辑这个文件,然后保存。

  • 回到 Git Bash,输入 hexo g 生成博客

  • 输入 hexo s 开启服务

  • 前往 http://localhost:4000/ 查看成果。

  • 回到 Git Bash,按 Ctrl+C 结束。如果不结束的话,接口会一直被占用。

  • 将本地Hexo博客部署在Github上

前面两个部分,我们已经有了本地博客,和一个能托管这些资料的线上仓库。只要把本地博客部署(deploy)在我们的 Github 对应的 Repository 就可以了。

操作如下:
  1. 获取 Github 对应的 Repository 的链接。

  2. 修改博客的配置文件

  3. 部署

  • 回到 Git Bash 输入 npm install hexo-deployer-git --save 安装 hexo-deployer-git 此步骤只需要做一次。
  • 输入 hexo d
  • 得到 INF Deploy done: git 即为部署成功

之前我们创建的 ReadMe.md 会被自动覆盖掉。

  1. 查看成果

前往 xxyxt.github.io 即可。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值