Skip to content
Merged
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
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
---
name: Demo task
about: A scoped task for driving a GitHub Copilot app session during the Lunch & Learn
name: Practice task
about: A scoped task for driving a GitHub Copilot app session while following the walkthrough
title: ""
labels: demo
labels: practice
---

## Goal
Expand Down
8 changes: 4 additions & 4 deletions CONTRIBUTING.md
Original file line number Diff line number Diff line change
Expand Up @@ -3,23 +3,23 @@
Thanks for helping make this a better resource for learning the GitHub Copilot app! 🎉

This repo is a community **learning resource**, not an official GitHub product. The goal is a
workshop that's accurate, easy to run, and friendly to newcomers.
self‑guided walkthrough that's accurate, easy to follow, and friendly to newcomers.

## Ways to contribute

- **Fix or clarify the walkthroughs** in [`docs/`](docs/) — especially when the app's UI or docs
change.
- **Improve the sample app or exercises** in [`sample-app/`](sample-app/) and
[`exercises/`](exercises/).
- **Add a new exercise** that demonstrates an app feature not yet covered.
- **Add a new exercise** that exercises an app feature not yet covered.
- **Report issues** — out‑of‑date steps, broken links, confusing instructions.

## Ground rules

- Keep the sample app **small, dependency‑light, and beginner‑friendly**. Resist scope creep.
- Keep `main` **green**: every change should keep `npm test` and `npm run build` passing.
- The four intentional gaps in the sample app are **load‑bearing** for the demos — don't fix them
in `main`; they each have an exercise.
- The four intentional gaps in the sample app are **load‑bearing** for the exercises — don't fix
them in `main`; they each have an exercise.
- Cross‑check product claims against the
[official docs](https://docs.github.com/copilot/how-tos/github-copilot-app/getting-started) and
link to them rather than restating volatile details.
Expand Down
41 changes: 21 additions & 20 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
# Learn the GitHub Copilot app

A hands‑on, copy‑paste‑able workshop for walking technical developers through the
A hands‑on, self‑paced walkthrough for getting real experience with the
**[GitHub Copilot app](https://github.com/features/ai/github-app)** — the agent‑driven
desktop app for macOS, Windows, and Linux that
[went GA on June 17, 2026](https://github.blog/changelog/2026-06-17-github-copilot-app-generally-available/).
Expand All @@ -10,41 +10,42 @@ desktop app for macOS, Windows, and Linux that
> and worktree; review the diff, validate in the integrated terminal and browser, and open a
> pull request that uses your team's existing checks — all without context‑switching.

This repo gives a facilitator everything needed to run the session and gives attendees a real,
runnable codebase to drive the agent against.
Clone this repo, open it in the app, and work through the modules at your own pace. You get a
real, runnable codebase to drive the agent against and a step‑by‑step path from your first quick
chat to shipping a reviewed pull request.

---

## Who this is for

- **Audience:** technical developers (comfortable with Git, a terminal, and a typical web stack).
- **Format:** ~45 minutes, demo‑led, with optional hands‑on exercises.
- **Outcome:** attendees can install the app, run sessions in the three modes, review and ship a
PR, run sessions in parallel, and know where the advanced features (canvases, automations,
- **You:** a developer comfortable with Git, a terminal, and a typical web stack.
- **Time:** about an hour end to end, or pick individual modules.
- **What you'll be able to do:** install the app, run sessions in the three modes, review and ship
a PR, run sessions in parallel, and know where the advanced features (canvases, automations,
MCP/BYOK, sandboxes) live.

## What's in here

| Path | What it is |
| --- | --- |
| [`docs/facilitator-guide.md`](docs/facilitator-guide.md) | Minute‑by‑minute run sheet for the 45‑minute session |
| [`docs/00-prerequisites.md`](docs/00-prerequisites.md) | Install + sign‑in checklist to send attendees beforehand |
| [`docs/walkthrough.md`](docs/walkthrough.md) | Start here — the suggested path through the modules |
| [`docs/00-prerequisites.md`](docs/00-prerequisites.md) | Install + sign‑in checklist to do first |
| [`docs/01-quick-chat.md`](docs/01-quick-chat.md) | Module 1 — Quick chats |
| [`docs/02-first-session.md`](docs/02-first-session.md) | Module 2 — Your first agent session (modes) |
| [`docs/03-review-and-pr.md`](docs/03-review-and-pr.md) | Module 3 — Review the diff, verify, open a PR |
| [`docs/04-parallel-sessions.md`](docs/04-parallel-sessions.md) | Module 4 — Parallel sessions & worktrees |
| [`docs/05-modes-and-models.md`](docs/05-modes-and-models.md) | Module 5 — Modes, models & reasoning effort |
| [`docs/06-advanced.md`](docs/06-advanced.md) | Module 6 — Canvases, automations, MCP/BYOK, sandboxes, `/chronicle` |
| [`docs/cheatsheet.md`](docs/cheatsheet.md) | One‑page reference to project on screen |
| [`exercises/`](exercises/) | Ready‑made demo tasks + seed issues + solutions |
| [`docs/cheatsheet.md`](docs/cheatsheet.md) | One‑page reference to keep open while you work |
| [`exercises/`](exercises/) | Ready‑made tasks + seed issues + solutions |
| [`sample-app/`](sample-app/) | A tiny Express + TypeScript Task API to drive the agent against |

## The sample app

[`sample-app/`](sample-app/) is a tiny **Express + TypeScript Task API** with a passing
[Vitest](https://vitest.dev) + [Supertest](https://github.com/ladjs/supertest) suite. It is
deliberately small and has a few **intentional gaps** so the agent has real work to do during
the demo:
deliberately small and has a few **intentional gaps** so the agent has real work to do as you
follow along:

1. `POST /tasks` has **no input validation**.
2. There is **no `DELETE /tasks/:id`** endpoint (and `TaskStore.remove()` is missing).
Expand All @@ -61,14 +62,14 @@ npm test # 8 passing tests
npm run dev # http://localhost:3000 (GET /health, /tasks)
```

## Run the Lunch & Learn
## How to follow along

1. **Before the session:** send attendees [`docs/00-prerequisites.md`](docs/00-prerequisites.md)
so they arrive with the app installed and signed in.
2. **Fork or use this repo** so you (and attendees) have issues and PRs to work with. Optionally
create the demo issues in one shot — see [`exercises/seed-issues.md`](exercises/seed-issues.md).
3. **Follow** [`docs/facilitator-guide.md`](docs/facilitator-guide.md) start to finish.
4. **Project** [`docs/cheatsheet.md`](docs/cheatsheet.md) when you want attendees to follow along.
1. **Set up first:** work through [`docs/00-prerequisites.md`](docs/00-prerequisites.md) so the app
is installed, signed in, and this repo is connected.
2. **Fork or clone this repo** so you have your own issues and PRs to work with. Optionally
create the practice issues in one shot — see [`exercises/seed-issues.md`](exercises/seed-issues.md).
3. **Work through** [`docs/walkthrough.md`](docs/walkthrough.md) module by module.
4. **Keep** [`docs/cheatsheet.md`](docs/cheatsheet.md) open as a quick reference while you work.

## License & contributing

Expand Down
13 changes: 6 additions & 7 deletions docs/00-prerequisites.md
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
# 00 · Prerequisites & setup (send this before the session)
# 00 · Prerequisites & setup

Send this page to attendees a day ahead so everyone arrives ready. Setup eats demo time —
front‑load it.
Get this out of the way first so the rest of the walkthrough goes smoothly. None of it takes long.

## What you need

Expand Down Expand Up @@ -47,12 +46,12 @@ The **sidebar** is your map:
- **Search** — search across your repositories.
- **Sessions** — active agent sessions grouped by repository, plus **Quick chats**.

## Facilitator pre‑flight
## Quick checklist

- [ ] Signed in, this repo connected.
- [ ] Demo issues created (see [`../exercises/seed-issues.md`](../exercises/seed-issues.md)).
- [ ] Practice issues created (see [`../exercises/seed-issues.md`](../exercises/seed-issues.md)).
- [ ] `npm install` already run in `sample-app/`.
- [ ] Decide which **model** you'll demo and confirm it's available to you.
- [ ] Screen share set so the **right side panel** (where canvases/diffs open) is visible.
- [ ] Picked a **model** you want to try and confirmed it's available to you.
- [ ] Noted the **right side panel** — that's where canvases and diffs open.

➡️ Next: [01 · Quick chat](01-quick-chat.md)
14 changes: 7 additions & 7 deletions docs/01-quick-chat.md
Original file line number Diff line number Diff line change
@@ -1,35 +1,35 @@
# 01 · Quick chat — explore without a branch

**Time:** ~5 min · **Goal:** show the lowest‑friction entry point. Quick chats let you ask
questions and brainstorm **without creating a branch or worktree**.
**Goal:** see the lowest‑friction entry point. Quick chats let you ask questions and brainstorm
**without creating a branch or worktree**.

## Why start here

Not every question needs an agent session. Quick chats are perfect for orientation, scoping, and
"how does this work?" moments — and they cost less than spinning up a full session.

## Do it live
## Try it

1. In the sidebar, click **+** next to **Quick chats**.
2. Ask something grounded in this repo:

> Give me an overview of the `sample-app` Task API: its routes, where state lives, and any gaps
> or TODOs you can find.

3. Follow up to show it's a real conversation:
3. Follow up to see it's a real conversation:

> Which endpoint is missing input validation, and what would you add?

## Talking points
## What's happening

- **No side effects.** Nothing is branched or written — it's a conversation.
- **Repo‑aware.** It can read the connected repo to ground its answers.
- **Scope before you build.** Use a quick chat to clarify requirements, then open a session to do
the work. This is the recommended way to keep AI usage efficient.
- **History is saved.** Chats are listed by name so you can come back to them.

## Land the transition
## Before you move on

> "Great — Copilot understands the gap. Now let's give it a branch and have it actually fix one."
Copilot now understands the gap. Next, give it a branch and have it actually fix one.

➡️ Next: [02 · Your first session](02-first-session.md)
16 changes: 8 additions & 8 deletions docs/02-first-session.md
Original file line number Diff line number Diff line change
@@ -1,9 +1,9 @@
# 02 · Your first agent session — the centerpiece

**Time:** ~12 min · **Goal:** start a session from an issue, use **Plan** mode to agree on an
approach, then **Interactive** mode to steer the agent to a real, tested change.
**Goal:** start a session from an issue, use **Plan** mode to agree on an approach, then
**Interactive** mode to steer the agent to a real, tested change.

This is the most important module. Slow down and narrate what you're doing and why.
This is the most important module. Take your time and pay attention to what you're doing and why.

## The change we'll make

Expand All @@ -16,8 +16,8 @@ behind it.
1. In the sidebar, open **My work** and find the issue **"Add input validation to POST /tasks"**
(create it first with [`seed-issues.md`](../exercises/seed-issues.md) if needed).
2. Click the issue, then **New session**. The issue context loads automatically.
3. Below the prompt, choose where the session runs: a **new working tree** (recommended for the
demo — it keeps your main checkout clean), your local repo, or a **cloud sandbox**.
3. Below the prompt, choose where the session runs: a **new working tree** (recommended — it keeps
your main checkout clean), your local repo, or a **cloud sandbox**.
4. Pick a **session mode**, **model**, and **reasoning effort** (more on these in
[05](05-modes-and-models.md)).

Expand All @@ -32,11 +32,11 @@ Select **Plan** mode and prompt:
> `title` should return `400` with a clear JSON error and must not create a task. Add tests
> covering the happy path and the invalid cases.

The agent proposes a plan. **Read it aloud.** Approve it, or steer it:
The agent proposes a plan. **Read it carefully.** Approve it, or steer it:

> Keep it dependency‑free — validate in the route handler, don't add a validation library.

**Point to make:** Plan mode front‑loads the disagreements. You catch a wrong approach before any
**Why it matters:** Plan mode front‑loads the disagreements. You catch a wrong approach before any
code is written.

## Step 2 — Interactive mode (steer the work)
Expand All @@ -47,7 +47,7 @@ Switch to **Interactive** mode and let it implement. As it works:
- Nudge it if needed:
> Also return `400` when `title` is only whitespace, and add a test for that.

**Point to make:** you're collaborating turn by turn — the agent suggests, you approve or redirect.
**Why it matters:** you're collaborating turn by turn — the agent suggests, you approve or redirect.

## Step 3 — Confidence check with rubber duck (optional)

Expand Down
14 changes: 7 additions & 7 deletions docs/03-review-and-pr.md
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
# 03 · Review the diff, verify, and open a PR

**Time:** ~7 min · **Goal:** treat agent output like any teammate's — read the diff, verify it
runs, then ship it through your normal GitHub flow.
**Goal:** treat agent output like any teammate's — read the diff, verify it runs, then ship it
through your normal GitHub flow.

## Step 1 — Read the diff

Expand All @@ -11,7 +11,7 @@ Open the session's **diff** view and walk the changes:
- Is the validation logic correct and the error shape sensible?
- Are the new tests meaningful, not just present?

**Point to make:** the diff is the contract. You review the change, not the chat transcript.
**Why it matters:** the diff is the contract. You review the change, not the chat transcript.

## Step 2 — Verify in the integrated terminal

Expand All @@ -29,7 +29,7 @@ npm run dev
# in another terminal tab:
curl -s -X POST http://localhost:3000/tasks -H "content-type: application/json" -d "{}"
# expect HTTP 400 with a JSON error
curl -s -X POST http://localhost:3000/tasks -H "content-type: application/json" -d "{\"title\":\"Demo\"}"
curl -s -X POST http://localhost:3000/tasks -H "content-type: application/json" -d "{\"title\":\"Write docs\"}"
# expect HTTP 201 with the created task
```

Expand All @@ -40,7 +40,7 @@ Open the integrated **browser** canvas and hit:
- `http://localhost:3000/health` → `{ "status": "ok" }`
- `http://localhost:3000/tasks` → the tasks you created

**Point to make:** terminal + browser are *inside* the app, so reviewing and validating doesn't
**Why it matters:** terminal + browser are *inside* the app, so reviewing and validating doesn't
mean alt‑tabbing across three windows.

## Step 4 — Open the pull request
Expand All @@ -50,9 +50,9 @@ From the session, **create a pull request**. Then:
- Show the PR uses your repo's **existing checks and merge requirements** — the CI in
[`.github/workflows/ci.yml`](../.github/workflows/ci.yml) runs on the same change.
- Show that you can **review the PR and view CI status** from **My work** without leaving the app.
- Merge it (or leave it open for Q&A).
- Merge it, or leave it open to revisit later.

## The loop to name out loud
## The loop, end to end

> *issue → session (mode + model) → review the diff → verify → open PR → check CI → merge.*

Expand Down
20 changes: 10 additions & 10 deletions docs/04-parallel-sessions.md
Original file line number Diff line number Diff line change
@@ -1,15 +1,15 @@
# 04 · Parallel sessions & worktrees

**Time:** ~7 min · **Goal:** show the app's signature move — multiple agent sessions running at
once, each isolated on its own branch and git worktree.
**Goal:** see the app's signature move — multiple agent sessions running at once, each isolated on
its own branch and git worktree.

## Why this matters

Most "AI in the editor" tools are single‑threaded: one conversation, one working copy. The Copilot
app runs **many sessions in parallel**, each in a **dedicated worktree and branch**, so progress on
one task never clobbers another. You shift from *doing the work* to *directing several streams of it.*

## Do it live
## Try it

While the PR from Module 3 is building, start two more sessions from issues:

Expand All @@ -18,22 +18,22 @@ While the PR from Module 3 is building, start two more sessions from issues:
3. Session B — **"Fix: completing a task doesn't update updatedAt"** ([exercise 3](../exercises/README.md)).
4. Give each a one‑line prompt and let them run.

Now switch between **all three** sessions in the sidebar (grouped by repository). Call out:
Now switch between **all three** sessions in the sidebar (grouped by repository). Notice:

- Each session has its **own branch and worktree** — open two diffs side by side to prove the
isolation.
- You can give each a **different mode and model** (e.g. Autopilot + a fast model for the small
DELETE endpoint; Interactive for the subtler bug).
- Nothing blocks: Session A doesn't wait for Session B.

## A good narration
## The mental model

> "I'm not waiting on any one agent. The DELETE endpoint is well‑scoped, so I'll let it run on
> Autopilot. The `updatedAt` bug is subtler, so I'll keep that one Interactive and steer it. Both
> live in their own worktree, so neither can step on the other — or on the validation PR that's
> already in review."
Think of it this way: you're not waiting on any one agent. The DELETE endpoint is well‑scoped, so
you can let it run on Autopilot. The `updatedAt` bug is subtler, so keep that one Interactive and
steer it. Both live in their own worktree, so neither can step on the other — or on the validation
PR that's already in review.

## Cloud sessions (mention)
## Cloud sessions (good to know)

Sessions can also run in **cloud sandboxes** (public preview) — fully isolated Linux environments
hosted by GitHub. Great for offloading compute or picking work up from another device. More in
Expand Down
3 changes: 1 addition & 2 deletions docs/05-modes-and-models.md
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
# 05 · Modes, models & reasoning effort

**Time:** ~2 min on screen · **Goal:** give attendees a mental model for the knobs they'll reach
for in every session. This is a recap slide more than a demo.
**Goal:** build a mental model for the knobs you'll reach for in every session.

## Session modes — how much autonomy

Expand Down
7 changes: 3 additions & 4 deletions docs/06-advanced.md
Original file line number Diff line number Diff line change
@@ -1,8 +1,7 @@
# 06 · Advanced features — a guided tour

**Time:** ~3 min · **Goal:** show attendees the ceiling. Don't deep‑dive; point at each feature,
say what it's for, and move on. Pick **one** to demo live if time allows (canvases is the crowd
pleaser).
**Goal:** see the ceiling. Don't try to master each feature now — learn what each one is for, then
try **one** that interests you (canvases is a good first pick).

## Canvases — shared, interactive surfaces

Expand Down Expand Up @@ -67,4 +66,4 @@ concrete feedback, running on a **different model** than your main session. Invo
- **Agent skills** (`/`‑commands) to package repeatable workflows.
- **Voice dictation** to speak prompts instead of typing them.

➡️ Back to the [facilitator guide](facilitator-guide.md) · or the [cheat sheet](cheatsheet.md)
➡️ Back to the [walkthrough](walkthrough.md) · or the [cheat sheet](cheatsheet.md)
2 changes: 1 addition & 1 deletion docs/cheatsheet.md
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
# Cheat sheet — GitHub Copilot app

Project this during the session. One screen, the essentials.
Keep this open while you work. One screen, the essentials.

## The core loop

Expand Down
Loading
Loading