[GitHub] 跟我一块儿白嫖 GitHub Pages 作我的站点 ?

What`s The GitHub Pages ？

Websites for you and your projects. Hosted directly from your GitHub repository. Just edit, push, and your changes are live.

简单的说，就是提供了用 GitHub 的仓库作站点的一种方式，咱们无需本身提供服务器。

而咱们用 GitHub Pages 就是想白嫖啦，借助它提供的直接访问静态资源的能力，

咱们可经过 GitHub Pages 功能去托管：

我的博客，

项目说明，

XX产品说明书等等

如何使用 GitHub Pages

首先你要建立本身的 GitHub 帐号，点击注册

关于 Git 命令的使用，能够参考这篇文章进行学习

建立仓库

在 GitHub 建立一个名为 username.github.io 的新仓库，其中username是你在GitHub上的用户名（或组织名称）。 若是仓库的第一部分与你的用户名不彻底匹配，则它将没法正常工做，所以请确保正确输入。

请注意我这里的仓库名，和个人用户名

初始化仓库

向仓库添加我们的静态资源。

# git 命令行，克隆到本地，注意使用你本身的地址哦！！！
git clone https://github.com/username/username.github.io.git
# 进入文件夹
cd username.github.io
# 制做页面，注意名称要是index.html
echo "Hello World" > index.html
# 添加到暂存区
git add --all
# commit 
git commit -m "Initial commit"
# push 到远程
git push -u origin master
复制代码

访问站点

而后咱们能够在浏览器输入仓库名称便可访问了，默认会访问到我们的 index.html

到这里，我们已经把 GitHub Pages 用起来了，后面具体往站点上放什么资源，就能够自由 DIY 啦。

不少同窗都会用 username.github.io 这个根站点维护我的博客，你也能够的。

---

干货赠送：GitHub Pages 其实不止这么多

可能通常人介绍 GitHub Pages 介绍到这就已经结束了，完结撒花~

GitHub Pages 就只能用 username.github.io 这一个站点 ？

No！

你没听错，你还能使用二级目录访问，建立不少仓库，每一个仓库均可以作站点。

访问方式 username.github.io/repositoryName

我这里有用 vue 作了个简易的在线播放器，能够去访问体验一下，若是你喜欢直接拿走吧。。。暂时咱不讨论这个播放器怎么实现的，感兴趣的话留言交流

项目地址：

yuansaysay.github.io/vueMusicPla…

代码地址：

源代码地址

二级站点搞起来

简单说下怎么玩起来，

• 建立仓库，和上面同样的方式
• 初始化仓库，添加你须要的静态资源，好比我上面的音乐播放器代码

若是这时候你直接访问会是这个结果，由于咱们还要把仓库的 Github Pages 功能开启。

须要启用仓库的 GitHub Pages 功能：找到setting，往下拉找到GitHub Pages，如图设置就OK !

而后就能够以复制的方式，作出各类各样的站点啦！

---

但愿对你有帮助，有疑问能够留言交流。

开启你的 GitHub Pages 使用之旅吧！