GitHub 下搭建自己小网站

一、前期准备

1、GitHub账号

注册地址：https://github.com/

2、Node.js环境

下载地址：https://nodejs.org/download/

3、Git 软件：下载地址http://git-scm.com/download/

二、软件安装

1、注册GitHub账号

1)Github账户注册和新建项目，项目必须要遵守格式：账户名.github.io，此处账号名作为后期个人网站的地址使用。需要勾选Initialize this repository with a README。（如果没有勾选，后期要创建README文件即可）

2)创建一个新的repository(代码仓库), 注意，名称必须是xxx.github.io 格式，并且xxx必须是你在GitHub的用户名。

3)在建好的项目右侧有个settings按钮，点击它，向下拉到GitHub Pages，你会看到那边有个网址，可以访问它。你将会惊奇的发现该项目已经被部署到网络上，能够通过外网来访问它。

2.安装Node.js

在node.js指定地址下载，采用最新的版本即可。

3.安装Git.

三、Hexo配置流程

1、安装Hexo

Hexo 是一款基于 Node.js 的静态网站框架。Hexo 使用 Markdown 解析文章，用户在本地安装Hexo并进行写作，通过一条命令，Hexo即可利用靓丽的主题自动生成静态网页。

1）新建文件夹hexo

首先创建一个文件夹，用来存放Hexo模板和项目，然后进入 hexo 文件夹，鼠标右键点击Git Bash Here。

2）安装hexo基础框架

// 这是安装hexo的基础框架（此处要求已经安装了node.js环境）

第一步：npm install hexo-cli -g

第二步：hexo init blog 

它就会在当前目录下生成一个blog的文件夹，并在里面生成相关配置信息。

第三步：cd blog

切换到blog目录下

第四步：npm install

安装必备的组件，安装完成之后，blog文件夹的目录结构大致如下：

第五步：hexo g

/编译生成静态页面，会在当前目录下生成一个新的叫做public的文件夹。

第六步：hexo s

 启动本地服务

打开链接http://localhost:4000，看到这样的网页就成功啦。

2、 hexo主题设置，这里以主题yilia为例进行说明。

1）安装主题（此处当前目录为blog）

git clone https://github.com/litten/hexo-theme-yilia.git themes/yilia

2）启用主题

cd themes/yilia

git pull //获取远程内容

3） 修改配置文件

修改hexo目录下的_config.yml配置文件中的theme属性，将其设置为我们前面克隆下来的主体样式，此处theme: yilia

4） 重启服务

切换到blog目录

hexo g # 重新生成静态文件

hexo s # 启动本地web服务器

现在打开http://localhost:4000，会看到我们已经应用了一个新的主题。

四、部署到GitHub服务器

1、使用git命令行部署（optional）

此处我们采用git命令来完成部署的工作。

1) cd d:/hexo/blog

git clone https://github.com/dreamhappy/dreamhappy.github.io.git deploy/dreamhappy.github.io

将我们之前创建的repo克隆到本地，新建一个目录叫做deploy用于存放克隆的代码。

2) hexo generate //生成静态文件

cp -R public/* ../deploy/dreamhappy.github.io //复制文件

cd deploy/dreamhappy.github.io //切换目录

配置你的git 默认使用账户：

 git config --global user.email "happynessf@sina.com"

 git config --global user.name "dreamhappy"

git add . //将需要提交的代码添加到暂存区

git commit -m “update” //将暂存区内容提交给本地版本库

git push //推送给远程服务器

简单解释一下，hexo generate生成public文件夹下的新内容，然后将其拷贝至dreamhappy.github.io的git目录下，然后使用git commit命令提交代码到dreamhappy.github.io这个repo的master branch上。

需要部署的时候，执行第三个步骤。执行过程中可能需要让你输入Github账户的用户名及密码，按照提示操作即可。

2、 验证

打开浏览器，输入地址：https://dreamhappy.github.io/ ，就可以看到我们的网站可以访问了！

五、发布网站内容

1、创建博客标题

hexo new “Happy”

2、编写博客内容

找到创建的md文件，使用编辑器打开，按照Markdown的格式，编写博客内容，编写完成之后，执行以下代码，将博客内容推送到远程服务器上。

hexo generate //生成静态文件

cp -R public/* ../deploy/dreamhappy.github.io //复制文件

cd deploy/dreamhappy.github.io //切换目录

git add . //将需要提交的代码添加到暂存区

git commit -m "update" //将暂存区内容提交给本地版本库

git push //推送给远程服务器