Partager via

Démarrage rapide : Créer et déployer une application web Python à partir de GitHub Codespaces pour Azure à l’aide d’un modèle CLI Azure développeur

Ce guide de démarrage rapide vous guide tout au long du moyen le plus simple et le plus rapide de créer et de déployer une solution web et de base de données Python sur Azure. En suivant les instructions de ce guide de démarrage rapide, vous devez :

  • Choisissez un modèle Azure Developer CLI (azd) basé sur le framework web Python, la plateforme de base de données Azure et Azure plateforme d’hébergement web sur laquelle vous souhaitez créer.
  • Créez un espace de code GitHub contenant du code généré à partir du modèle azd que vous avez sélectionné.
  • Utilisez GitHub Espaces de code et le terminal bash de Visual Studio Code en ligne. Le terminal vous permet d’utiliser Azure commandes CLI développeur pour exécuter un modèle azd pour créer un exemple d’application web et de base de données, et de créer et configurer les ressources nécessaires Azure, puis de déployer l’exemple d’application web sur Azure.
  • Modifiez l’application web dans un espace de code GitHub et utilisez une commande azd pour redéployer.
  • Utilisez une commande azd pour nettoyer les ressources Azure.
  • Fermez et rouvrez votre espace de code GitHub.
  • Publiez votre nouveau code dans un référentiel GitHub.

La fin de ce didacticiel doit prendre moins de 25 minutes. Une fois l’opération terminée, vous pouvez commencer à modifier le nouveau projet avec votre code personnalisé.

Pour en savoir plus sur ces modèles azd pour Python développement d’applications web, consultez :

Conditions préalables

Importante

Les GitHub Codespaces et les Azure sont des services basés sur des abonnements payants. Après quelques allocations gratuites, vous pouvez être facturé pour l’utilisation de ces services. Suivre ce guide de démarrage rapide pourrait affecter ces allocations ou la facturation. Si possible, les azd modèles utilisent le niveau d’options le moins coûteux, mais certains peuvent ne pas être gratuits. Utilisez la calculatrice de prix Azure pour mieux comprendre les coûts. Pour plus d’informations, consultez la tarification de GitHub Codespaces.

Choisir un modèle et créer un espace de code

Choisissez un modèle azd basé sur le framework web Python, Azure plateforme d’hébergement web et Azure plateforme de base de données sur laquelle vous souhaitez vous appuyer.

  1. Dans la liste suivante de modèles, choisissez-en un qui utilise les technologies que vous souhaitez utiliser dans votre nouvelle application web.

    Modèle Cadre Web Base de données Plateforme d’hébergement Nouvel espace de code
    azure-django-postgres-flexible-aca Django Serveur flexible PostgreSQL Azure Container Apps New Codespace
    azure-django-postgres-flexible-appservice Django Serveur flexible PostgreSQL Azure App Service New Codespace
    azure-django-cosmos-postgres-aca Django Cosmos DB (adaptateur PostgreSQL) Azure Container Apps New Codespace
    azure-django-cosmos-postgres-appservice Django Cosmos DB (adaptateur PostgreSQL) Azure App Service New Codespace
    azure-django-postgres-addon-aca Django Azure Container Apps module complémentaire PostgreSQL Azure Container Apps New Codespace

  1. Pour votre commodité, la dernière colonne de chaque table contient un lien qui crée un espace de code et initialise le modèle azd dans votre compte GitHub. Cliquez avec le bouton droit sur le lien Nouvel espace de code en regard du nom du modèle que vous avez sélectionné, puis sélectionnez Ouvrir dans un nouvel onglet pour lancer le processus d’installation.

    Pendant ce processus, vous pouvez être invité à vous connecter à votre compte GitHub. Vous êtes également invité à confirmer que vous souhaitez créer Codespace. Sélectionnez le bouton Créer un espace de code pour afficher la page Configuration de votre espace de code .

  2. Après quelques minutes, une version web de Visual Studio Code se charge dans un nouvel onglet de navigateur avec le modèle web Python chargé en tant qu’espace de travail dans l’affichage Explorateur.

S’authentifier auprès de Azure et déployer le modèle azd

