Skip to content
Draft
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion .github/instructions/markdown.instructions.md
Original file line number Diff line number Diff line change
Expand Up @@ -142,7 +142,7 @@ Use Markdown image syntax with paths relative to the Markdown file:

## Path conventions

- Per-path lessons: `cli/`, `vscode/`, `cloud/`, `app/`. Files are numbered by lesson order: `1-installing.md`, `2-custom-instructions.md`, etc.
- Per-path lessons: `cli/`, `vscode/`, `cloud/`, `app/`. Files are numbered by lesson order: `1-install-copilot-cli.md`, `3-custom-instructions.md`, etc.
- Support images live in `_images/` directories and are excluded from routing by `website/src/content.config.ts`.

## Cross-repo links
Expand Down
10 changes: 5 additions & 5 deletions AUTHORING.md
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ copilot-workshops/
│ ├── vscode/ ← VS Code lessons (0-prerequisites.md + numbered exercises)
│ ├── cloud/ ← Cloud agent lessons (0-prerequisites.md + numbered exercises)
│ ├── app/ ← GitHub Copilot app lessons (setup 0–1, core modules 2–10)
│ ├── es-es/ ja-jp/ ... ← Translated locale trees (currently the app harness)
│ ├── es-es/ ja-jp/ ... ← Translated App and CLI locale trees
│ └── _images/ ← Screenshots and diagrams (shared across locales)
├── website/ ← Optional Astro + Starlight publisher
│ ├── astro.config.mjs ← Site URL, base path, locales, sidebar
Expand All @@ -31,7 +31,7 @@ copilot-workshops/

### Add a new lesson

1. **Pick a path and number.** Lessons live under `docs/{cli,vscode,app,cloud}/N-name.md`. `N` is the next available integer in that path; the number drives the URL slug (`/cli/3-generating-code/`).
1. **Pick a path and number.** Lessons live under `docs/{cli,vscode,app,cloud}/N-name.md`. `N` is the next available integer in that path; the number drives the URL slug (`/cli/4-build-filtering/`).
2. **Create the file** with frontmatter:
```markdown
---
Expand All @@ -44,8 +44,8 @@ copilot-workshops/
3. **Write the body.** Follow the [lesson pattern](#lesson-pattern), using Markdown and GitHub admonition syntax (`> [!NOTE]`) for callouts. See **Style essentials** below.
4. **Add prev/next navigation.** Define `[previous-lesson]` and `[next-lesson]` reference links at the bottom of the page, pointing at the adjacent lessons in the same path:
```markdown
[previous-lesson]: ../2-custom-instructions/
[next-lesson]: ../4-mcp/
[previous-lesson]: ../3-custom-instructions/
[next-lesson]: ../5-agent-skills/
```
Then surface them in the body using **the same style as the other lessons in your path** — don't mix styles within a path:
- **Woven into prose** (common in the CLI path): end the lesson with a sentence like ``the next step is to [create the PR][next-lesson]``.
Expand Down Expand Up @@ -97,7 +97,7 @@ When you add a new harness or locale landing, name it `README.md` and set its `s

### Edit an existing lesson

