The fact that you're reading this is proof that this article works.
Before starting this journey I knew nothing about github actions, now I know a little bit more about github actions. By the end of this tutorial you should be able to have a working github pages site that uses eleventy
I'll be assuming that you already have a static website working with github pages with a custom domain already configured, if you're doing elsewise I would first start with this article
Let's start by taking a look a one of the official starter workflows for something like mdbook
# Sample workflow for building and deploying a mdBook site to GitHub Pages
#
# To get started with mdBook see: https://rust-lang.github.io/mdBook/index.html
#
name: Deploy mdBook site to Pages
on:
# Runs on pushes targeting the default branch
push:
branches: [$default-branch]
# Allows you to run this workflow manually from the Actions tab
workflow_dispatch:
# Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages
permissions:
contents: read
pages: write
id-token: write
# Allow only one concurrent deployment, skipping runs queued between the run in-progress and latest queued.
# However, do NOT cancel in-progress runs as we want to allow these production deployments to complete.
concurrency:
group: "pages"
cancel-in-progress: false
jobs:
# Build job
build:
runs-on: ubuntu-latest
env:
MDBOOK_VERSION: 0.4.21
steps:
- uses: actions/checkout@v3
- name: Install mdBook
run: |
curl --proto '=https' --tlsv1.2 https://sh.rustup.rs -sSf -y | sh
rustup update
cargo install --version ${MDBOOK_VERSION} mdbook
- name: Setup Pages
id: pages
uses: actions/configure-pages@v3
- name: Build with mdBook
run: mdbook build
- name: Upload artifact
uses: actions/upload-pages-artifact@v2
with:
path: ./book
# Deployment job
deploy:
environment:
name: github-pages
url: $
runs-on: ubuntu-latest
needs: build
steps:
- name: Deploy to GitHub Pages
id: deployment
uses: actions/deploy-pages@v2
From here, I tried to make my best guess at modifying it to something that might work for eleventy, which is a nodejs(>=14.x) package
name: Build Eleventy
on:
# Runs on pushes targeting the default branch
push:
branches: ["main"]
# Allows you to run this workflow manually from the Actions tab
workflow_dispatch:
# Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages
permissions:
contents: read
pages: write
id-token: write
jobs:
build:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v3
- name: Use Node.js >= 14.x
uses: actions/setup-node@v3
with:
node-version: 20.x
- name: run eleventy
run: npx @11ty/eleventy
- name: upload static site content
uses: actions/upload-pages-artifact@v2
with:
path: ./_site
# Deployment job
deploy:
environment:
name: github-pages
url: $
runs-on: ubuntu-latest
needs: build
steps:
- name: Deploy to GitHub Pages
id: deployment
uses: actions/deploy-pages@v2
Which when copied into .github/workflows/build.yml
in your repository should give you a working eleventy site.
For your own understanding, the above github action can be roughly abstracted to this:
- create a github action called "Build Eleventy"
- make sure this action runs whenever we push on the main branch
- flip some switches so that deployment to gh-pages works
- grab a ubuntu computer, then:
- pull the code from the current repository this file exists on
- download nodejs
- run the eleventy build command
- grab the output from the default eleventy output dir
./_site
and then store that folder for the deploy process - start the deployment process:
- grab the folder we created in the build step and then deploy that to github pages
After making this, I was hoping I'd be able to make a pull request on the official github start-workflows repository, the pre-requistes to make a pull request was incredibly long and said that "Please note that at this time we are only accepting new starter workflows for Code Scanning. Updates to existing starter workflows are fine." at the top, so I didn't make it
written at Sun Sep 10 2023 19:23:40 GMT+0000 (Coordinated Universal Time)