Maintenant que vous disposez d’un espace de code GitHub contenant le code nouvellement généré, utilisez l’utilitaire azd à partir de Codespace pour publier le code sur Azure.

  1. Dans le Visual Studio Code web, le terminal est ouvert par défaut. Si ce n’est pas le cas, utilisez la clé tilde ~ pour ouvrir le terminal. Par défaut, le terminal est un terminal bash. Si ce n'est pas le cas, passez à bash dans la partie supérieure droite de la fenêtre de terminal.

  2. Dans le terminal bash, entrez la commande suivante :

    azd auth login

    azd auth login commence à authentifier votre Codespace pour votre compte Azure.

    Start by copying the next code: XXXXXXXXX
Then press enter and continue to log in from your browser...

Waiting for you to complete authentication in the browser...

  3. Suivez les instructions, notamment :

    • Copie d’un code généré
    • Sélectionner Entrée pour ouvrir un nouvel onglet de navigation et coller le code dans la zone de texte
    • Choix de votre compte Azure dans une liste
    • Confirmez que vous essayez de vous connecter à Microsoft Azure CLI

  4. En cas de réussite, le message suivant s’affiche dans l’onglet Codespaces du terminal :

    Device code authentication completed.
Logged in to Azure.

  5. Déployez votre nouvelle application sur Azure en entrant la commande suivante :

    azd up

    Pendant ce processus, vous êtes invité à :

    • Entrer un nom pour le nouvel environnement
    • Sélectionnez un abonnement Azure à utiliser [Utiliser les flèches pour déplacer, taper pour filtrer]
    • Sélectionnez un emplacement Azure à utiliser : [Utiliser les flèches pour déplacer, taper pour filtrer]

    Une fois que vous avez répondu à ces questions, la sortie de azd indique que le déploiement progresse.

    Importante

    Une fois azd up terminée avec succès, l’exemple d’application web est disponible sur l’Internet public et votre abonnement Azure commence à accumuler des frais pour toutes les ressources créées. Les créateurs des azd modèles choisissent intentionnellement des niveaux peu coûteux, mais pas nécessairement des niveaux gratuits , car les niveaux gratuits ont souvent une disponibilité restreinte. Lorsque vous avez terminé d’utiliser l’exemple d’application web, utilisez cette option azd down pour supprimer tous les services créés azd up .

    Suivez les instructions lorsque vous êtes invité à choisir Azure Abonnement à utiliser pour le paiement, puis sélectionnez un emplacement Azure à utiliser. Choisissez une région proche de vous géographiquement.

    L'exécution de azd up peut prendre plusieurs minutes, car il s'agit de l'approvisionnement et du déploiement de plusieurs services Azure. À mesure que la progression s’affiche, surveillez les erreurs. Si vous voyez des erreurs, consultez la section Résolution des problèmes en bas de ce document.

  6. Lorsque azd up s'achève avec succès, une sortie similaire est affichée :

    (✓) Done: Deploying service web
- Endpoint: https://xxxxx-xxxxxxxxxxxxx-ca.example-xxxxxxxx.westus.azurecontainerapps.io/

SUCCESS: Your application was provisioned and deployed to Azure in 11 minutes 44 seconds.
You can view the resources created under the resource group xxxxx-rg in Azure portal:
https://portal.azure.com/#@/resource/subscriptions/xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx/resourceGroups/xxxxx-rg/overview

    Si vous voyez un écran par défaut ou un écran d’erreur, l’application peut démarrer. Attendez 5 à 10 minutes pour voir si le problème se résout avant de résoudre le problème.

    1. Ctrl + cliquez sur la première URL après le mot - Endpoint: pour afficher l’exemple de projet d’application web en cours d’exécution dans Azure.

  7. Ctrl + cliquez sur la deuxième URL de l’étape précédente pour afficher les ressources approvisionnées dans le portail Azure.

Modifier et redéployer

Ensuite, apportez une petite modification à l’application web, puis redéployez-la.

  1. Revenez à l’onglet du navigateur qui contient Visual Studio Code. Utilisez la vue Explorateur de Visual Studio Code pour accéder au dossier src/templates. Ouvrez le fichier index.html . Recherchez la ligne de code suivante :

    <h1 id="page-title">Welcome to ReleCloud</h1>

    Modifiez le texte à l’intérieur du H1 :

    <h1 id="page-title">Welcome to ReleCloud - UPDATED</h1>

    Votre code est enregistré au fur et à mesure que vous tapez.

  2. Pour redéployer l’application avec votre modification, exécutez la commande suivante dans le terminal :

    azd deploy

  3. Une fois la commande terminée, actualisez l’onglet du navigateur avec le site web ReleCloud pour afficher la mise à jour. Selon la plateforme d’hébergement web que vous utilisez, cela peut prendre plusieurs minutes avant que vos modifications ne soient visibles.

    Vous êtes maintenant prêt à modifier et supprimer des fichiers dans le modèle. Pour plus d’informations, consultez Que puis-je modifier ou supprimer dans le modèle ?

