Debugging With Copilot

A practical workshop on debugging strategies and techniques with GitHub Copilot — from fixing linter errors to tracing full-stack bugs across a real three-tier application.

Pre-Requisites:

GitHub Copilot enabled on your account — check GitHub settings
Latest version of VS Code — required for many newer Copilot features
The GitHub Copilot extension installed in VS Code
Docker installed and running — the demo app runs inside a dev container
Copilot Chat working — open a project, open the chat window, and try: "What files are in this project?"

Duration: ~2 hours

1 Workshop Sections
2 Wrapping Up

https://docs.google.com/presentation/d/1BEojyKqfiNJx9vy2iL9W70JiSV22VMsJwiHX0z2WikY/edit?usp=sharing

Welcome to Debugging With Copilot. This workshop takes about two hours to go through, and it's designed so you can follow along in a live session or work through it on your own at your own pace. There are hands-on exercises in every section so you can practice as you go.

The demo app is Carton Case Management — a customer support application with cases, support agents, and customers. It's a real-world, complex app with a three-tier architecture

Browser (frontend)
Backend server
SQLite database.

It also includes both unit tests and end-to-end tests using Playwright, which makes it a great environment for practicing debugging at every layer.

Here's what we're going to cover:

Terminal: How Copilot runs and manages terminal commands, reads output, and integrates with your dev environment
Debugging Loops: Pairing Copilot's intelligence with deterministic tools like linters and test runners to fix bugs systematically
End-to-End Flows: Tracing a full-stack bug using the integrated Playwright browser, structured logging, and multi-environment output
Databases: Using an MCP server to query, visualize, and fix data problems directly from chat

The goal isn't just to learn a few tricks — it's to internalize a repeatable debugging workflow that you can bring back to your own codebase. Once you've got the pattern down, it applies everywhere.

Alright, let's get into it.

Workshop Sections

Work through each section in order and complete the exercises as you go! Each section coorisponds to a different branch in the Carton Case Management repository

Wrapping Up

That's a wrap on Debugging with GitHub Copilot! Here's a quick recap of everything we covered:

How Copilot manages terminals — running commands, reading output, and handling long-running processes
The core debug loop: run a deterministic tool → read output → fix → verify → repeat
Using skills to teach Copilot your project's commands and conventions
Tracing a full-stack bug across the frontend, backend, and database using Playwright and structured logging
Writing a regression test so the bug can never silently come back
Querying and fixing database problems using an MCP server and plain English

The mental model here — pairing AI intelligence with deterministic, reliable tools — applies to any codebase and any debugging scenario you'll run into.

Thanks for following along!