Tutoriel : Utiliser l’infrastructure web Django dans Visual Studio

Cet article est la première étape d’une série de didacticiels en cinq parties qui montre comment utiliser Django dans Visual Studio. Django est une infrastructure Python de haut niveau conçue pour un développement web rapide, sécurisé et évolutif. Visual Studio fournit des modèles de projet que vous pouvez utiliser pour simplifier la création d’applications web basées sur Django. Cette série de tutoriels explore l’infrastructure Django dans le contexte des modèles de projet Visual Studio.

À l’étape 1 du didacticiel, vous allez apprendre à :

• Créer un projet d’application web Django en utilisant le modèle Projet Web Django Vide.
• Examiner le code passe-partout et exécuter l'application
• Créer un référentiel Git pour l’application web Django
• Utiliser des contrôles de code source Git
• Créer un environnement virtuel pour l’application web Django

Conditions préalables

• Visual Studio 2022 sur Windows avec les options suivantes sélectionnées dans Visual Studio Installer :

  • Sous l’onglet Charges de travail, sélectionnez l’option développement Python. Pour plus d’informations, consultez Installer la prise en charge de Python dans Visual Studio.

  • Sous l’onglet Composants individuels dans Outils de code, sélectionnez l’option Git pour Windows.

Les modèles de projet Django dans Visual Studio sont inclus avec toutes les versions antérieures de Python Tools pour Visual Studio. Les détails du modèle peuvent différer des descriptions de cette série de tutoriels, en particulier pour les versions antérieures de l’infrastructure web Django.

Visual Studio pour Mac n’est pas pris en charge. Pour plus d’informations, consultez Qu’est-ce qui se passe dans Visual Studio pour Mac ? Visual Studio Code sur Windows, Mac et Linux fonctionne correctement avec Python via des extensions disponibles.

Projets Visual Studio et projets Django

Dans la terminologie Django, un projet Django a plusieurs fichiers de configuration au niveau du site, ainsi qu’une ou plusieurs « applications ». Pour créer une application web complète, vous pouvez déployer ces applications sur un hôte web. Un projet Django peut contenir plusieurs applications, et la même application peut se trouver dans plusieurs projets Django.

Un projet Visual Studio peut contenir le projet Django avec plusieurs applications. Dans cette série de tutoriels, le terme « projet » fait référence au projet Visual Studio. Lorsque le contenu fait référence à la partie « Projet Django » de l’application web, il fait référence à un « projet Django » spécifiquement.

Créer un projet et une solution Visual Studio

À l’étape 1 de cette série de tutoriels, vous créez une solution Visual Studio unique pour contenir plusieurs projets Django. Chaque projet contient une application Django unique. Vous créez les projets à l’aide de différents modèles de projet Django inclus dans Visual Studio. En conservant les projets dans la même solution, vous pouvez facilement basculer entre différents fichiers à des fins de comparaison.

Lorsque vous travaillez avec Django à partir de la ligne de commande, vous démarrez généralement un projet en exécutant la commande django-admin startproject <project_name>. Dans Visual Studio, le modèle Projet web Django vide fournit la même structure dans un projet et dans une solution Visual Studio.

Suivez cette procédure pour créer la solution et le projet :

1. Dans Visual Studio, sélectionnez Fichier>Nouveau>Projet et recherchez « Django ». Ensuite, sélectionnez le modèle projet Web Django vide et sélectionnez suivant.

   

2. Configurez votre nouveau projet et votre nouvelle solution :

   1. Définissez le Nom du projet Visual Studio sur BasicProject. Ce nom est également utilisé pour le projet Django.

   2. Spécifiez l’emplacement pour Visual Studio afin d’enregistrer la solution et le projet.

   3. Désactivez la solution Placez la solution et le projet dans le même répertoire option.

   4. Définissez le nom de la solution sur LearningDjango. La solution sert de conteneur pour plusieurs projets dans cette série de tutoriels.