Nettoyer les ressources

Nettoyez les ressources créées par le modèle en exécutant la commande azd down .

azd down

La commande azd down supprime les ressources Azure et le flux de travail GitHub Actions. Lorsque vous y êtes invité, acceptez de supprimer toutes les ressources associées au groupe de ressources.

Facultatif : Rechercher votre espace de code

Cette section montre comment votre code est temporairement en cours d’exécution et conservé à court terme dans un espace de code. Si vous envisagez de continuer à travailler sur le code, publiez le code dans un nouveau référentiel.

  1. Fermez tous les onglets liés à cet article de démarrage rapide ou arrêtez entièrement votre navigateur web.

  2. Ouvrez votre navigateur web et un nouvel onglet, puis accédez à https://github.com/codespaces.

  3. Près du bas, vous voyez une liste des Codespaces récents. Recherchez celui que vous avez créé dans une section intitulée « Propriété par Azure-Samples ».

  4. Sélectionnez les points de suspension à droite de cet espace de code pour afficher un menu contextuel. À partir de là, vous pouvez renommer l’espace de code, publier dans un nouveau référentiel, modifier le type d’ordinateur, arrêter l’espace de code, etc.

Facultatif : Publier un référentiel GitHub à partir de Codespaces

À ce stade, vous disposez d’un espace de code, qui est un conteneur hébergé par GitHub exécutant votre environnement de développement Visual Studio Code avec votre nouveau code généré à partir d’un modèle azd. Toutefois, le code n'est pas stocké dans un référentiel GitHub. Si vous envisagez de continuer à travailler sur le code, hiérarchiser le stockage dans un référentiel.

  1. Dans le menu contextuel de l’espace de code, sélectionnez Publier dans un nouveau référentiel.
  2. Dans la boîte de dialogue Publier dans un nouveau référentiel , renommez votre nouveau dépôt et choisissez si vous souhaitez qu’il s’agisse d’un dépôt public ou privé. Sélectionnez Créer un référentiel.
  3. Après quelques instants, le référentiel est créé et le code que vous avez généré précédemment dans ce guide de démarrage rapide est envoyé (push) au nouveau référentiel. Sélectionnez le bouton Afficher le référentiel pour accéder au nouveau dépôt.
  4. Pour rouvrir et continuer à modifier le code, sélectionnez la liste déroulante «<> Code », basculez vers l’onglet Espaces de code et sélectionnez le nom de l’espace de code sur lequel vous travaillez précédemment. Vous revenez à votre environnement de développement Codespace Visual Studio Code.
  5. Utilisez le volet Contrôle de code source pour créer de nouvelles branches et mettre en scène et valider de nouvelles modifications dans votre code.

Résolution des problèmes

Si vous voyez des erreurs pendant azd up, essayez les étapes suivantes :

  • Exécutez azd down pour supprimer les ressources créées par la commande. Vous pouvez également supprimer le groupe de ressources que vous avez créé dans le portail Azure.
  • Accédez à la page Codespaces de votre compte GitHub, recherchez l’espace de code créé pendant ce démarrage rapide, sélectionnez les points de suspension à droite, puis choisissez Delete dans le menu contextuel.
  • Dans le portail Azure, recherchez les coffres de clés. Sélectionnez Gérer les coffres supprimés, choisissez votre abonnement, sélectionnez tous les coffres de clés qui contiennent le nom azdtest ou le nom que vous avez donné à votre environnement, puis sélectionnez Purger.
  • Réessayez les étapes de ce guide de démarrage rapide. Cette fois lorsque vous y êtes invité, choisissez un nom plus simple pour votre environnement. Essayez un nom court, des lettres minuscules, aucun nombre, aucune lettre majuscule et aucun caractère spécial.
  • Lorsque vous réessayez les étapes de démarrage rapide, choisissez un autre emplacement.

Pour obtenir une liste plus complète des problèmes et solutions possibles, consultez le FAQ.

Contenu connexe

  • Last updated on