Hexo+GitHub生成我的博客

前言

本篇文章记录一下我生成我的博客的过程。顺便分享给有须要的人。

若是您须要开发我的博客，须要：

• 最基础的前端知识就行。
• 用markdown的语法来写文章。
• 有GitHub帐号。
• 安装好了Git和node
• 知道npm操做。

什么是Hexo

Hexo 是一个快速、简洁且高效的博客框架。Hexo使用 Markdown（或其余渲染引擎）解析文章，在几秒内，便可利用靓丽的主题生成静态网页。

hexo 正常来讲，不须要部署到咱们的服务器上，咱们的服务器上保存的，实际上是基于在hexo经过markdown编写的文章，而后hexo帮咱们生成静态的html页面，而后，将生成的html上传到咱们的服务器（或者是GitHub上）。简而言之：hexo是个静态页面生成、上传的工具。

安装Hexo

$ npm install hexo-cli -g //全局安装hexo
$ hexo init blog //对blog文件夹初始化(这一步会很慢)
$ npm install //安装所须要的组件
$ hexo g //编译生成静态页面
$ hexo s //启动本地服务
复制代码

启动本地服务以后，根据终端的提示打开http://localhost:4000/能够在本地查看到博客。以下图所示。

绑定GitHub

上一步在本地查看到了博客，若是别人想经过在浏览器输入地址来访问你的博客怎么办？

让你的Hexo与GitHub仓库绑定。这样别人就能够访问了。

获取本机SSH口令

ssh keys就是用来使本地git 项目与github联系。

• 提交过代码到GitHub上的同窗表明着已经让git仓库绑定到了GitHub上了。就没必要再配置SSH 口令了。

• 若是没有绑定的话。

  • $ ssh-keygen -t rsa -C "邮件地址@youremail.com" //ssh-keygen -t rsa -C "Github的注册邮箱地址"
  • 提示Enter passphrase (empty for no passphrase):设置密码
  • Enter same passphrase again 再次输入
  • Your public key has been saved in /c/Users/user/.ssh/id_rsa.pub.表明设置成功。
  • 找到id_rsa.pub文件，复制里面全部内容。
  • 来到GitHub主页面，路径为Settings/SSH and GPG keys/New SSH key。
  • Title: blog //不必定非要是blog
  • key: 复制的内容
  • Add SSH key 完成SSH key 的绑定。

• 最后还要这一步。

$git config --global user.name "你的名字"
$git config --global user.email "你的邮箱"
复制代码

Git还不清楚的同窗能够戳Git笔记

建立新仓库

• 平时咱们建立仓库会直接写你要建立的仓库名就OK。好比建一个Node的仓库直接填Node就好了。 可是，博客的仓库地址不同，必须为你的GitHub名+ github.io 。好比个人博客仓库名就叫作zhongjunhaoz.github.io。必须按照此种格式去填写。

blog文件的基本配置

• 配置_config.yml文件。

title: **My Blog** #博客名
subtitle: to be continued... #副标题
description: My blog #给搜索引擎看的，对网站的描述，能够自定义
author: **Yourname** #做者，在博客底部能够看到
email: yourname@yourmail.com #你的联系邮箱
language: **zh-CN** #中文。若是不填则默认英文
timezone: Asia/Shanghai
# URL #这项暂不配置，绑定域名后，欲建立sitemap.xml须要配置该项
## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'
url: http://yoursite.com
# Writing 文章布局、写做格式的定义，不修改
# Archives 默认值为2，这里都修改成1，相应页面就只会列出标题，而非全文
# Server 不修改
# Date / Time format 日期格式，能够修改为本身喜欢的格式
# Pagination 每页显示文章数，能够自定义，贴主设置的是10

复制代码

• 配置_config.yml文件下的Deploy

deploy:
  type: git
  repository: 你的仓库地址
  name: GitHub名
  email: 邮箱
  branch: master
复制代码

• 安装插件 npm install hexo-deployer-git --save
• 准备上传到github仓库。

- hexo clean //清除以前的缓存
- hexo g  // 生成静态文件
- hexo d  //上传至仓库
复制代码

• 接着在浏览器输入你的GitHub名+ github.io就能够访问你的我的博客了。
• zhongjunhaoz.github.io/ 这是个人我的博客。

配置主题

原生的博客主题有点丑，咱们能够选择本身喜欢的主题添加到本身的博客中。

• 官方主题库：主题
• 在这里我选择的是：闪烁之狐。里面有对更改主题配置的文档。

经常使用命令

首次安装可能须要

npm install hexo -g #全局安装 
npm update hexo -g #升级 
hexo init #初始化
复制代码

写博客最经常使用

hexo n "个人博客" == hexo new "个人博客" #新建文章
hexo g == hexo generate #生成静态Html
hexo s == hexo server #会监视文件变更并自动更新，您无须重启服务器
hexo d == hexo deploy #部署
复制代码

服务器

hexo server -p 5000 #更改端口
hexo server -i 192.168.1.1 #自定义 IP
hexo server -s #静态模式
hexo clean #清除缓存 网页正常状况下能够忽略此条命令
复制代码

监视文件变更

hexo generate --watch  #监视文件变更
复制代码

草稿

hexo publish [layout] <title>
复制代码

网站效果

欢迎访问个人博客，会分享一些技术文章，一块儿学习前端。

参考文章

hexo经常使用命令笔记