Exercice – Démarrer

Effectué

Azure Static Web Apps publie des sites web dans un environnement de production en générant des applications à partir d’un dépôt GitHub. Dans cet exercice, vous générez une application web en utilisant Blazor à partir d’un dépôt GitHub.

Créer un dépôt

Ce module vous permet de créer facilement un dépôt à l’aide d’un dépôt de modèles GitHub. Un modèle est disponible, qui contient une application de démarrage créée avec Blazor.

  1. Accédez à la page créer à partir d’un modèle pour le référentiel de modèles.

    • Si vous obtenez une erreur 404 Page introuvable, connectez-vous à GitHub, puis réessayez.
  2. Si on vous le demande pour Owner, choisissez l’un de vos comptes GitHub.

  3. Nommez votre dépôt my-static-blazor-app.

  4. Azure Static Web Apps prend en charge les dépôts publics et privés. Pour cet exercice, sélectionnez Private comme visibilité.

  5. Sélectionnez Créer un référentiel.

Exécuter l’application

Vous venez de créer un dépôt GitHub nommé my-static-blazor-app dans votre compte GitHub. Vous clonez ensuite ce dépôt et exécutez le code localement sur votre ordinateur.

  1. Dans votre dépôt GitHub, sélectionnez Code et copiez l’URL sous HTTPS. Ouvrez Visual Studio et sélectionnez Cloner un référentiel. Ajoutez l’URL copiée à l’emplacement du référentiel, ajoutez un chemin d’accès, puis sélectionnez Cloner.

    • Si plusieurs versions de Visual Studio sont installées, vérifiez que votre application est ouverte dans Visual Studio 2022 ou ultérieur.
  2. Ouvrez le fichier solution , ShoppingList.sln.

    Capture d’écran montrant où ouvrir la solution de liste d’achats.

  3. Enfin, exécutez l’application cliente frontale en sélectionnant Client comme projet de démarrage et en lançant le débogueur.

    Capture d’écran montrant le projet client sélectionné.

Naviguer jusqu’à votre application

Il est temps de voir votre application s’exécuter localement. Visual Studio ouvre le site web dans votre navigateur par défaut.

Capture d’écran montrant l’interface utilisateur de votre application web.

Votre application doit dire Charger des données ... car il n’y a pas encore de données ou d’API. Vous allez ajouter l’API pour votre application web plus loin dans ce module.

Maintenant, arrêtez votre application en cours d’exécution en mettant fin à la session de débogage dans Visual Studio.

Étapes suivantes

Vous avez généré votre application et celle-ci s’exécute localement dans votre navigateur.

Vous publiez ensuite votre application dans Azure Static Web Apps.