使用Github+Hexo搭建我的博客

随着互联网时代的到来,国内外涌现出愈来愈多的社交网站让用户之间分享信息变得更加便捷,那么你是否也曾想过拥有一个属于本身的网站,写文章记录生活?若是你曾经或如今拥有这样的想法,就请跟随这篇文章,充分发挥你的动手能力,快速搭建属于你本身的我的博客网站,记录下生活中的美好。
node

搭建步骤

1.GitHub建立我的仓库git

2.安装Gitgithub

3.安装Node.jsshell

4.安装Hexonpm

5.推送网站windows

6.更换主题浏览器

7.发布文章缓存

Hexo简介

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

Github简介

image
GitHub 是一个面向开源及私有软件项目的托管平台,由于只支持 Git 做为惟一的版本库格式进行托管,故名 GitHub。GitHub 于 2008 年 4 月 10 日正式上线,除了 Git 代码仓库托管及基本的 Web 管理界面之外,还提供了订阅、讨论组、文本渲染、在线文件编辑器、协做图谱(报表)、代码片断分享(Gist)等功能。目前,其注册用户已经超过百万,托管版本数量也是很是之多,其中不乏知名开源项目 Ruby on Rails、jQuery 等。markdown

搭建过程

Github建立我的仓库

首先咱们须要注册一个Github帐号,注册成功后,使用刚才注册的帐号密码进行登录。
注册地址:https://github.com/join?source=header-home
点击GitHub中的New建立新仓库,仓库名应该为:用户名.github.io
这个用户名使用你的GitHub账号名称代替,这是固定写法,好比个人仓库名为:1sniper.github.io
image

安装Git

Git是开源的分布式版本控制系统,用于敏捷高效地处理项目。
Git下载地址:https://git-scm.com/downloads

Windows 用户
因为众所周知的缘由,从上面的连接下载git for windows最好挂上一个代理,不然下载速度十分缓慢。也能够参考这个页面,收录了存储于百度云的下载地址。

安装完成后,在命令行里输入git测试是否安装成功,若安装失败,参看其余详细的Git安装教程。
image
安装成功后,将你的Git与GitHub账号绑定,在任意位置鼠标右击打开Git Bash,或者在菜单里搜索Git Bash,使用以下代码设置user.name和user.email配置信息:

git config --global user.name "你的GitHub用户名"
git config --global user.email "你的GitHub注册邮箱"

以下图所示:
image
而后利用如下命令生成ssh密钥文件:

ssh-keygen -t rsa -C "你的GitHub注册邮箱"

以下图所示:
image
而后找到生成的.ssh的文件夹中的id_rsa.pub密钥,将内容所有复制
image
打开GitHub_Settings_keys 页面,新建new SSH Key
image
image
Title为标题,任意填便可,将刚刚复制的id_rsa.pub内容粘贴进去,最后点击Add SSH key。
添加完成后,页面以下:
image
另外,当咱们添加ssh密钥成功后,会收到一封来自Github的邮件,或者咱们能够在Git页面检测是否设置成功,命令以下:

ssh git@github.com

如图所示:
image
如上则说明成功。这里之因此设置GitHub密钥缘由是,经过非对称加密的公钥与私钥来完成加密,公钥放置在GitHub上,私钥放置在本身的电脑里。GitHub要求每次推送代码都是合法用户,因此每次推送都须要输入帐号密码验证推送用户是不是合法用户,为了省去每次输入密码的步骤,采用了ssh,当你推送的时候,git就会匹配你的私钥跟GitHub上面的公钥是不是配对的,如果匹配就认为你是合法用户,则容许推送。这样能够保证每次的推送都是正确合法的。

安装Node.js

简单的说 Node.js 就是运行在服务端的 JavaScript。Node.js 是一个基于Chrome JavaScript 运行时创建的一个平台。Node.js是一个事件驱动I/O服务端JavaScript环境,基于Google的V8引擎,V8引擎执行Javascript的速度很是快,性能很是好。
Node.js下载地址:https://nodejs.org/en/download/
下载完成后进行安装,注意安装Node.js会包含环境变量及npm的安装,安装后,检测Node.js是否安装成功,在命令行中输入