1. **Find the file** under `docs/` (use the published URL as a hint — `/cli/3-generating-code/` lives at `docs/cli/3-generating-code.md`).
1. **Find the file** under `docs/` (use the published URL as a hint — `/cli/4-build-filtering/` lives at `docs/cli/4-build-filtering.md`).
2. **Edit the Markdown.** Same conventions apply — see **Style essentials** below.
3. **Preview** with `npm run dev` in `website/`.
4. **Commit, PR, merge.**
Expand Down
2 changes: 1 addition & 1 deletion README.md
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@ For PR/CI rules, see **[CONTRIBUTING.md](./CONTRIBUTING.md)**.
- **`docs/`** — **Lesson source (plain Markdown). Edit here.** Browsable directly on github.com, no build required.
- `README.md` — Workshop landing page (also the published site's home via `slug: index`).
- `cli/`, `vscode/`, `cloud/`, `app/` — Per-harness lessons (Copilot CLI / VS Code / cloud agent / GitHub Copilot app). Each codespace-based harness opens with its own `0-prerequisites.md` setup lesson, and a folder `README.md` (routed via a `slug:` matching the folder) is its landing page.
- `es-es/`, `ja-jp/`, `ko-kr/`, `pt-br/`, `zh-cn/` — Translated locale trees (currently the app harness).
- `es-es/`, `ja-jp/`, `ko-kr/`, `pt-br/`, `zh-cn/` — Translated App and CLI locale trees.
- `_images/` — Screenshots and diagrams (shared across all locales).
- **`website/`** — Optional Astro + Starlight site that publishes `docs/` to GitHub Pages. Only needed to self-host or preview the rendered site.
- `astro.config.mjs` — Site URL, base path, `locales` block, sidebar.
Expand Down
4 changes: 2 additions & 2 deletions docs/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ title: "Hands-on with GitHub Copilot's agents"
slug: index
authors:
- geektrainer
lastUpdated: 2026-06-30
lastUpdated: 2026-09-11
---

The recent additions to the capabilities of GitHub Copilot provide powerful tools to the developer across the entire software development lifecycle (SDLC). This includes working with issues and pull requests on GitHub, interacting with external services, and of course code creation. This lab explores the functionality, providing real-world use cases and tips on how to get the most out of the tools.
Expand All @@ -23,7 +23,7 @@ GitHub Copilot inside **Visual Studio Code** and GitHub Codespaces. Work with Co

### 💻 [Copilot CLI](cli/)

**GitHub Copilot CLI** — an agentic assistant that runs in your terminal. Install it, connect MCP servers, generate code with plan mode, and build your own skills, custom agents, and slash commands, all from the command line.
**GitHub Copilot CLI** — an agentic assistant that runs in your terminal. After setup, follow nine core modules: ship a star-rating quick win, establish instructions, plan and build filtering, create a quality-checks skill, validate through Playwright MCP, create a QA agent, and merge the feature. Finish with CLI controls and a wrap-up. The flow has three pull-request milestones.

### 🤖 [Copilot App](app/)

Expand Down
14 changes: 13 additions & 1 deletion docs/cli/0-prerequisites.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,15 +2,22 @@
title: "Exercise 0: Prerequisites"
authors:
- geektrainer
lastUpdated: 2026-06-30
lastUpdated: 2026-09-11
---

Before you start the Copilot CLI exercises, you need to get everything ready. You'll create your own copy of the Tailspin Toys repository and spin up a [codespace][codespaces], whose integrated terminal you'll use to install and run Copilot CLI in the next exercise.

In this exercise, you will:

- create your own repository from the Tailspin Toys template.
- open a codespace and confirm the workspace is ready for CLI setup.

## Setting up the lab repository

To create a copy of the repository for the code you'll create, you'll make an instance from the [template][template-repository]. The new instance will contain all of the necessary files for the lab, and you'll use it as you work through the exercises.

Use a fresh template copy. It includes repository instructions, application code, tests, and CI, but no supplied custom agents or skills. You'll create those assets yourself. If you are returning to an older copy, inspect existing customizations before changing them; do not overwrite your own work.

1. In a new browser window, navigate to the GitHub repository for this lab: `https://github.com/github-samples/tailspin-toys`.
2. Create your own copy of the repository by selecting the **Use this template** button on the lab repository page. Then select **Create a new repository**.

Expand All @@ -26,6 +33,9 @@ To create a copy of the repository for the code you'll create, you'll make an in
> **Your backlog is ready**
>
> When you create your repository from the template, a backlog of GitHub issues is created for you automatically. You'll work from these issues throughout the workshop — there's nothing to file yourself.

Wait for the issue-bootstrap workflow to finish, then check the **Issues** tab for **Allow users to filter games by category and publisher** and **Update our repository coding standards**. Use their actual titles and URLs in the lessons, not assumed issue numbers. If the backlog is missing, inspect the workflow result before proceeding.

## Creating a codespace

Next up, you'll use a codespace to complete the lab exercises.
Expand All @@ -49,6 +59,8 @@ The creation of the codespace will take several minutes, although it's still far
> [!NOTE]
> This workshop is built to run inside a codespace or local [dev container][dev-containers]. Both ensure the environment has all the necessary prerequisites installed for a smooth experience. If you'd prefer to run it locally, open the cloned repository in VS Code and select **Reopen in Container** when prompted — VS Code will build the same dev container the codespace uses.

Once your codespace is ready, [Exercise 1][next-lesson] will open its terminal and check the repository, runtime, and authentication before installing Copilot CLI.

## Summary

Congratulations, you have created a copy of the lab repository! You also began the creation process of your codespace, which you'll use when you begin working with Copilot CLI.
Expand Down
56 changes: 44 additions & 12 deletions docs/cli/1-install-copilot-cli.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
title: "Exercise 1 - Installing GitHub Copilot CLI"
authors:
- geektrainer
lastUpdated: 2026-06-30
lastUpdated: 2026-09-11
---

[GitHub Copilot CLI][about-copilot-cli] is a powerful agentic coding assistant that runs in your terminal, enabling you to explore codebases, generate code, run commands, and interact with external tools - all from the command line. It allows you to offload tasks, request changes, and stay in the zone. The first step, as you might imagine, is to install the tool! Fortunately this can be done using tools you're already familiar with.
Expand All @@ -21,10 +21,25 @@ Your team is starting to use AI agents to work through a growing backlog. Copilo

Before installing Copilot CLI, you need to open a terminal window in your codespace.

1. Return to your codespace if you're not already there.
1. Return to your codespace and wait for its setup to finish.
2. Open a terminal window by pressing <kbd>Ctrl</kbd>+<kbd>\`</kbd>.
3. You should see a terminal panel appear at the bottom of your VS Code window.

## Confirm the learner environment

In the codespace terminal, confirm you are in your own Tailspin Toys repository, not the workshop-content repository. Read its `README.md` and `package.json` for setup and check commands. Current Tailspin Toys requires Node.js 22.13 or later, project dependencies, and Playwright Chromium for E2E testing.

```bash
pwd
git remote -v
node --version
gh auth status
```

GitHub CLI (`gh`) will help inspect PRs and CI. If authentication is missing, use `gh auth login` and follow its browser instructions. Confirm your account can push branches and create and merge PRs in this repository; organizational policies may require another reviewer. Resolve missing prerequisites using the repository setup instructions before starting code changes, and review any installation before authorizing it.

The CLI runs against the checkout where you start it; starting a conversation does not automatically create an isolated worktree. This workshop uses one branch per PR milestone. You'll merge star ratings and the instructions demonstration first, then keep the same filtering branch through Exercises 4–8.

## Install Copilot CLI

You can install Copilot CLI through [npm][install-npm], [WinGet][install-winget], and [Homebrew][install-homebrew]. Since GitHub Codespaces come with Node.js pre-installed you'll use npm to install Copilot CLI.
Expand All @@ -35,7 +50,7 @@ You can install Copilot CLI through [npm][install-npm], [WinGet][install-winget]
node --version
```

You should see version 22 or higher (e.g., `v22.x.x`).
Tailspin Toys requires version 22.13 or higher, even if the CLI's own requirement differs. Follow the learner repository's setup instructions if your version is too old.

2. Install Copilot CLI globally in the codespace using npm:

Expand All @@ -51,8 +66,8 @@ You can install Copilot CLI through [npm][install-npm], [WinGet][install-winget]

You should see the version number displayed (e.g., `v1.0.XX`).

> [!TIP]
> If you encounter permission errors, you may need to use `sudo npm install -g @github/copilot` on some systems. However, this shouldn't be necessary in GitHub Codespaces.
> [!NOTE]
> If installation fails with a permission error, inspect your npm configuration or ask your workshop leader for help rather than rerun an unfamiliar command with elevated privileges.

## Authenticate with GitHub

Expand Down Expand Up @@ -85,22 +100,39 @@ Now that you're at the Copilot CLI prompt for the first time, let's trust this w
2. For this workshop, select **Yes, and remember this folder for future sessions** since you'll be working in this repository throughout.
3. Ask Copilot a simple question to verify it's working:

```
```plaintext
What files are in this project?
```

4. Copilot should explore the repository and provide a summary of the project structure.
5. Try the `/help` command to see available slash commands:

```
```text
/help
```

6. Exit Copilot CLI by entering the following command in the terminal. We will return back to Copilot CLI in a future exercise!
6. Exit this session by entering the following command at the Copilot prompt. You'll start a fresh session for the first change.

```text
/exit
```
exit
```

## Understand modes and permissions

Copilot CLI works in the directory and Git branch where you launch it. Trusting a directory lets it use repository context; it is not the same as approving every tool action. Review permission requests for file changes, shell commands, and GitHub operations.

Start the code exercises from your learner repository root with:

```bash
copilot --enable-all-github-mcp-tools
```

The GitHub MCP server is built in. This flag exposes its full tool set for issue and PR work; authentication, repository permissions, and tool approvals still apply. It does not authorize a commit or PR on its own.

Use <kbd>Shift</kbd>+<kbd>Tab</kbd> to cycle between standard **Interactive**, **Plan**, and **Autopilot** modes. Check the mode indicator before sending a request. You'll stay Interactive for the early changes, plan filtering before building it, and explicitly return to Interactive before creating and reviewing customizations.

> [!CAUTION]
> Mode and permission settings are different. Autopilot continues working autonomously; `--allow-all` and its alias `--yolo` grant all tool, path, and URL permissions. This workshop does not require starting every session with unrestricted permissions. Review the scope before granting access, even inside a codespace.

## Summary and next steps

Expand All @@ -111,7 +143,7 @@ Congratulations! You've successfully installed and authenticated GitHub Copilot
- trust a directory for Copilot CLI to work with.
- verify the installation is working correctly.

Now that Copilot CLI is installed, let's give Copilot some project context. Continue to [Exercise 2 - Custom instructions with CLI][next-lesson].
Now that Copilot CLI is installed, make a small, reviewable change in [Exercise 2 - Add star ratings: a quick win][next-lesson].

## Resources

Expand All @@ -120,7 +152,7 @@ Now that Copilot CLI is installed, let's give Copilot some project context. Cont
- [Using Copilot CLI][using-copilot-cli]

[previous-lesson]: ../0-prerequisites/
[next-lesson]: ../2-custom-instructions/
[next-lesson]: ../2-add-star-rating/
[install-copilot-cli]: https://docs.github.com/copilot/how-tos/set-up/install-copilot-cli
[install-npm]: https://docs.github.com/copilot/how-tos/copilot-cli/set-up-copilot-cli/install-copilot-cli#installing-with-npm-all-platforms
[install-winget]: https://docs.github.com/copilot/how-tos/copilot-cli/set-up-copilot-cli/install-copilot-cli#installing-with-winget-windows
Expand Down
Loading
Loading