Skip to navigation Skip to main content

Continuous Integration

Github CI pipelines

Github Continuous Integration

This starter comes with 3 github pipelines that can be used for your project’s continuous integration.

Deployment to github pages

pipeline: pages.yml
prerequisites: In your repository settings, you need to set github-pages as a new environment.

The pipeline is triggered on every update of the default branch. it will deploy the static site generated by 11ty (in _site) to github pages that will make it available at https://<your_account_name>.github.io/<your_repository_name>

If you choose this solution to publish your site, remember that the your_repository_name needs to be added to the meta.json.

More on Github pages: https://docs.github.com/en/pages/getting-started-with-github-pages/creating-a-github-pages-site

Deployment on a standalone server

pipeline: test.yml
prerequisites: You need to set up your own web server accessible via ssh.

The pipeline is triggered on every update of the branch called test or manually in the apropriate github action page ‘Deploy 11ty test 🛠️’.

It will copy the static site generated by 11ty (in _site) to the server of your choice using ssh.

To do so, you will need to create an ssh key and copy the public key to .ssh/authorized_keys. You will then need to save in your repository secrets all your server details:

Lighthouse pipeline

pipeline: lighthouse.yml
prerequisites: You need to create a LHCI_GITHUB_APP_TOKEN that you save in tokens and authorise the lighthouse-ci App in the repository setting of your project.

The lighthouse pipeline is triggered on every pull request, it will display the lighthouse score of the index page within your pull request checks. If you don’t get all 💯. the test will display the an error and a link to the lighthouse page that tells you what to do to fix it. If it is all green, you can merge your changes in.

The settings of lighthouse are done in lighthouserc.js at the root of the project. It is possible to add assertions to focus on certain aspects of lighthouse measurements or allow more flexibility.

The current project tests three pages. It is possible to add more, but be aware that adding too many pages may cause the PR checks to time out.

More on lighthouse-ci: https://github.com/GoogleChrome/lighthouse-ci/blob/main/docs/getting-started.md

Accessibility pipeline

pipeline: axe.yml
prerequisites: none

The Accessibility pipeline is triggered on every pull request, it will run Axe on the generated site and return the number of accessibility violations found. If any violation is found, the action logs lists the broblem with explainations on the accessibility rule that is violated. Note that axe only knows the generated html so it cannot tell you which line of your code is wrong.

The current pipeline only tests the homepage accessibility.

Please note that only 20% to 50% of all accessibility issues can automatically be detected.
Manual testing is always required.