node -v

检测npm是否安装成功,在命令行中输入

npm -v

如图所示:
image

安装Hexo

Hexo是咱们的我的博客网站的框架, 须要本身在电脑常里建立一个文件夹,能够命名为Blog,Hexo框架与之后你本身发布的网页都在这个文件夹中。
建立好后,进入文件夹,按住shift键,鼠标右键点击"在此处打开Powershell窗口",使用npm命令安装Hexo,输入:

npm install -g hexo-cli

安装时间较长耐心等待
image
安装完成后,在刚才建立的文件夹内点击鼠标右键,选择"Git Bash Here",初始化咱们的博客,输入命令:

hexo init

如图所示:
image
而后按顺序输入如下命令,在本地部署博客,用于检查网站雏形:

hexo g
hexo s

如图所示:
image
完成后,打开浏览器输入地址:localhost:4000
能够看到咱们的网站雏形以下:
image
附:Hexo经常使用命令简介

npm install hexo -g #安装Hexo
npm update hexo -g #升级 
hexo init #初始化博客

hexo n "个人博客" == hexo new "个人博客" #新建文章
hexo g == hexo generate #生成
hexo s == hexo server #启动服务预览
hexo d == hexo deploy #部署

hexo server #Hexo会监视文件变更并自动更新,无须重启服务器
hexo server -s #静态模式
hexo server -p 5000 #更改端口
hexo server -i 192.168.1.1 #自定义 IP
hexo clean #清除缓存,如果网页正常状况下能够忽略

推送网站

上面介绍的只是用于本地预览,接下来要作的是推送网站,也就是发布网站,让咱们的网站能够被更多的人访问。在进行部署以前,须要解释一个概念,在blog根目录里的_config.yml文件称为站点配置文件,以下图:
image
进入根目录里的themes文件夹,里面也有个_config.yml文件,这个称为主题配置文件,以下图:
image
下一步将咱们的Hexo与GitHub关联起来,打开站点的配置文件_config.yml,将最后的代码修改成:

deploy: 
type: git
repo: 这里填入你以前在GitHub上建立仓库的完整路径,记得加上 .git
branch: master

注意:在冒号以后有一个空格(英文格式)
参考以下:
image
保存站点配置文件。
其实就是给hexo d 这个命令作相应的配置,让hexo知道你要把blog部署在哪一个位置,很显然,咱们部署在咱们GitHub的仓库里。最后安装Git部署插件,在网站根目录文件夹下按住shift点击鼠标右键选择"在此处打开Powershell窗口",输入命令:

npm install hexo-deployer-git --save

以下图所示:
image
而后咱们在网站根目录文件夹下按住shift点击鼠标右键选择"Git Bash Here",依次输入三条命令:

hexo clean 
hexo g 
hexo d

如图所示:
image
image
image
咱们第一次部署的时候会要求输入Github的帐号密码,按要求输入便可,如图所示:
image
完成后,打开浏览器,在地址栏输入你的放置我的网站的仓库路径,即 http://xxxx.github.io 好比个人xxxx就是个人GitHub用户名,你就会发现你的博客已经上线了,能够在网络上进行访问了。
image

更换主题

若是你不喜欢Hexo的默认主题,能够在网络上下载其余主题进行更换
主题下载地址:https://hexo.io/themes/
将本身喜欢的主题下载以后进行解压,注意由于大多数主题在Github上下载,咱们须要将文件名更改,例如hexo-theme-next-master,须要更改成next,而后放在网站根目录下的theme文件夹下,最后修改网站的配置文件中theme这一行为你的主题名称,例如:
image
而后咱们在网站根目录文件夹下按住shift点击鼠标右键选择"Git Bash Here",依次执行如下命令进行部署:

hexo g
hexo d

咱们能够看到博客的主题已经更改了:
image

发布文章

咱们能够用markdown语法编写完文章后,将md文件放置于网站根目录的\source_posts下,而后从新进行部署,或者能够利用如下命令:

hexo new "博客名字"

直接在\source_posts下生成md文件,而后进行编辑,从新部署。 这样一篇章新的文章就发表了。

相关文章
相关标签/搜索