Skip to content

Commit cf2d391

Browse files
Add 'Get started with AI for Windows development' cluster
4 new pages in get-started/ covering GitHub Copilot for Windows dev: - ai-for-windows-devs.md: overview/inspiration, what's possible with Copilot + WinUI3 plugin + Learn MCP + winapp CLI - ai-setup.md: step-by-step setup for VS Code and Visual Studio, WinUI3 plugin install, Learn MCP server config, optional MCP servers - ai-build.md: tutorial building a WinUI3 notes app end-to-end with exact Copilot prompts, winapp CLI for notifications + packaging - ai-modernize.md: UWP->WinUI3 migration with migration guide skill, WPF/WinForms modernization, cross-platform (Electron/Flutter) + winapp CLI All pages reference existing agentic-tools.md and winapp-cli/index.md rather than duplicating their content. TOC: new 'Get started with AI' section added to hub/apps/toc.yml Co-authored-by: Copilot <[email protected]>
1 parent 35a0fdb commit cf2d391

5 files changed

Lines changed: 547 additions & 0 deletions

File tree

hub/apps/get-started/ai-build.md

Lines changed: 138 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,138 @@
1+
---
2+
title: "Tutorial: Build a Windows app with GitHub Copilot"
3+
description: A step-by-step tutorial for building a WinUI 3 Windows app using GitHub Copilot, the WinUI 3 plugin, and the Microsoft Learn MCP server.
4+
ms.topic: tutorial
5+
ms.date: 03/10/2026
6+
ms.author: jken
7+
author: GrantMeStrength
8+
keywords: windows, github copilot, winui, tutorial, agent mode, mcp server
9+
ms.localizationpriority: medium
10+
---
11+
12+
# Tutorial: Build a Windows app with GitHub Copilot
13+
14+
In this tutorial, you use GitHub Copilot in agent mode to build a complete WinUI 3 app — a simple **notes app** with a list of notes, the ability to add and delete entries, and a settings page. You'll see exactly which prompts to use at each step, and how the WinUI 3 plugin and Learn MCP Server keep Copilot accurate throughout.
15+
16+
> [!div class="checklist"]
17+
> * Scaffold a WinUI 3 project with Copilot
18+
> * Generate a XAML UI with Copilot
19+
> * Add business logic with Copilot
20+
> * Add a Windows notification using the Learn MCP Server
21+
> * Package the app with winapp CLI
22+
23+
## Prerequisites
24+
25+
- GitHub Copilot set up with the WinUI 3 plugin and Learn MCP Server — see [Set up GitHub Copilot for Windows development](ai-setup.md)
26+
- [Visual Studio 2022](/visualstudio/install/install-visual-studio) with the **WinUI application development** workload, or VS Code with the [C# Dev Kit](https://marketplace.visualstudio.com/items?itemName=ms-dotnettools.csdevkit)
27+
- [winapp CLI](../dev-tools/winapp-cli/index.md) installed (`winget install Microsoft.winappcli`)
28+
29+
---
30+
31+
## Part 1: Scaffold the project
32+
33+
### Create the WinUI project
34+
35+
Create a new WinUI 3 project using Visual Studio's **Blank App, Packaged (WinUI 3 in Desktop)** C# template, name it `NotesApp`, and open it.
36+
37+
### Open Copilot agent mode and scaffold the structure
38+
39+
Open Copilot Chat (`Ctrl+Alt+I` in VS Code, or the Copilot Chat panel in Visual Studio) and switch to **agent mode**. Then enter:
40+
41+
> *"I have a new blank WinUI 3 project called NotesApp. Set up an MVVM architecture with the following structure: a MainWindow with a NavigationView, three pages (Notes, Favorites, Settings), a ViewModels folder with a base ViewModel class and a NotesViewModel, and a Models folder with a Note model that has Id, Title, Content, and CreatedAt properties. Use CommunityToolkit.Mvvm."*
42+
43+
Copilot will create the folder structure, add the CommunityToolkit.Mvvm NuGet package reference, generate the base classes, and wire up the NavigationView. Review the output — if anything looks wrong, ask Copilot to correct it in the same chat session.
44+
45+
> [!TIP]
46+
> If Copilot generates `Windows.UI.Xaml` namespaces instead of `Microsoft.UI.Xaml`, the WinUI 3 plugin's custom instructions should catch this. If you see it, prompt: *"Fix any instances of Windows.UI.Xaml — this is a WinUI 3 project, so all XAML namespaces should use Microsoft.UI.Xaml."*
47+
48+
---
49+
50+
## Part 2: Build the UI
51+
52+
### Generate the Notes page
53+
54+
> *"Generate the XAML for the Notes page. It should have a ListView showing notes with Title and a truncated Content preview, a TextBox and Button at the bottom to add a new note, and a Delete button on each item. Bind it to the NotesViewModel. Use WinUI 3 controls and Fluent Design spacing."*
55+
56+
Copilot generates the XAML, bound to your ViewModel. Ask it to adjust styling or layout as needed — for example:
57+
58+
> *"Make the list items use a card style with a subtle shadow, similar to WinUI Gallery's card examples."*
59+
60+
### Generate the Settings page
61+
62+
> *"Generate a Settings page with a toggle for dark/light theme and a 'Clear all notes' button with a confirmation dialog. Use ContentDialog for the confirmation — not MessageDialog."*
63+
64+
The WinUI 3 plugin's instructions steer Copilot toward `ContentDialog` (the correct WinUI 3 approach) and away from the deprecated `MessageDialog`.
65+
66+
---
67+
68+
## Part 3: Add business logic
69+
70+
### Implement note persistence
71+
72+
> *"Implement note persistence in NotesViewModel using System.Text.Json to serialize and deserialize the notes collection to a file in ApplicationData.Current.LocalFolder. Load notes on startup and save whenever the collection changes."*
73+
74+
Copilot generates the load/save logic. Ask it to add error handling:
75+
76+
> *"Add try/catch around the file operations and log errors to the Debug output."*
77+
78+
### Implement theme switching
79+
80+
> *"Implement the theme toggle in SettingsViewModel. When the toggle changes, update the RequestedTheme on the application's main window using the correct WinUI 3 approach."*
81+
82+
---
83+
84+
## Part 4: Add a Windows notification
85+
86+
Package identity is required for Windows notifications. First, set it up with winapp CLI:
87+
88+
```bash
89+
winapp create-debug-identity --publisher "CN=NotesApp"
90+
```
91+
92+
Now ask Copilot to add a notification that fires when a note is saved:
93+
94+
> *"Add a Windows app notification that shows 'Note saved' with the note title as a subtitle when a note is successfully persisted to disk. Use the Windows App SDK AppNotificationManager."*
95+
96+
With the Learn MCP Server connected, Copilot can look up the current `AppNotificationBuilder` API and generate correct notification code. It should produce something like:
97+
98+
```csharp
99+
var notification = new AppNotificationBuilder()
100+
.AddText("Note saved")
101+
.AddText(note.Title)
102+
.BuildNotification();
103+
AppNotificationManager.Default.Show(notification);
104+
```
105+
106+
---
107+
108+
## Part 5: Package the app
109+
110+
When you're ready to distribute or publish to the Microsoft Store, build a proper MSIX package:
111+
112+
```bash
113+
winapp pack --output ./publish
114+
```
115+
116+
This generates a signed MSIX package ready for sideloading or Store submission. Ask Copilot for help updating the package manifest:
117+
118+
> *"Show me how to update the Package.appxmanifest to set the display name, description, and publisher for Store submission."*
119+
120+
---
121+
122+
## Summary
123+
124+
You've built a complete WinUI 3 notes app using:
125+
126+
- **Copilot agent mode** for scaffolding, UI generation, and business logic
127+
- **WinUI 3 plugin** to keep Copilot on modern, correct APIs throughout
128+
- **Learn MCP Server** to look up Windows App SDK notification APIs
129+
- **winapp CLI** for package identity and MSIX packaging
130+
131+
## Next steps
132+
133+
> [!div class="nextstepaction"]
134+
> [Modernize or port a Windows app with Copilot](ai-modernize.md)
135+
136+
- [Agentic AI tools for Windows development](../dev-tools/agentic-tools.md)
137+
- [Windows App Development CLI (winapp CLI)](../dev-tools/winapp-cli/index.md)
138+
- [Windows App SDK documentation](../windows-app-sdk/index.md)
Lines changed: 95 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,95 @@
1+
---
2+
title: AI-assisted Windows development
3+
description: Discover how GitHub Copilot, MCP servers, and Windows-specific AI tools make it faster and easier to build and modernize Windows apps.
4+
ms.topic: overview
5+
ms.date: 03/10/2026
6+
ms.author: jken
7+
author: GrantMeStrength
8+
keywords: windows, github copilot, ai development, winui, copilot, mcp server
9+
ms.localizationpriority: medium
10+
---
11+
12+
# AI-assisted Windows development
13+
14+
GitHub Copilot and a growing set of Windows-specific AI tools have changed what it means to build for Windows. Whether you're starting a brand-new WinUI app, integrating Windows AI APIs, or migrating a legacy UWP project, AI can handle the scaffolding, suggest the right APIs, explain unfamiliar patterns, and keep your code on the right track — all without leaving your IDE.
15+
16+
This article introduces the tools and what they make possible. When you're ready, follow the links to set up your environment and start building.
17+
18+
## What AI tools are available for Windows developers?
19+
20+
### GitHub Copilot
21+
22+
[GitHub Copilot](https://github.com/features/copilot) is an AI coding assistant built into Visual Studio and VS Code. It provides inline completions as you type, a chat panel for asking questions and generating code, and an **agent mode** that can autonomously complete multi-step tasks — creating files, running commands, and iterating until the task is done.
23+
24+
For Windows developers, the key is giving Copilot accurate Windows-specific knowledge. Out of the box, Copilot knows a lot about general C# and .NET — but it can struggle with WinUI 3 specifics, confusing newer APIs with deprecated UWP equivalents. The tools below fix that.
25+
26+
### WinUI 3 development plugin
27+
28+
The [WinUI 3 development plugin](../dev-tools/agentic-tools.md#winui-3-development-plugin-for-github-copilot) for GitHub Copilot teaches Copilot the right modern Windows App SDK patterns. It includes:
29+
30+
- A **WinUI 3 Expert agent** that knows current API namespaces, XAML controls, MVVM patterns, and app lifecycle
31+
- A **migration guide skill** (`/winui3-development:winui3-migration-guide`) that maps UWP APIs to their WinUI 3 equivalents with before/after code samples
32+
- **Custom instructions** applied to your XAML and C# files that prevent the most common mistakes, like using `CoreDispatcher` instead of `DispatcherQueue`
33+
34+
### Microsoft Learn MCP Server
35+
36+
The [Microsoft Learn MCP Server](../dev-tools/agentic-tools.md#microsoft-learn-mcp-server) gives Copilot live access to official Microsoft documentation. Instead of relying on training data that may be out of date, Copilot can look up the latest API references, code samples, and release notes as it helps you code.
37+
38+
Add one endpoint to your IDE config and Copilot can answer questions like *"What's the WinUI 3 API for showing a file picker?"* with accurate, current answers.
39+
40+
### Windows App Development CLI (winapp CLI)
41+
42+
The [winapp CLI](../dev-tools/winapp-cli/index.md) is a command-line tool that adds Windows packaging, app identity, and SDK setup to any project — WinUI, .NET, Electron, Flutter, Rust, and more. Package identity is what unlocks powerful Windows features:
43+
44+
- On-device AI APIs (Phi Silica, text recognition, image generation)
45+
- Interactive notifications and Windows shell integration
46+
- MSIX packaging for the Microsoft Store or enterprise deployment
47+
48+
Copilot can help you understand the manifest, adapt your code for Windows APIs, and work through the packaging steps — while winapp CLI does the plumbing.
49+
50+
---
51+
52+
## What can you do with these tools?
53+
54+
Here are some real things you can accomplish:
55+
56+
### Start a new Windows app in minutes
57+
58+
> *"Create a WinUI 3 app with a NavigationView, three pages, and an MVVM architecture. Use the Windows App SDK."*
59+
60+
With the WinUI 3 plugin installed and the Learn MCP server connected, Copilot generates a complete, modern scaffold — correct namespaces, proper threading patterns, no legacy UWP confusion.
61+
62+
### Add Windows features to any app
63+
64+
> *"Add a Windows notification that fires when a background task completes. My app is packaged with MSIX."*
65+
66+
Copilot can look up the right `AppNotification` APIs via the Learn MCP server and generate working notification code, while winapp CLI handles the identity and manifest setup that makes notifications available to your app.
67+
68+
### Migrate a UWP app to WinUI 3
69+
70+
> `/winui3-development:winui3-migration-guide`
71+
72+
Run the migration guide skill against your existing UWP files and Copilot produces a step-by-step migration plan with API substitutions, XAML changes, and packaging updates tailored to your specific codebase.
73+
74+
### Modernize a WPF or WinForms app
75+
76+
> *"I have a WPF app targeting .NET 4.8. Show me how to add push notifications using the Windows App SDK."*
77+
78+
With the Learn MCP server, Copilot finds the right Windows App SDK documentation and generates the notification code — without you needing to dig through docs manually.
79+
80+
### Add Windows to a cross-platform app
81+
82+
Electron, Flutter, React Native, and Rust developers can use Copilot to adapt their existing code for Windows-specific features, and use winapp CLI to add MSIX packaging and package identity — turning a cross-platform app into a first-class Windows citizen.
83+
84+
---
85+
86+
## Next steps
87+
88+
> [!div class="nextstepaction"]
89+
> [Set up GitHub Copilot for Windows development](ai-setup.md)
90+
91+
Or jump straight to:
92+
93+
- [Tutorial: Build a Windows app with GitHub Copilot](ai-build.md)
94+
- [Modernize or port a Windows app with Copilot](ai-modernize.md)
95+
- [Agentic AI tools for Windows development](../dev-tools/agentic-tools.md)

0 commit comments

Comments
 (0)