1. 为什么要搭建个人博客网站？
- 记录折腾软件或者技术的过程，免得下次再折腾的时候重新找各种网站和教程——省事
- 记录一下自己所遇到的问题以及解决办法。
- 分享自己的生活经验
- 装X
- 我可是以后要做程序猿的男人，不会自己搭建网站可没脸见人。
2. 搭建网站需要了解的常识
1. 域名
把互联网上的每一个网站比作房间的话，那么域名就相当于房间号，不然别人怎么去访问你的房间。简单说就是网址。域名解析是指将域名解析为IP。域名是IP的代名词,没有人会去记IP,访问网站都是访问域名的。
那如何得到域名？有免费和付费两种。其中我选择的Github page就能提供免费域名，付费域名那选择就多了。国内：阿里云、腾讯云。国外：Godaddy、Name
2. 网页存放空间
- 购买服务器或者把自己的电脑当服务器。
- 购买虚拟服务器
VPS是虚拟服务器的简写,相当于一台完整的计算机,可以安装软件,存放数据,下载上传,但是它不在我们面前,而是在VPS服务商的机房里,我们只能通过远程去操作这台计算机.由于VPS就相当于一台完整的计算机,所以我们在上面的可操作性比较大,我们可以安装服务器程序用来提供网页下载服务,安装php提供后端处理能力,安装mysql提供数据库服务.非常灵活.因此VPS可以同时支持动态博客框架和静态博客框架。
VPS 选择须知：常见主机操作系统分为 Linux 和 Windows 两种。作为开源系统，Linux 主机在系统成本、性能以及稳定性上目前是绝对优于 Windows 主机的。购买的时候要注意自己的域名是不是已经ICP备案，如果没有备案不能选择大陆的主机，建议用香港的，毕竟与日韩美比地理位置相对于大陆较近比。国外口碑较好的 VPS 供应商有 DigitalOcean，Linode 等等，这类主机通常在服务和质量上是有所保证的，价格在 30-60 美元/每月不等。另外一款较为便宜的 VPS，叫做版瓦工，价格在 12 美元一年。你的域名备案了可以选择大陆的主机，比如阿里云，腾讯云都可以 - 使用Github pages
GitHub Pages是GitHub提供的一项免费服务.每个GitHub账号可以申请一个pages仓库用来存放网页文件.而GitHub在已经安装好了服务器程序以便于浏览器访问这些网页.由于GitHub Pages不支持php和数据库,因此只能在上面部署静态博客框架.
3. 博客框架介绍
每篇文章都自己写网页是不现实的,而即使是web开发大神,也不会所有网页都自己写,因为太麻烦太繁琐了.那么有没有什么自动化的整理排版网页生成工具可以用呢?当然有!我们需要利用博客框架来自动生成网页文件.
博客框架是指一个自动化的程序,我们只需要以框架要求的语法(如markdown)提供我们博客文章的材料,它就会自动帮我们排版文字,转换成网页文件,生成网页层级组织,生成网站首页,一切都是全自动的,我们只需要关心我们文章的内容就够了.自动化万岁!
而博客框架一般分为动态页面框架和静态页面框架两种.
- 动态框架
动态页面框架是指用户在访问我们的网站的时候,所有的网页都是在访问的时候动态生成的,平时没有,访问的时候现场生成,这种框架的好处是搭建简单,现用现做,支持评论互动,功能比较强大.但是需要服务器支持php和数据库.这一类的框架比较著名的是WordPress.由于这类框架要求服务器有数据库和php支持,很多人用vps+wordpress搭建个人博客。 - 静态框架
这一类的框架是指我们每次在写完文章后启动框架为我们生成一套网页文件，这套文件部署在服务器上供别人访问，其中的内容是不会变动的，直到我们下次修改或写新的文章后再生成一套新的文件部署到服务器后，网站的内容才会改变．网站上的内容是静态的，因此成为静态博客框架．这类框架比较有名的有Hexo.这类框架的好处是对服务器要求简单,不需要php和数据库支持.但是比如文章评论等动态改变网页内容的功能,在这种框架中生成的网页中就无法实现了(事实上,如果一定要使用评论功能,可以使用Disque之类的第三方服务集成到Hexo生成的网站中来实现评论,原理还是利用第三方的服务商的数据库和服务器来存放评论数据)。
3. 开始搭建
1. 环境安装
- 安装git
windows下使用msysGit
Git与Github使用教程（一）--Git安装、Git账户与GitHub账户连接
Git与Github使用教程（二）--Windows下msysGit的使用 - 获得github page网页空间
注册好GitHub账号后，新建仓库repository，仓库名就设为：github-name.github.io。选择public，新建成功。
建立好之后我们就已经有了自己的网页存放空间啦!今后通过
https://github-name.github.io就能访问博客。
部署网页的方法：
1、先clone我们的仓库,然后修改其中的内容(例如添加网页删除网页等),最后commit + push到github上就可以了.这很麻烦,
2.、Hexo为我们提供了一键生成+发布的功能,今后连commit+push也可以省去啦,直接hexo deploy即可。
官方教程网站：https://pages.github.com/
- 部署Hexo框架
Hexo需要部署在我们自己的计算机上,由于Hexo是基于Nodejs编写的,所以我们首先需要安装Nodejs
安装参考地址：安装Node.js
对于Windows系统，在Nodejs官网上下载并安装Nodejs。
安装完毕后在我们的电脑里建立一个新的文件夹来存放我们的博客工程文件,例如D:/hexo
在该文件夹里右键选择git bash 打开命令行
使用npm安装Hexo
npm install -g hexo #官方命令为：npm install -g hexo-cli
-g参数是要求全局安装,这样我们以后就可以直接在命令行里使用hexo命令了。
由于我们要提交到github上,我们还需要安装hexo git提交插件.
npm install hexo-deployer-git --save
2. 初始化博客工程
hexo init <folder> # hexo会在目标文件夹建立网站所需要的所有文件
cd <folder>
npm install # 安装依赖包
上面的folder为博客的工程名,我们可以自己起,例如testBlog
完毕以后我们可以进入我们之前初始化好的文件夹,例如D:/blog/testBlog中
,修改_config.yml文件来调整hexo的设置。
初始化好的文件夹内容及各文件功能如下：
├── .deploy #需要部署的文件
├── node_modules #Hexo插件
├── public #生成的静态网页文件
├── scaffolds #模板
├── source #博客正文和其他源文件，404、favicon、CNAME 都应该放在这里
| ├── _drafts #草稿
| └── _posts #文章
├── themes #主题
├── _config.yml #全局配置文件
└── package.json
3. 本地查看
现在我们已经搭建起本地的hexo博客了，执行以下命令：
hexo generate #生成静态文件到public文件夹
hexo server #在本地服务器运行
至此，本地博客已经搭建起来了，只是本地，别人看不到的，浏览器输入localhost:4000看看
要想从通过网站看需要部署到Github。
4. 修改_config.yml文件基础配置调整hexo的设置
title: 这里填写博客的标题
subtitle: 这里填写博客的副标题
description: 这里填写博客的描述
author: 这里填写博客的作者
language: 这里填写博客的语言,如果是中文填写”zh”
url: 这里填写我们之前申请的博客网页存放空间的网址,例如我们的github用户名为”aaa”,这里就填写”http://aaa.github.io“
deploy:
type: 这里填写”git”
repo: 这里填写我们之前申请的git仓库的地址,例如我们的用户名为”aaa”,则此处填写”git@github.com:aaa/aaa.github.io.git”
暂时就填写这么多就够了,其他的部分暂时先不做修改,保存,退出.如果需要了解更多hexo的配置或者想要做更高级的定制,可以查看官方配置说明
5. 部署到github
现在网站已经基本建好了，可以部署到github上，使用命令：
hexo generate
hexo deploy
或者
hexo g -d
该命令的意思是使用hexo生成整个博客的网页文件,并且上传到我们刚才repo里面填写的git仓库里.hexo会自动检索我们博客文章的改动,删除,增加,并生成一套新的网页。
以下提示说明部署成功
[info] Deploy done: git
打开浏览器输入网址：
http://你的github用户名.github.io
即可访问网页。
6. 写文章
git bash命令行模式,进入我们的博客文件夹：
hexo new "标题"
在 _posts 目录下会生成文件 标题.md
title: Hello World #文章页面上的显示名称，可以任意修改，不会出现在URL中
date: 2015-07-30 07:56:29 #发表日期，一般不改动
categories: hexo #文章分类目录，多个分类使用[a,b,c]这种格式
tags: [hexo,github] #文章标签，多于一项时用这种格式
---
正文，使用Markdown语法书写
<!--more-->
#more标签以下的内容要点击“阅读全文”才能看见，#more标签以上的内容为你首页显示文章的摘要部分
编写好之后，保存退出，之后用hexo g -d生成网页文件在部署到github上即可。
