Quickstart: Een Windows-app bouwen en publiceren met AI

In deze quickstart gaat u van een lege map naar een gepubliceerde Windows-app met behulp van AI-hulp overal. Er is geen Visual Studio vereist.

Note

Werkt u liever in Visual Studio? Zie GitHub Copilot instellen voor Windows-ontwikkeling. In deze quickstart worden VS Code en de winapp CLI gebruikt.

  • Installeer de vereiste hulpprogramma's (~5 minuten)
  • Een WinUI-app genereren vanaf de opdrachtregel
  • winui-dev De AI-agent gebruiken om functies toe te voegen
  • Verpakken en publiceren naar de Microsoft Store

Tijd om te voltooien: ongeveer 30 minuten
Kosten: gratis (het gratis abonnement van GitHub Copilot is voldoende)

Prerequisites

Installeer de volgende hulpprogramma's voordat u begint. Ze zijn allemaal gratis.

1. Visual Studio Code

winget install Microsoft.VisualStudioCode

2. .NET SDK 10 of hoger

winget install Microsoft.DotNet.SDK.10

3. Windows-app Development CLI (winapp CLI)

winget install Microsoft.winappcli --source winget

4. WinUI dotnet nieuwe sjablonen

dotnet new install Microsoft.WindowsAppSDK.WinUI.CSharp.Templates

5. GitHub CLI (vereist voor commando's van gh copilot — vereist een GitHub Copilot-abonnement, gratis versie beschikbaar)

winget install GitHub.cli

Important

Sluit de terminal en open deze opnieuw nadat de installatie is voltooid. De gh opdracht is pas beschikbaar nadat een nieuwe shellsessie het bijgewerkte PATH heeft opgehaald.

gh auth login
gh extension install github/gh-copilot

6. WinUI-agentinvoegtoepassing voor GitHub Copilot

gh copilot plugin install winui@awesome-copilot

7. WinApp-extensie voor VS Code

code --install-extension microsoft-winappcli.winapp

Of zoek WinApp in het deelvenster Extensies (Ctrl+Shift+X). Zie VS Code-hulpprogramma's voor een volledige opdrachtreferentie.

Uw installatie controleren

winapp --version

Tip

Voor de beste resultaten verbindt u uw AI-agent ook met de Microsoft Learn MCP-server. Hiermee worden huidige WinUI 3 API-documenten opgehaald op het moment van query's in plaats van te vertrouwen op trainingsgegevens.

Stap 1: Een nieuwe WinUI-app maken

Maak een nieuwe map en genereer een WinUI-app met een NavigationView-indeling:

mkdir MyFirstApp
cd MyFirstApp
dotnet new winui-navview

Stap 2: de app uitvoeren

Bouw en voer de app uit om te bevestigen dat alles werkt voordat u functies toevoegt:

dotnet run

De app start als een pakket met losse indeling — zonder dat een MSIX-installatie nodig is. U ziet nu een WinUI 3-app met een navigatieweergave met de pagina's Start, Info en Instellingen:

Schermopname van MyFirstApp die wordt uitgevoerd: een WinUI 3-venster met een Navigatieweergave met de items Start, Info en Instellingen, met de startpagina geselecteerd met de optie 'Dit is de startpagina'.

Nadat het project is gestart, opent u het project in VS Code:

code .

Note

Druk niet op F5 vóór de eerste succesvolle dotnet run. De debugger van VS Code zoekt naar een .exe die nog niet bestaat. Nadat dotnet run dit is gelukt, werken F5 en de knop Uitvoeren in het WinApp-extensievenster beide normaal.

Stap 3: De AI-agent gebruiken om een functie toe te voegen

Open in VS Code GitHub Copilot Chat (Ctrl+Alt+I), schakel over naar Agentmodus en selecteer de winui-dev-agent. Typ een aanvraag, zoals:

Add a settings page to my WinUI NavigationView app with a toggle for dark mode

De agent genereert de code, maakt alle vereiste bestanden en werkt uw navigatiestructuur bij. Controleer de wijzigingen en controleer het resultaat:

dotnet run

Ga naar de pagina Instellingen in de actieve app om te bevestigen dat de functie correct is toegevoegd.

Tip

Wilt u verificatie van de gebruikersinterface automatiseren? Zie WinUI-apps testen voor winapp ui opdrachten die de UI-structuur van uw app inspecteren, doorzoeken en schermafbeeldingen, handig voor CI-pijplijnen.

Stap 4: De app verpakken

Publiceer uw app naar een map en verpakt deze vervolgens als een MSIX-installatieprogramma.

Important

De packageerstap installeert een certificaat in het vertrouwde basiscertificaatarchief van uw machine en vereist een terminal met verhoogde rechten (Administrator). Klik met de rechtermuisknop op PowerShell of Windows Terminal en selecteer Run as administrator en navigeer vervolgens terug naar de projectmap.

dotnet publish -o ./publish
winapp pack ./publish --generate-cert --install-cert

--generate-cert --install-cert maakt en installeert een lokaal ontwikkelingscertificaat voor testen. Gebruik voor een inzending bij de Store in plaats daarvan uw Partner Center-certificaat.

Stap 5: Publiceren naar het Microsoft Store

Verzend uw app rechtstreeks vanaf de opdrachtregel:

winapp store publish ./*.msix --appId <your-app-id>

Note

Voor publiceren is een PartnerCentrum-account vereist. App-certificering duurt doorgaans 1-3 werkdagen.

Volgende stappen 

U hebt een Windows-app gemaakt en gepubliceerd met behulp van alleen gratis hulpprogramma's en AI-hulp. Hier is waar je vervolgens naartoe moet gaan:

  • Last updated on