CI/CD for an Eleventy + Netlify CMS Site with GitHub Actions

Validate content, build the 11ty site, and deploy to Netlify automatically.

Eleventy (11ty) is a zero-config static site generator, and Netlify CMS (Decap) edits Markdown content committed to the repo. This recipe builds the site and deploys it to Netlify on push.

What the pipeline does

• install deps with npm ci
• lint Markdown and check links
• build the static site with eleventy
• deploy _site to Netlify
• comment a deploy preview on PRs

The workflow

Eleventy outputs to _site. The Netlify CLI deploys that directory; on pull requests it produces a draft preview instead of a production deploy.

name: CI
on:
  push:
    branches: [main]
  pull_request:
jobs:
  build:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - uses: actions/setup-node@v4
        with:
          node-version: 20
          cache: npm
      - run: npm ci
      - run: npx markdownlint-cli2 "**/*.md"
      - run: npx @11ty/eleventy
      - name: Deploy to Netlify
        run: npx netlify-cli deploy --dir=_site --prod=${{ github.ref == 'refs/heads/main' }}
        env:
          NETLIFY_AUTH_TOKEN: ${{ secrets.NETLIFY_AUTH_TOKEN }}
          NETLIFY_SITE_ID: ${{ secrets.NETLIFY_SITE_ID }}

Caching and speed

cache: npm restores installs, and persisting .cache (image and fetch plugins write here) with actions/cache avoids re-downloading remote assets. Builds are quick, but running on cheaper managed runners such as Latchkey (around 69% cheaper than GitHub-hosted) trims cost across many content pushes, with auto-retry covering Netlify API blips.

Deploying

On main the Netlify CLI runs a production deploy of _site; on PRs it posts a draft preview URL. Netlify CMS writes content commits straight to the repo, which retriggers this workflow.

Key takeaways

• Eleventy builds to _site with no config required.
• Gate prod vs draft on github.ref so PRs get preview deploys.
• Netlify CMS content commits retrigger the build automatically.

Related guides