Skip to content

Commit 02c14c5

Browse files
GeekTrainerCopilot
andcommitted
Add GitHub Actions workshop section
Create a new ~3-hour workshop section covering CI/CD with GitHub Actions: - Introduction & first CI workflow - Marketplace & caching - Matrix strategies & parallel testing - Deploying to Azure with azd - Creating custom actions - Reusable workflows - Required workflows, branch protection & wrap-up Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
1 parent 233206c commit 02c14c5

9 files changed

Lines changed: 1494 additions & 2 deletions

content/README.md

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,12 @@
11
# Pets workshop
22

3-
This repository contains two workshops:
3+
This repository contains three workshops:
44

55
- a [one hour](./1-hour/README.md) workshop focused on GitHub Copilot.
66
- a [full-day](./full-day/README.md) workshop which covers a full day-in-the-life of a developer using GitHub for their DevOps processes.
7+
- a [GitHub Actions](./github-actions/README.md) workshop covering CI/CD pipelines from running tests to deploying to Azure.
78

8-
Both workshops are built around a fictional dog shelter, where you are a volunteer helping them build out their website.
9+
All workshops are built around a fictional dog shelter, where you are a volunteer helping them build out their website.
910

1011
## Get started
1112

Lines changed: 170 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,170 @@
1+
# Introduction & Your First CI Workflow
2+
3+
| [← GitHub Actions: From CI to CD][walkthrough-previous] | [Next: The Marketplace & Caching →][walkthrough-next] |
4+
|:-----------------------------------|------------------------------------------:|
5+
6+
**Estimated time: 25 minutes**
7+
8+
[GitHub Actions][github-actions] is an automation platform built into GitHub that lets you build, test, and deploy your code directly from your repository. While it's most commonly used for CI/CD, it can automate just about any task in your development workflow — from labeling issues to resizing images.
9+
10+
Before diving in, here are the key terms you'll encounter:
11+
12+
- **Workflow**: An automated process defined in a YAML file, stored in `.github/workflows/`.
13+
- **Event**: A trigger that starts a workflow, such as a `push`, `pull_request`, or `workflow_dispatch`.
14+
- **Job**: A set of steps that run on the same runner. Jobs run in parallel by default.
15+
- **Step**: An individual task within a job — either a shell command (`run`) or a reusable action (`uses`).
16+
- **Runner**: The virtual machine that executes your jobs (e.g., `ubuntu-latest`).
17+
- **Action**: A reusable unit of code that performs a specific task, published on the [Actions Marketplace][actions-marketplace].
18+
19+
## Scenario
20+
21+
The shelter has built its application — a Flask API and Astro frontend — and now needs to automate testing to catch issues before they reach production. The goal is to ensure tests run on every push and pull request so that broken code never makes it to the main branch unnoticed.
22+
23+
## Understanding GitHub Actions
24+
25+
A workflow file is written in YAML and lives in the `.github/workflows/` directory. Here are the core sections you'll work with:
26+
27+
- `name`: A human-readable name for the workflow, displayed in the **Actions** tab.
28+
- `on`: Defines the events that trigger the workflow (e.g., `push`, `pull_request`).
29+
- `jobs`: Contains one or more jobs, each with a unique identifier.
30+
- `runs-on`: Specifies the runner environment (e.g., `ubuntu-latest`).
31+
- `steps`: An ordered list of tasks the job performs.
32+
- `uses`: References a reusable action (e.g., `actions/checkout@v4`).
33+
- `run`: Executes a shell command.
34+
35+
## Create the CI workflow
36+
37+
Let's create your first workflow to run the API tests automatically.
38+
39+
> [!TIP]
40+
> If you have GitHub Copilot, try asking it to generate a GitHub Actions workflow for running Python tests. You can compare its output with the steps below!
41+
42+
1. In your repository, create the folder `.github/workflows/` if it doesn't already exist.
43+
2. Create a new file named `.github/workflows/ci.yml`.
44+
3. Add the following content:
45+
46+
```yaml
47+
name: CI
48+
49+
on:
50+
push:
51+
branches: [main]
52+
pull_request:
53+
branches: [main]
54+
55+
jobs:
56+
test-api:
57+
runs-on: ubuntu-latest
58+
59+
steps:
60+
- uses: actions/checkout@v4
61+
62+
- name: Set up Python
63+
uses: actions/setup-python@v5
64+
with:
65+
python-version: '3.12'
66+
67+
- name: Install dependencies
68+
run: |
69+
python -m pip install --upgrade pip
70+
pip install -r server/requirements.txt
71+
pip install pytest
72+
73+
- name: Run tests
74+
working-directory: ./server
75+
run: |
76+
python -m pytest test_app.py -v
77+
```
78+
79+
4. Save the file.
80+
81+
> [!NOTE]
82+
> The workflow triggers on both `push` to main and `pull_request` targeting main. This ensures tests run whether you push directly or open a PR.
83+
84+
## Push and explore
85+
86+
Now let's push the workflow and see it in action.
87+
88+
1. Stage and commit your changes:
89+
90+
```bash
91+
git add .github/workflows/ci.yml
92+
git commit -m "Add CI workflow"
93+
```
94+
95+
2. Push to your repository:
96+
97+
```bash
98+
git push
99+
```
100+
101+
3. Navigate to your repository on GitHub and select the **Actions** tab.
102+
4. You should see the **CI** workflow running. Select it to view the details.
103+
5. Select the **test-api** job to explore the logs for each step — you'll see the checkout, Python setup, dependency installation, and test results.
104+
105+
## Add a build job
106+
107+
With the API tests passing, let's add a job to build the frontend client.
108+
109+
1. Open `.github/workflows/ci.yml` and add the following job below `test-api`:
110+
111+
```yaml
112+
build-client:
113+
runs-on: ubuntu-latest
114+
needs: test-api
115+
116+
steps:
117+
- uses: actions/checkout@v4
118+
119+
- name: Set up Node.js
120+
uses: actions/setup-node@v4
121+
with:
122+
node-version: '20'
123+
124+
- name: Install dependencies
125+
working-directory: ./client
126+
run: npm ci
127+
128+
- name: Build client
129+
working-directory: ./client
130+
run: npm run build
131+
```
132+
133+
> [!NOTE]
134+
> The `needs: test-api` line creates a dependency — `build-client` will only run after `test-api` completes successfully. Remove this line if you'd prefer both jobs to run in parallel.
135+
136+
2. Save the file.
137+
3. Stage, commit, and push:
138+
139+
```bash
140+
git add .github/workflows/ci.yml
141+
git commit -m "Add client build job to CI workflow"
142+
git push
143+
```
144+
145+
4. Return to the **Actions** tab and observe both jobs. If you used `needs`, you'll see them run sequentially; otherwise they'll run in parallel.
146+
147+
## Summary and next steps
148+
149+
Congratulations! You've created your first CI workflow with GitHub Actions. Tests now run automatically on every push and pull request, and the client is built to verify there are no build errors. This is the foundation of continuous integration — catching problems early so they don't reach production.
150+
151+
Next, we'll explore the [Actions Marketplace][walkthrough-next] to discover pre-built actions and speed up our workflow with caching.
152+
153+
### Resources
154+
155+
- [GitHub Actions documentation][github-actions-docs]
156+
- [Workflow syntax for GitHub Actions][workflow-syntax]
157+
- [Events that trigger workflows][workflow-triggers]
158+
- [Understanding GitHub Actions][understanding-actions]
159+
160+
| [← GitHub Actions: From CI to CD][walkthrough-previous] | [Next: The Marketplace & Caching →][walkthrough-next] |
161+
|:-----------------------------------|------------------------------------------:|
162+
163+
[actions-marketplace]: https://github.com/marketplace?type=actions
164+
[github-actions]: https://github.com/features/actions
165+
[github-actions-docs]: https://docs.github.com/en/actions
166+
[understanding-actions]: https://docs.github.com/en/actions/about-github-actions/understanding-github-actions
167+
[workflow-syntax]: https://docs.github.com/en/actions/writing-workflows/workflow-syntax-for-github-actions
168+
[workflow-triggers]: https://docs.github.com/en/actions/writing-workflows/choosing-when-your-workflow-runs/events-that-trigger-workflows
169+
[walkthrough-previous]: README.md
170+
[walkthrough-next]: 1-marketplace-and-caching.md
Lines changed: 132 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,132 @@
1+
# The Marketplace & Caching
2+
3+
| [← Introduction & Your First CI Workflow][walkthrough-previous] | [Next: Matrix Strategies & Parallel Testing →][walkthrough-next] |
4+
|:-----------------------------------|------------------------------------------:|
5+
6+
**Estimated time: 25 minutes**
7+
8+
The [GitHub Actions Marketplace][actions-marketplace] is a collection of pre-built actions created by GitHub and the community. Actions can set up tools, run tests, deploy code, send notifications, and much more. Rather than writing everything from scratch, you can leverage the work of thousands of developers.
9+
10+
In this exercise you'll also learn about **caching** — a technique to speed up your workflows by reusing previously downloaded dependencies instead of fetching them from the internet on every run.
11+
12+
## Scenario
13+
14+
The CI workflow works, but it reinstalls every dependency from scratch on every run. That means downloading Python packages and Node modules each time — even when they haven't changed. The marketplace has actions that can streamline setup and add caching to speed things up significantly.
15+
16+
## Exploring the marketplace
17+
18+
Let's take a look at what's available.
19+
20+
1. Navigate to [github.com/marketplace][marketplace] and filter to **Actions** using the left sidebar.
21+
2. Search for **setup-python** and select the official **actions/setup-python** result.
22+
3. Take note of a few things on the action page:
23+
- The **Verified creator** badge — this indicates the action is published by a trusted organization.
24+
- The version tags (e.g., `@v5`) — you'll use these to pin a specific version.
25+
- The **Inputs** and **Outputs** sections — these describe what the action accepts and provides.
26+
27+
> [!IMPORTANT]
28+
> When evaluating third-party actions, always check for the **Verified creator** badge, review the repository's maintenance activity (recent commits, open issues), and pin actions to a specific version or commit SHA. Using unverified or unpinned actions can introduce security risks into your pipeline.
29+
30+
4. Search for **setup-node** and review the [actions/setup-node][setup-node] action page. Notice both `setup-python` and `setup-node` support built-in caching.
31+
32+
## Add caching to the workflow
33+
34+
Let's update our CI workflow to take advantage of built-in caching.
35+
36+
1. Open `.github/workflows/ci.yml`.
37+
2. Update the **Set up Python** step in the `test-api` job to enable pip caching:
38+
39+
```yaml
40+
- name: Set up Python
41+
uses: actions/setup-python@v5
42+
with:
43+
python-version: '3.12'
44+
cache: 'pip'
45+
```
46+
47+
> [!NOTE]
48+
> The `cache: 'pip'` option tells `setup-python` to cache downloaded pip packages. On the first run it saves the cache; on subsequent runs it restores it, skipping most download time.
49+
50+
3. Update the **Set up Node.js** step in the `build-client` job to enable npm caching:
51+
52+
```yaml
53+
- name: Set up Node.js
54+
uses: actions/setup-node@v4
55+
with:
56+
node-version: '20'
57+
cache: 'npm'
58+
cache-dependency-path: 'client/package-lock.json'
59+
```
60+
61+
> [!TIP]
62+
> The `cache-dependency-path` input tells the action where to find the lock file. This is important when your `package-lock.json` isn't at the repository root.
63+
64+
4. Save the file.
65+
66+
## Upload build artifacts
67+
68+
Artifacts let you persist files produced during a workflow run — such as build outputs, test reports, or logs. Let's upload the client build so it's available for download or use by later jobs.
69+
70+
1. In the `build-client` job, add a new step after the **Build client** step:
71+
72+
```yaml
73+
- name: Upload build artifact
74+
uses: actions/upload-artifact@v4
75+
with:
76+
name: client-dist
77+
path: client/dist/
78+
```
79+
80+
2. Save the file.
81+
82+
> [!NOTE]
83+
> Artifacts are stored for 90 days by default. You can download them from the workflow run page by selecting the artifact name under the **Artifacts** section. This is useful for sharing build outputs, deploying from a later job, or debugging failed builds.
84+
85+
## Compare run times
86+
87+
Now let's push the changes and see the impact of caching.
88+
89+
1. Stage, commit, and push your changes:
90+
91+
```bash
92+
git add .github/workflows/ci.yml
93+
git commit -m "Add caching and artifact upload to CI workflow"
94+
git push
95+
```
96+
97+
2. Navigate to the **Actions** tab and observe the workflow run.
98+
3. Once it completes, check the logs for the setup steps. You should see output indicating a **cache miss** — this is expected on the first run since there's nothing cached yet.
99+
4. To see caching in action, trigger a second run. You can push a small change (such as adding a comment to `ci.yml`) or use the GitHub UI:
100+
- Update the `on` section to add `workflow_dispatch:` so you can trigger runs manually
101+
- Push that change, then use the **Run workflow** button on the **Actions** tab
102+
103+
5. On the second run, check the setup step logs again. You should see a **cache hit**, and the overall run time should be noticeably shorter.
104+
105+
> [!TIP]
106+
> You can view cache usage for your repository by navigating to **Actions** > **Caches** in the left sidebar. This shows all active caches, their sizes, and when they were last used.
107+
108+
## Summary and next steps
109+
110+
The Actions Marketplace provides thousands of pre-built actions so you don't have to reinvent the wheel. Caching can dramatically reduce workflow run times by reusing previously downloaded dependencies. Artifacts let you persist and share build outputs across jobs and with your team.
111+
112+
Next, we'll explore [matrix strategies][walkthrough-next] to test across multiple configurations simultaneously.
113+
114+
### Resources
115+
116+
- [GitHub Actions Marketplace][actions-marketplace]
117+
- [Caching dependencies to speed up workflows][caching-docs]
118+
- [Storing and sharing data from a workflow][artifacts-docs]
119+
- [actions/setup-python][setup-python-action]
120+
- [actions/setup-node][setup-node]
121+
122+
| [← Introduction & Your First CI Workflow][walkthrough-previous] | [Next: Matrix Strategies & Parallel Testing →][walkthrough-next] |
123+
|:-----------------------------------|------------------------------------------:|
124+
125+
[actions-marketplace]: https://github.com/marketplace?type=actions
126+
[artifacts-docs]: https://docs.github.com/en/actions/writing-workflows/choosing-what-your-workflow-does/storing-and-sharing-data-from-a-workflow
127+
[caching-docs]: https://docs.github.com/en/actions/writing-workflows/choosing-what-your-workflow-does/caching-dependencies-to-speed-up-workflows
128+
[marketplace]: https://github.com/marketplace
129+
[setup-node]: https://github.com/actions/setup-node
130+
[setup-python-action]: https://github.com/actions/setup-python
131+
[walkthrough-previous]: 0-introduction.md
132+
[walkthrough-next]: 2-matrix-strategies.md

0 commit comments

Comments
 (0)