Jekyll 静态站点完全教程
Jekyll 静态站点完全教程
Jekyll 是由 GitHub 联合创始人 Tom Preston-Werner 使用 Ruby 开发的静态站点生成器(Static Site Generator),也是 GitHub Pages 的原生支持引擎。它将纯文本内容(Markdown、HTML)通过模板引擎渲染为完整的静态网站,无需数据库、无需后端服务,是博客、文档站和技术写作的首选工具之一。
教程概览
本教程共 14 章,从基础概念到生产部署,覆盖 Jekyll 开发的完整生命周期。
| 章节 | 标题 | 核心内容 |
|---|---|---|
| 01 | Jekyll 概述与生态 | Jekyll 简介、Ruby 生态、与 Hugo 对比、GitHub Pages、适用场景 |
| 02 | 安装与环境配置 | Ruby 安装、Bundle 配置、Jekyll 安装、版本管理、初始化项目 |
| 03 | 项目结构与基础 | 目录结构、_config.yml、目录约定、构建与预览 |
| 04 | Front Matter 详解 | 预定义变量、自定义变量、默认值、全局 Front Matter |
| 05 | Liquid 模板语言 | 变量、过滤器、标签、循环、条件、自定义过滤器 |
| 06 | 布局与包含 | 布局系统、include、继承、多布局、嵌套布局 |
| 07 | 文章管理 | 文章命名、日期处理、永久链接、分类与标签、草稿、分页 |
| 08 | 页面与集合 | 独立页面、集合(Collections)、数据文件、静态文件、多语言 |
| 09 | 插件开发 | 插件类型、Gem 插件、自定义插件、生成器、转换器、钩子 |
| 10 | 主题系统 | 主题安装、Gem 主题、远程主题、自定义与覆盖 |
| 11 | 数据文件与动态内容 | YAML/JSON/CSV 数据、API 数据、动态内容生成 |
| 12 | 部署方案 | GitHub Pages、Netlify、Vercel、自托管、CI/CD |
| 13 | Docker 化构建 | Docker 构建、多阶段构建、Docker Compose、预览环境 |
| 14 | 最佳实践 | 性能优化、SEO、图片优化、工作流、从其他平台迁移 |
适合谁阅读
- 博客作者:想搭建个人技术博客或写作平台
- 前端开发者:需要构建文档站点或项目主页
- DevOps 工程师:寻找轻量级站点部署方案
- 从其他平台迁移:从 WordPress、Hugo、Hexo 迁移到 Jekyll
阅读建议
- 零基础读者:建议从第 1 章顺序阅读,逐步实践
- 有经验的开发者:可直接跳转到感兴趣的章节
- 从 Hugo 迁移:重点阅读第 1 章对比、第 3 章项目结构、第 5 章 Liquid 模板
环境要求
| 依赖 | 最低版本 | 说明 |
|---|---|---|
| Ruby | 2.7.0+ | 推荐 3.1+ |
| Bundler | 2.0+ | Ruby 包管理器 |
| Jekyll | 4.0+ | 本教程基于 4.3 |
| Git | 2.0+ | 版本控制与部署 |
约定说明
- 代码块中标注
bash的命令均在终端执行 - 文件路径相对于项目根目录
bundle exec前缀在使用 Gemfile 管理时必需- 中文术语后附英文原文,如"静态站点生成器(Static Site Generator)"