Créer votre première application à l’aide de C #
Démarrez le développement d’applications Microsoft Teams en créant votre première application avec un onglet, un bot et une fonctionnalité d’extension de message.
Cette application a toutes les fonctionnalités et chacune a sa propre interface utilisateur et expérience utilisateur :
Dans ce tutoriel, vous allez apprendre à :
- Comment configurer un nouveau projet.
- Comment créer des applications avec la fonctionnalité d’onglet à l’aide de C# et de Visual Studio.
Configuration requise
Voici une liste des outils que vous devez installer pour créer et déployer une application Teams.
| Installer | Pour l’utilisation... | |
|---|---|---|
| Obligatoire | ||
| Visual Studio 2022 version 17.3 Installez l’une des deux charges de travail suivantes : • développement ASP.NET et web • Développement multiplateforme .NET Core |
Vous pouvez installer la version entreprise dans Visual Studio 2022 et installer les charges de travail. | |
| Toolkit Teams | Extension Visual Studio qui crée une structure de projet pour votre application. Utilisez la dernière version. | |
| Microsoft Teams | Microsoft Teams pour collaborer avec toutes les personnes avec lesquelles vous travaillez via les applications pour les conversations, les réunions, les appels, le tout au même endroit. |
Installer teams Toolkit
Teams Toolkit permet de simplifier le processus de développement avec des outils permettant de créer une structure de projet pour votre application. Il crée la structure de répertoires nécessaire pour toutes les fonctionnalités sélectionnées avec les fichiers requis en place, prêts à générer le projet.
Teams Toolkit est disponible en tant qu’extension dans Visual Studio.
Vous pouvez télécharger le dernier programme d’installation de Visual Studio à partir de la page de téléchargement de Visual Studio.
Remarque
Vous devez d’abord installer le programme d’installation de Visual Studio avant d’installer Visual Studio.
Après avoir ouvert le programme d’installation de Visual Studio, dans la fenêtre contextuelle des charges de travail.
Cochez la case ASP.NET charge de travail développement web .
Cochez la case Outils de développement Microsoft Teams dans le panneau détails de l’installation.
Sélectionnez Installer.
Sélectionnez Lancer pour ouvrir Visual Studio.
Importante
Il est recommandé de télécharger Visual Studio 2022 version 17.3.0, car Teams Toolkit pour Visual Studio est en disponibilité générale dans cette version. Cet article est écrit pour Visual Studio 2022 version 17.3.0. Teams Toolkit version 17.3.* ou ultérieure.
Sélectionnez Extensions>Gérer les extensions.
La fenêtre Gérer l’extension suivante s’affiche :
Sélectionnez Installé et vous pouvez voir l’extension Teams Toolkit installée.
Configurer votre locataire de développement Teams
Un locataire est comme un espace ou un conteneur pour votre organisation dans Teams, où vous discutez, partagez des fichiers et exécutez des réunions. Cet espace est également l’endroit où vous chargez et testez votre application. Vérifions si vous êtes prêt à développer avec le locataire.
Rechercher l’option de chargement indépendant
Après avoir créé l’application, vous devez charger votre application dans Teams sans la distribuer. Ce processus est appelé chargement indépendant. Connectez-vous à votre compte Microsoft 365 pour afficher cette option.
Remarque
Le chargement indépendant est nécessaire pour l’aperçu et le test des applications dans l’environnement local Teams. S’il n’est pas activé, vous ne pourrez pas afficher un aperçu et tester votre application dans Teams localement.
Avez-vous déjà un locataire et disposez-vous de l’accès administrateur ? Vérifions si vous le faites vraiment !
Vérifiez si vous pouvez charger une version test des applications dans Teams :
Dans le client Teams, sélectionnez Icône Store .
Sélectionnez Gérer vos applications.
Recherchez l’option Charger une application personnalisée. Si vous voyez l’option , le chargement indépendant des applications est activé.
Remarque
Si Teams n’affiche pas l’option de chargement d’une application personnalisée, parlez-en à votre administrateur Teams.
Créer un locataire développeur Teams gratuit (facultatif)
Si vous n’avez pas de compte Teams, vous pouvez l’obtenir gratuitement. Rejoignez le programme des développeurs Microsoft 365 !
Sélectionnez Rejoindre maintenant et suivez les instructions à l’écran.
Dans l’écran d’accueil, sélectionnez Configurer l’abonnement E5.
Configurez votre compte d’administrateur. Une fois que vous avez terminé, l’écran suivant s’affiche :
Connectez-vous à Teams à l’aide du compte d’administrateur que vous venez de configurer. Vérifiez que vous disposez de l’option Charger une application personnalisée dans Teams.
Obtenir un compte Azure gratuit
Si vous souhaitez héberger votre application ou accéder aux ressources dans Azure, vous devez disposer d’un abonnement Azure. Créez un compte gratuit avant de commencer.
Vous avez maintenant tous les outils et configuré votre compte. Ensuite, nous allons configurer votre environnement de développement et commencer à créer ! Sélectionnez l’application que vous souhaitez d’abord faire
Créer un espace de travail de projet pour votre application d’onglet à l’aide de C #
Démarrez le développement d’applications Microsoft Teams en créant votre première application. Cette application utilise la fonctionnalité d’onglet.
Si les conditions préalables sont en place, commençons !
Les étapes suivantes vous aident à créer un espace de travail de projet pour votre application d’onglet dans Visual Studio
Ouvrez Visual Studio.
La page suivante s’affiche :
Sélectionnez Créer un projet.
Entrez Teams dans la zone de recherche.
Sélectionnez Application Microsoft Teams , puis Suivant.
La page Configurer votre nouveau projet s’affiche.
Entrez les informations suivantes pour configurer votre nouveau projet.
- Entrez le nom de projet requis dans Nom du projet.
- Sélectionnez l’emplacement requis pour enregistrer les fichiers et dossiers du projet.
- Sélectionnez Créer.
La fenêtre Créer une application Teams s’affiche :
Sélectionnez Tab , puis Créer.
Maintenant, l’application d’onglet Teams est créée en quelques secondes.
Découvrez le code source de l’application d’onglet
Teams Toolkit fournit tous les composants pour la création d’une application. Après avoir créé le projet, vous pouvez afficher les dossiers et fichiers du projet sous Explorateur de solutions.
Bien que vous soyez libre de choisir une infrastructure d’interface utilisateur (ou de ne pas en utiliser), cet exemple de code de modèle fournit une structure avec React composants.
Parmi les autres éléments de cette structure de répertoires, le Kit de ressources gère les éléments suivants :
| Nom du dossier | Sommaire |
|---|---|
.fx/configs |
Fichiers de configuration que l’utilisateur peut personnaliser pour l’application Teams. |
- .fx/configs/config.<envName>.json |
Fichier de configuration pour chaque environnement. |
- .fx/configs/azure.parameters.<envName>.json |
Fichier de paramètres pour le provisionnement d’Azure BICEP pour chaque environnement. |
- .fx/configs/projectSettings.json |
Paramètres de projet globaux qui s’appliquent à tous les environnements. |
- .fx/states |
Approvisionner la sortie générée par teams Toolkit. Le kit de ressources crée ce dossier après avoir approvisionné des ressources pour votre application. |
- .fx/states/state.<envName>.json |
Provisionnez le fichier de sortie pour chaque environnement. |
- .fx/states/<env>.userdata |
Données utilisateur sensibles pour la sortie de provisionnement pour chaque environnement. |
templates/appPackage |
Fichiers de modèle de manifeste d’application et icônes d’application : color.png et outline.png. |
- templates/appPackage/manifest.template.json |
Manifeste d’application pour l’exécution de l’application dans un environnement local ou distant. |
templates/azure |
Fichiers de modèle BICEP |
Générer et exécuter votre première application d’onglet à l’aide de C #
Après avoir configuré votre espace de travail de projet avec Teams Toolkit, générez votre application d’onglet. Vous devez vous connecter à votre compte Microsoft 365.
Connectez-vous à votre compte Microsoft 365
Utilisez votre compte Microsoft 365 pour vous connecter à Teams. Si vous utilisez un locataire du programme de développement Microsoft 365, le compte d’administrateur que vous avez configuré lors de l’inscription est votre compte Microsoft 365.
Cliquez avec le bouton droit sur Mytabapp sous Solution Mytabapp.
Sélectionnez Teams Toolkit>Préparer les dépendances de l’application Teams.
Sélectionnez Compte Microsoft 365 , puis sélectionnez Continuer.
Générer et exécuter votre application localement dans Visual Studio
Pour créer et exécuter votre application localement :
Dans Visual Studio, sélectionnez F5 ou Déboguer>Démarrer le débogage pour exécuter l’application en mode débogage.
Le client web Teams s’ouvre dans une fenêtre de navigateur.
Connectez-vous avec votre compte Microsoft 365, si vous y êtes invité.
Sélectionnez Ajouter lorsque vous êtes invité à charger une version test de l’application sur Teams sur votre ordinateur local.
Félicitations, votre première application d’onglet s’exécute sur Teams !
Découvrez comment résoudre les problèmes si votre application ne s’exécute pas localement.
Pour exécuter correctement votre application dans Teams, vérifiez que vous avez activé le chargement indépendant dans votre compte Teams. Pour en savoir plus sur le chargement indépendant, consultez la section Conditions préalables.
Félicitations !
Tu l’as fait!
Vous avez créé une application d’onglet.
Maintenant que vous avez appris à créer une application de base.
Voilà ! Teams Toolkit ajoute la structure de la nouvelle fonctionnalité à la structure de répertoires de votre application.
Vous avez terminé le tutoriel pour créer une application d’onglet à l’aide de C#.
Vous avez un défi avec cette section ? Si c'est le cas, faites-nous part de vos commentaires pour que nous puissions l'améliorer.
Commentaires
Envoyer et afficher des commentaires pour