3. Sélectionnez Créer.

4. Après un instant, Visual Studio affiche l’invite fichier de spécification de package Python «requirements.txt» a été détecté dans le projet « BasicProject ».:

   

   La boîte de dialogue indique que le modèle sélectionné inclut un fichier requirements.txt que vous pouvez utiliser pour créer un environnement virtuel pour le projet.

5. Sélectionnez le bouton X situé à droite pour fermer l’invite. Plus loin dans ce tutoriel, vous créez l’environnement virtuel et vérifiez que le contrôle de code source exclut l’environnement. (L’environnement peut toujours être créé ultérieurement à partir du fichier requirements.txt.)

Examiner les contrôles Git

Dans la procédure suivante, vous vous familiarisez avec la prise en charge de Visual Studio pour le contrôle de code source Git.

Important

Dans Visual Studio 2019 et versions ultérieures, l’expérience de contrôle de version Git est activée par défaut. Si vous souhaitez en savoir plus sur la façon dont il se compare à Team Explorer, consultez la page comparaison côte à côte de Git et Team Explorer.

Si vous préférez continuer à utiliser Team Explorer dans les versions antérieures de Visual Studio, accédez à Tools>Options>Environment>Preview Features et activez la case à cocher Nouvelle expérience utilisateur Git.

1. Pour valider le projet dans votre contrôle de code source local, sélectionnez Ajouter au contrôle de code source en bas à droite dans la fenêtre principale de Visual Studio, puis sélectionnez Git:

   

   La fenêtre Créer un dépôt Git s’ouvre, où vous pouvez créer et envoyer (push) un nouveau référentiel.

