使用Jekyll, Cloudflare Pages和Headless搭建并自动部署网站

本教程作为个人回忆教程：使用Jekyll创建网站, 通过白嫖Github Codespaces的Headless CMS管理内容,并使用Cloudflare Pages自动部署。

步骤1: 创建Jekyll网站

有两种方法可以创建新的Jekyll网站:

1. 官方方法:

   jekyll new my-awesome-site
   cd my-awesome-site
   

2. 使用Gem创建:

   gem install jekyll bundler
   jekyll new my-awesome-site
   cd my-awesome-site
   bundle exec jekyll serve
   

步骤2: 连接Codespaces到Git仓库

1. 在Git平台(如GitHub)的账户设置中添加SSH密钥。
2. 在Codespaces中配置Git SSH连接。
3. 将网站内容推送到Git仓库。

步骤3: 配置Cloudflare Pages

1. 在Cloudflare Pages中创建新项目并连接到您的Git仓库。
2. 选择Jekyll作为构建框架。
3. 完成部署后,在Cloudflare Pages设置中创建Deploy Hook,获取API URL。

步骤4: 设置自动部署

1. 在您的项目根目录创建.github文件夹(注意:这与.git文件夹不同)。
2. 在.github/workflows中创建部署工作流文件。
3. 在Codespaces中配置Git推送后的工作流,使用Deploy Hook URL触发部署。

完成以上步骤后,每次通过VSC连接的远程机器更新内容并推送到Git仓库时,Cloudflare Pages将自动部署网站。