Github pages+jekyll 静态网站搭建（一）

静态网站搭建（一）

内容简介

🚩Tech Contents：本文介绍了使用 GitHub Pages+Jekyll 创建个人静态网站的步骤

GitHub Pages：静态网站托管服务，自动将仓库中的代码变为网站/免费提供<用户名>.github.io域名/随最新推送实时更新
Jekyll：静态网站生成器，将MarkDown文件自动转换为网页，提供主题模板/支持博客功能
Custom URLs：支持配置自定义域

---

搭建步骤

GitHub 仓库创建¹

1. 新建仓库，命名方式为<username>.github.io
2. 克隆仓库到本地，自动生成远程配置
3. 提交并推送一个 html 文件，在浏览器上验证username.github.io是否正常访问

Jekyll 安装使用²³

Jekyll 安装指南

1. 安装 Ruby，为 Jekyll 提供运行环境 rubyinstaller.org Downloads
2. 验证 ruby 和 gem 安装，cmd 中分别使用命令ruby -v gem -v
3. 安装 Jekyll，cmd 中使用命令gem install jekyll bundler
4. 验证 Jekyll 安装，cmd 中使用命令jekyll -v

Jekyll 快速搭建测试

1. 在克隆的文件夹中打开 git bash，使用jekyll new <myblog>
2. 创建完成后，使用命令cd <myblog>进入文件夹
3. 使用命令jekyll serve，可以在浏览器中输入http://localhost:4000看到 jekyll 模板生成的静态页面

Jekyll 生成的静态页面

上述过程最好全程开代理，且 new 操作一般会有较长等待时间，本文 Jekyll 新建 myblog 时安装了 41 个 gems

1. GitHub Pages ↩︎

2. Win 安装 Ruby+Jekyll 视频教程 ↩︎

3. Jekyll • 简单静态博客网站生成器 ↩︎