GitHub Pages 搭建网站

GitHub Pages 是 GitHub 的一个免费快捷的的静态网站托管服务。在传统方式建站中,首先要租用服务器,服务器上需要运行 web 程序,还要再购买域名,要配置 SSL 证书,最后需要配置 DNS ,将域名解析到与服务器……这一套繁琐操作基本就把小白劝退了。而通过 GitHub Pages ,可以将这些繁琐步骤自动搞定:只需要简单点几下按钮,2分钟就能搭建好一个网站,而且它完全免费。



GitHub Pages 站点区别

Github Pages有两种类型的站点,下面的表格列举了它们的区别:

个人站点 项目站点
每个账户能有的数量 1个 无数个
仓库名称 必须为 yourUserName.github.io 没有限制
仓库地址 https://github.com/yourUserName/yourUserName.github.io https://github.com/yourUserName/yourRepoName
站点地址 https://yourUserName.github.io https://yourUserName.github.io/yourRepoName

第一种是个人站点,每个账户只能有一个,仓库名称有严格要求,必须是”账户名.github.io”,以我为例我的账户名称是MiQieR,所以仓库名必须是miqier.github.io,搭建好以后访问地址是 https://miqier.github.io

第二种是项目站点,没有数量限制,仓库名称也没有限制,但是有个缺点是,搭建好的网址会比较长,比如: miqier.github.io/yourRepoName,这里的 yourRepoName 即是项目名称。



搭建个人站点

1. Fork博客框架项目

这里以很受欢迎的一个人博客框架 Hux 为例,访问它的GitHub项目地址:https://github.com/Huxpro/huxpro.github.io

点击 fork,将代码保存到自己仓库一份

仓库名称必须是自己的 用户名.github.io

2. 创建Action

Fork成功以后 点击 settings->pages->Github Action

Github 提供 Jekyll 的 Action,Jekyll 它有一个模版目录,其中包含原始文本格式的文档,通过一个转换器转化成一个完整的可发布的静态网站。

Jekyll 生成完以后,直接点击Commit changes将代码提交即可

3. 修改博客配置

修改博客基本配置 _config.yml

4. 发布新文章

_posts 目录增加 markdown 格式的笔记,代码提交完毕,GitHub 自动执行 Action 将网页发布出来。

上半部分是文章的配置信息,下半部分则是标准的markdown语法



搭建项目站点

表白代码收藏馆是一个GitHub上的开源项目,其中收藏了50多个各种编程语言表达爱意的代码。

项目地址: https://github.com/sun0225SUN/Awesome-Love-Code

这里以032号Awesome-Love-Code项目为例,演示如何部署到自己的域名,并且对里面的内容进行简单修改。

1. Fork选择的项目

可以修改项目名和描述。

2. 对代码进行个性化修改

进入目录 Web/032/index.html 直接修改 index.html。

3. 使用GitHub Pages部署

点击Settings->Pages,选择 main 分支直接发布。

等待一分钟后,在https://yourUserName.github.io/Awesome-Love-Code/Web/032就可以看到发布的页面。