Erstellen Ihrer ersten App mit C#
Starten Sie die Entwicklung von Microsoft Teams-Apps, indem Sie Ihre erste App mit einer Registerkarte, einem Bot und einer Nachrichtenerweiterungsfunktion erstellen.
Diese App verfügt über alle Funktionen und jede verfügt über eine eigene Benutzeroberfläche und Benutzeroberfläche:
In diesem Tutorial erfahren Sie Folgendes:
- So richten Sie ein neues Projekt ein.
- Erstellen von Apps mit Registerkartenfunktion mit C# und Visual Studio.
Voraussetzungen
Hier finden Sie eine Liste der Tools, die Sie zum Erstellen und Bereitstellen einer Teams-App installieren müssen.
| Installieren | Zum Benutzen... | |
|---|---|---|
| Required | ||
| Visual Studio 2022, Version 17.3 Installieren Sie die ASP.NET- und Webentwicklungsworkload . |
Sie können die Unternehmensversion in Visual Studio 2022 und die Workloads installieren. | |
| Teams Toolkit | Eine Visual Studio-Erweiterung, die ein Projektgerüst für Ihre App erstellt. Verwenden Sie die neueste Version. | |
| Microsoft Teams | Microsoft Teams für die Zusammenarbeit mit allen, mit denen Sie zusammenarbeiten, über Apps für Chats, Besprechungen und Anrufe – alles an einem Ort. |
Installieren des Teams-Toolkits
Teams Toolkit vereinfacht den Entwicklungsprozess mit Tools zum Erstellen eines Projektgerüsts für Ihre App. Es erstellt die erforderliche Verzeichnisstruktur für alle ausgewählten Funktionen mit den erforderlichen Dateien, die zum Erstellen des Projekts bereit sind.
Das Teams-Toolkit ist als Erweiterung in Visual Studio verfügbar.
Sie können das neueste Visual Studio-Installationsprogramm von der Visual Studio-Downloadseite herunterladen.
Hinweis
Sie müssen zuerst das Visual Studio-Installationsprogramm installieren, bevor Sie Visual Studio installieren.
Nachdem Sie das Visual Studio-Installationsprogramm geöffnet haben, klicken Sie im Popupfenster für Workloads.
Aktivieren Sie das Kontrollkästchen ASP.NET- und Webentwicklungsworkloads .
Wählen Sie im Bereich mit den Installationsdetails das Kontrollkästchen Microsoft Teams-Entwicklungstools aus.
Wählen Sie Installieren aus.
Wählen Sie Starten aus, um Visual Studio zu öffnen.
Wichtig
Es wird empfohlen, Visual Studio 2022 17.3.0-Version herunterzuladen, da Teams Toolkit für Visual Studio in dieser Version allgemein verfügbar ist. Dieser Artikel wurde für Visual Studio 2022 17.3.0-Version geschrieben. Teams Toolkit Version 17.3.* oder höher.
Wählen Sie Erweiterungen>Erweiterungen verwalten aus.
Das folgende Fenster Erweiterung verwalten wird angezeigt:
Wählen Sie Installiert aus, um die Teams Toolkit-Erweiterung installiert zu sehen.
Einrichten Ihres Teams-Entwicklungsmandanten
Ein Mandant ist wie ein Raum oder ein Container für Ihre organization in Teams, in dem Sie chatten, Dateien freigeben und Besprechungen ausführen. Dieser Bereich ist auch der Ort, an dem Sie Ihre App querladen und testen. Lassen Sie uns überprüfen, ob Sie bereit sind, mit dem Mandanten zu entwickeln.
Option "Auf Querladen überprüfen"
Nachdem Sie die App erstellt haben, müssen Sie ihre App in Teams laden, ohne sie zu verteilen. Dieser Vorgang wird als Querladen bezeichnet. Melden Sie sich bei Ihrem Microsoft 365-Konto an, um diese Option anzuzeigen.
Hinweis
Das Querladen ist für die Vorschau und das Testen von Apps in der lokalen Teams-Umgebung erforderlich. Wenn sie nicht aktiviert ist, können Sie Ihre App in Teams nicht lokal in der Vorschau anzeigen und testen.
Verfügen Sie bereits über einen Mandanten und über Administratorzugriff? Lassen Sie uns überprüfen, ob Sie dies wirklich tun!
Überprüfen Sie, ob Sie Apps in Teams querladen können:
Wählen Sie im Teams-Client das Symbol Store aus.
Wählen Sie Verwalten Ihrer Apps aus.
Suchen Sie nach der Option Hochladen einer benutzerdefinierten App. Wenn die Option angezeigt wird, ist das Querladen von Apps aktiviert.
Hinweis
Wenn Teams die Option zum Hochladen einer benutzerdefinierten App nicht zeigt, wenden Sie sich an Ihren Teams-Administrator.
Erstellen eines kostenlosen Teams-Entwicklermandanten (optional)
Wenn Sie kein Teams-Konto haben, können Sie es kostenlos erhalten. Nehmen Sie am Microsoft 365-Entwicklerprogramm teil!
Gehen Sie zu Microsoft 365-Entwicklerprogramm.
Wählen Sie Jetzt beitreten aus, und folgen Sie den Anweisungen auf dem Bildschirm.
Wählen Sie auf der Willkommensseite E5-Abonnement einrichten aus.
Einrichten Ihres Administratorkontos. Nachdem Sie fertig sind, wird der folgende Bildschirm angezeigt:
Melden Sie sich bei Teams mit dem Administratorkonto an, das Sie gerade eingerichtet haben. Vergewissern Sie sich, dass Sie über die Option Benutzerdefinierte App hochladen in Teams verfügen.
Abrufen eines kostenlosen Azure-Kontos
Wenn Sie Ihre App hosten oder auf Ressourcen in Azure zugreifen möchten, benötigen Sie ein Azure-Abonnement. Erstellen Sie ein kostenloses Konto, bevor Sie beginnen.
Jetzt verfügen Sie über alle Tools und richten Ihr Konto ein. Richten Sie als Nächstes Ihre Entwicklungsumgebung ein, und beginnen Sie mit dem Erstellen! Wählen Sie die App aus, die Sie zuerst ausführen möchten.
Erstellen eines Projektarbeitsbereichs für Ihre Registerkarten-App mit C#
Starten Sie die Entwicklung von Microsoft Teams-Apps, indem Sie Ihre erste App erstellen. Diese App verwendet die Registerkartenfunktion.
Wenn die Voraussetzungen erfüllt sind, fangen wir an!
Die folgenden Schritte helfen Ihnen beim Erstellen eines Projektarbeitsbereichs für Ihre Registerkarten-App in Visual Studio
Öffnen Sie Visual Studio.
Die folgende Seite wird angezeigt:
Wählen Sie Neues Projekt erstellen aus.
Geben Sie Teams in das Suchfeld ein.
Wählen Sie Microsoft Teams-App und dann Weiter aus.
Die Seite "Neues Projekt konfigurieren" wird angezeigt.
Geben Sie die folgenden Details ein, um Ihr neues Projekt zu konfigurieren.
- Geben Sie den erforderlichen Projektnamen in Projektname ein.
- Wählen Sie den erforderlichen Speicherort zum Speichern von Projektdateien und -ordnern aus.
- Wählen Sie Erstellen aus.
Im Fenster "Neue Teams-Anwendung erstellen" wird Folgendes angezeigt:
Wählen Sie Tab und dann Erstellen aus.
Jetzt wird die Teams-Registerkarten-App in wenigen Sekunden erstellt.
Machen Sie sich einen Überblick über den Quellcode der Tab-App
Das Teams-Toolkit bietet alle Komponenten zum Erstellen einer App. Nach dem Erstellen des Projekts können Sie die Projektordner und -dateien unter Projektmappen-Explorer anzeigen.
:::image type="content" source="~/toolkit/toolkit-v4/sbs-v4/images-sbs/sbs-gs-csharp/solution explorer-v4.png" alt-text="solution explorer"::::::
Obwohl Sie ein beliebiges Benutzeroberflächenframework auswählen können (oder keins verwenden möchten), bietet dieser Beispielvorlagencode ein Gerüst mit React Komponenten.
Das Toolkit verwaltet unter anderem folgende Elemente in dieser Verzeichnisstruktur:
| Ordnername | Inhalt |
|---|---|
.fx/configs |
Konfigurationsdateien, die der Benutzer für die Teams-App anpassen kann. |
- .fx/configs/config.<envName>.json |
Konfigurationsdatei für jede Umgebung. |
- .fx/configs/azure.parameters.<envName>.json |
Parameterdatei für die Azure BICEP-Bereitstellung für jede Umgebung. |
- .fx/configs/projectSettings.json |
Globale Projekteinstellungen, die für alle Umgebungen gelten. |
- .fx/states |
Bereitstellen einer Ausgabe, die vom Teams-Toolkit generiert wird. Das Toolkit erstellt diesen Ordner, nachdem Sie Ressourcen für Ihre App bereitgestellt haben. |
- .fx/states/state.<envName>.json |
Stellen Sie die Ausgabedatei für jede Umgebung bereit. |
- .fx/states/<env>.userdata |
Vertrauliche Benutzerdaten für die Bereitstellungsausgabe für jede Umgebung. |
templates/appPackage |
App-Manifestvorlagendateien und die App-Symbole: color.png und outline.png. |
- templates/appPackage/manifest.template.json |
App-Manifest zum Ausführen der App in einer lokalen oder Remoteumgebung. |
templates/azure |
BICEP-Vorlagendateien |
Erstellen und Ausführen Ihrer ersten Registerkarten-App mit C#
Nachdem Sie Ihren Projektarbeitsbereich mit Teams Toolkit eingerichtet haben, erstellen Sie Ihre Registerkarten-App. Sie müssen sich bei Ihrem Microsoft 365-Konto anmelden.
Anmelden bei Ihrem Microsoft 365-Konto
Verwenden Sie Ihr Microsoft 365-Konto, um sich bei Teams anzumelden. Wenn Sie einen Microsoft 365-Entwicklerprogrammmandanten verwenden, ist das Administratorkonto, das Sie bei der Registrierung eingerichtet haben, Ihr Microsoft 365-Konto.
Klicken Sie mit der rechten Maustaste auf Mytabapp unter Projektmappe Mytabapp.
Wählen Sie Teams ToolkitPrepare Teams App Dependencies (Teams-Toolkit: Teams-App-Abhängigkeiten vorbereiten) aus.>
Wählen Sie Microsoft 365-Konto und dann Weiter aus.
Lokales Erstellen und Ausführen Ihrer App in Visual Studio
So erstellen Sie Ihre App und führen sie lokal aus:
Wählen Sie in Visual Studio F5 oder Debuggen>Debuggen Debuggen starten aus, um die Anwendung im Debugmodus auszuführen.
Der Teams-Webclient wird in einem Browserfenster geöffnet.
Melden Sie sich mit Ihrem Microsoft 365-Konto an, wenn Sie dazu aufgefordert werden.
Wählen Sie Hinzufügen aus, wenn Sie aufgefordert werden, die App auf Teams auf Ihrem lokalen Computer querzuladen.
Herzlichen Glückwunsch, Ihre erste Registerkarten-App wird in Teams ausgeführt!
Erfahren Sie, wie Sie Probleme beheben, wenn Ihre App nicht lokal ausgeführt wird.
Um Ihre App in Teams erfolgreich auszuführen, stellen Sie sicher, dass Sie das Querladen in Ihrem Teams-Konto aktiviert haben. Weitere Informationen zum Querladen finden Sie im Abschnitt Voraussetzungen.
Herzlichen Glückwunsch!
Sie haben es geschafft!
Sie haben eine Registerkarten-App erstellt.
Nachdem Sie nun gelernt haben, eine einfache App zu erstellen.
Das ist alles. Das Teams-Toolkit fügt der Verzeichnisstruktur Ihrer App das Gerüst für die neue Funktion hinzu.
Sie haben das Tutorial zum Erstellen einer Registerkarten-App mit C# abgeschlossen.
Liegt ein Problem mit diesem Abschnitt vor? Wenn ja, senden Sie uns Feedback, damit wir den Abschnitt verbessern können.
Feedback
Feedback senden und anzeigen für