2. Une fois que vous avez créé un référentiel, la barre de contrôles Git apparaît en bas à droite dans la fenêtre principale de Visual Studio :

   

   De gauche à droite, la barre de contrôles Git affiche le nombre de validations sortantes/entrantes (flèches #/#), le nombre de modifications non validées (crayon #), le nom de la branche actuelle et le nom du référentiel actuel. Les contrôles Git sont également disponibles dans le menu Git dans la barre d’outils principale.

3. Dans la barre de contrôles Git, sélectionnez les modifications (crayon #) pour ouvrir la fenêtre Modifications Git. Vous pouvez également sélectionner Afficher>modifications Git (Ctrl+O, Ctrl+G) :

   

   Cette fenêtre affiche des détails sur les modifications non validées, y compris celles mises de côté. Étant donné que votre projet nouvellement créé est déjà validé automatiquement pour le contrôle de code source, vous ne voyez aucune modification en attente.

4. Dans la barre de contrôles Git, sélectionnez les validations (flèches #/#), puis sélectionnez Afficher toutes les validations:

   

   La fenêtre du dépôt Git s’ouvre. Vous pouvez également sélectionner afficher>référentiel Git (Ctrl+O, Ctrl+R) :

   

   Cette fenêtre affiche les détails du référentiel actif dans le volet gauche et de la branche actuelle avec des validations sortantes/entrantes dans le volet droit.

   Pour afficher l’affichage des différences pour le fichier, sélectionnez une validation dans le volet central. La version précédente s’affiche sur le côté gauche et la version révisée s’affiche sur le côté droit. Les détails contiennent également l’auteur des modifications, le commiteur de modification et le message de validation.

À mesure que vous parcourez cette série de tutoriels, prenez l’habitude d’utiliser régulièrement les contrôles Git dans Visual Studio pour valider et envoyer (push) les modifications. Les étapes du didacticiel vous rappellent les points appropriés.

Utiliser le contrôle de code source à partir du début

Il existe plusieurs avantages à l’utilisation du contrôle de code source à partir du début d’un projet. Lorsque vous utilisez le contrôle de code source à partir du début d’un projet, en particulier si vous utilisez également un référentiel distant, vous bénéficiez d’une sauvegarde hors site régulière de votre projet. Contrairement à la maintenance d’un projet uniquement sur un système de fichiers local, le contrôle de code source fournit également un historique des modifications complet et la possibilité facile de rétablir un fichier unique ou l’ensemble du projet à un état précédent. L’historique des modifications permet de déterminer la cause des régressions (échecs de test).

Le contrôle de code source est essentiel si plusieurs personnes travaillent sur un projet, car elle gère les remplacements et fournit une résolution des conflits. Le contrôle de code source est fondamentalement une forme d’automatisation, vous permet d’automatiser les builds, les tests et la gestion des mises en production. C’est la première étape de l’utilisation d’Azure DevOps pour un projet, et parce que les obstacles à l’entrée sont si faibles, il n’y a vraiment aucune raison de ne pas utiliser le contrôle de code source depuis le début.

Pour plus d’informations sur le contrôle de code source en tant qu’automatisation, consultez The Source of Truth : The Role of Repository in DevOps, un article de MSDN Magazine écrit pour les applications mobiles qui s’applique également aux applications web.

Empêcher Visual Studio de valider automatiquement des projets

Procédez comme suit pour empêcher Visual Studio de valider automatiquement un nouveau projet :

1. Sélectionnez Outils>Options>Contrôle de code source>Paramètres globaux Git.

2. Désactivez l’option Valider les modifications après la fusion par défaut, puis sélectionnez OK.

Créer un environnement virtuel et exclure le contrôle de code source

Après avoir configuré le contrôle de code source pour votre projet, vous pouvez créer l’environnement virtuel avec les packages Django nécessaires dont le projet a besoin. Vous pouvez ensuite utiliser la fenêtre Modifications Git pour exclure le dossier de l’environnement du contrôle de code source.

1. Dans Explorateur de solutions, cliquez avec le bouton droit sur le nœud Environnements Python, puis sélectionnez Ajouter un environnement.

   

2. Dans la boîte de dialogue Ajouter un environnement, sélectionnez Créer pour accepter les valeurs par défaut. (Vous pouvez modifier le nom de l’environnement virtuel si vous le souhaitez, ce qui modifie le nom de son sous-dossier, mais env est une convention standard.)

   

3. Si Visual Studio demande des privilèges d’administrateur, fournissez votre consentement. Patientez plusieurs minutes pendant que Visual Studio télécharge et installe des packages. Pour Django et ses dépendances, le processus peut nécessiter un développement proche de 1 000 fichiers dans plus de 100 sous-dossiers. Vous pouvez afficher la progression dans la fenêtre Sortie de Visual Studio.

4. Dans la barre de contrôles Git, sélectionnez les modifications non validées (qui affichent désormais 99) pour ouvrir la fenêtre Modifications Git :

   

   La création de l’environnement virtuel apporte des milliers de modifications, mais vous n’avez pas besoin de les inclure dans le contrôle de code source. Vous ou toute autre personne qui clone le projet peut toujours recréer l’environnement à l’aide du fichier requirements.txt.

5. Pour exclure l’environnement virtuel du contrôle de code source, dans la fenêtre Modifications Git, cliquez avec le bouton droit sur le dossier env, puis sélectionnez Ignorer ces éléments locaux:

   

   Après avoir exclu l’environnement virtuel, les seules modifications restantes sont apportées au fichier projet (.py) et au fichier .gitignore, qui contient une entrée ajoutée pour le dossier d’environnement virtuel.

   Pour afficher la vue des différences pour le fichier .gitignore, dans la fenêtre Modifications Git, double-cliquez sur le fichier.

6. Dans la fenêtre Modifications Git, entrez un message de validation, tel que « Modifications initiales du projet » :

   

7. Dans le menu déroulant Validation, sélectionnez Validation intermédiaire et push.

Vous pouvez ouvrir la fenêtre du référentiel Git et confirmer que les validations mises en scène s'affichent dans l'historique local pour la branche actuelle.

Comprendre l’objectif des environnements virtuels

Un environnement virtuel est un excellent moyen d’isoler les dépendances exactes de votre application. Cette méthode d’isolation évite les conflits au sein d’un environnement Python global et facilite les tests et la collaboration. Au fil du temps, lorsque vous développez une application, vous apportez invariablement de nombreux packages Python utiles. En conservant les packages dans un environnement virtuel spécifique au projet, vous pouvez facilement mettre à jour le fichier requirements.txt du projet qui décrit cet environnement, qui est inclus dans le contrôle de code source. Lorsque vous copiez le projet sur d’autres ordinateurs, notamment des serveurs de build, des serveurs de déploiement et d’autres ordinateurs de développement, il est facile de recréer l’environnement. Vous pouvez recréer l’environnement en utilisant uniquement le fichier requirements.txt, c’est pourquoi l’environnement n’a pas besoin d’être dans le contrôle de code source. Pour plus d’informations, consultez Utiliser des environnements virtuels.

Supprimer un environnement virtuel sous contrôle de code source

Vous pouvez supprimer un environnement virtuel une fois qu’il est sous contrôle de code source. Procédez comme suit :

1. Modifiez votre fichier .gitignore pour exclure le dossier :

   1. Ouvrez le fichier en sélectionnant Fichier>Ouvrir>fichier.

      Vous pouvez également ouvrir le fichier à partir de Team Explorer. Sur la page Paramètres, sélectionnez Paramètres du référentiel. Accédezà la section Ignorer et fichiers d’attributs et sélectionnez le lien Modifier à côté de .gitignore.

   2. Recherchez la section à la fin qui contient le commentaire # Python Tools for Visual Studio (PTVS).

   3. Après cette section, ajoutez une nouvelle ligne pour le dossier d’environnement virtuel, par exemple /BasicProject/env.

2. Ouvrez une fenêtre de commande et accédez au dossier (par exemple, BasicProject) qui contient le dossier d’environnement virtuel, tel que env.

3. Exécutez la commande git rm -r env pour supprimer l’environnement virtuel actuellement sous contrôle de code source.

4. Validez vos modifications avec la commande git commit -m 'Remove venv', ou validez-les à partir de la page Modifications de Team Explorer.

Examiner le code type

Dans cette section, vous examinez le code passe-partout dans le fichier de projet (.py) que Visual Studio crée en fonction de votre sélection de modèle.

Remarque

Le code réutilisable est identique si vous créez le projet dans Visual Studio à partir du modèle Django ou générez le projet à l’aide de la commande CLI django-admin startproject <project_name>.

1. Ouvrez Explorateur de solutions pour afficher vos fichiers solution et projet. Le projet initial contient seulement deux fichiers, manage.py et requirements.txt:

   

   Le fichier requirements.txt spécifie les dépendances du package Django. La présence de ce fichier est ce qui vous invite à créer un environnement virtuel lors de la première création du projet.

   Le fichier manage.py est l’utilitaire d’administration de ligne de commande Django que Visual Studio définit automatiquement comme fichier de démarrage du projet. Vous exécutez l’utilitaire sur la ligne de commande à l’aide de python manage.py <command> [options] commande.

   Pour les tâches Django courantes, Visual Studio fournit des commandes de menu pratiques. Cliquez avec le bouton droit sur le projet dans l’Explorateur de solutions, puis sélectionnez Python pour afficher la liste des commandes. Vous utilisez plusieurs de ces commandes dans cette série de tutoriels.

2. En plus des deux fichiers, le projet a également un sous-dossier portant le même nom que le projet. Ce dossier contient les fichiers projet Django de base :

   

   • __init__.py: fichier vide qui indique à Python que ce dossier est un package Python.
   • settings.py: paramètres du projet Django, que vous modifiez lorsque vous développez une application web.
   • urls.py: table des matières du projet Django, que vous modifiez lors du développement de votre application web.
   • wsgi.py: point d’entrée pour les serveurs web compatibles WSGI pour servir votre projet. Vous laissez généralement ce fichier as-is car il fournit les points d'accroche pour les serveurs web de production.

Générer des exigences après l’installation du package

Visual Studio peut générer un fichier requirements.txt à partir d’un environnement virtuel après avoir installé d’autres packages.

• Dans Explorateur de solutions, déroulez le nœud Environnements Python, faites un clic droit sur votre environnement virtuel, puis sélectionnez Générer requirements.txt.

Il est recommandé d’utiliser cette commande régulièrement lorsque vous modifiez l’environnement. Validez les modifications apportées à votre fichier requirements.txt dans le contrôle de code source, ainsi que les autres modifications de code qui dépendent de cet environnement. Si vous configurez l’intégration continue sur un serveur de build, vous devez générer le fichier et valider les modifications chaque fois que vous modifiez l’environnement.

Exécuter le projet

Vous êtes maintenant prêt à exécuter votre projet dans Visual Studio en suivant cette procédure :

1. Dans Visual Studio, sélectionnez Déboguer>Démarrer le Débogage (F5) ou sélectionnez Serveur Web dans la barre d’outils principale (le navigateur que vous voyez peut varier) :

   

2. L’une ou l’autre commande exécute le serveur à l’aide de la commande manage.py runserver <port>, qui démarre le serveur web intégré dans Django.

   Le code démarre l’application à l’aide du port spécifié dans le serveur de développement Django.

   Si Visual Studio publie le message Impossible de démarrer le débogueur et indique qu’aucun fichier de démarrage n’est trouvé, cliquez avec le bouton droit sur le fichier manage.py dans l’Explorateur de solutions et sélectionnez définir comme fichier de démarrage.

3. Au démarrage du serveur, une fenêtre de console s’ouvre pour afficher le journal du serveur. Visual Studio ouvre automatiquement un navigateur pour http://localhost:<port>. Étant donné que votre projet Django n’a pas d’applications, Django affiche uniquement une page par défaut pour confirmer que le code actuel fonctionne comme prévu.

   

4. Lorsque vous avez terminé, fermez la fenêtre de console, ce qui arrête le serveur de développement Django. Vous pouvez également sélectionner Déboguer>Arrêter le débogage.

Utiliser le serveur web et l’infrastructure Django

Django dispose d’un serveur web intégré que vous pouvez utiliser à des fins de développement. Lorsque vous exécutez votre application web Django localement, vous utilisez le serveur de développement web Django intégré. Voici un exemple de ce scénario lorsque vous déboguez votre application web Django dans Visual Studio.

Lorsque vous déployez votre application web Django sur un hôte web, vous utilisez le serveur web sur l’hôte plutôt que sur le serveur web Django intégré. Le module wsgi.py du projet Django s’occupe de se connecter aux serveurs de production.

Comparer les commandes Debug avec les commandes Python du projet,

Il existe une différence entre l’utilisation des commandes de menu de débogage et les commandes de serveur répertoriées dans le sous-menu Python du projet.

Outre les commandes de menu de débogage et les boutons de la barre d’outils, vous pouvez également lancer le serveur à l’aide des commandes Python>Démarrer le serveur ou Python>Démarrer le serveur de débogage dans le menu contextuel du projet.

Les deux commandes ouvrent une fenêtre de console dans laquelle vous voyez l’URL locale (localhost:port) pour le serveur en cours d’exécution. Toutefois, vous devez ouvrir manuellement un navigateur avec cette URL et exécuter le serveur de débogage ne démarre pas automatiquement le débogueur Visual Studio. Vous pourrez attacher un débogueur au processus en cours d’exécution plus tard si vous le souhaitez, avec la commande Déboguer>Attacher au processus.

Étape suivante

Étape 2 : Créer une application Django avec des vues et des modèles de page