Génération de modèles automatique et migrations d’ASP.NET MVC 4 Entity Framework

Article
07/13/2023

Télécharger le kit de formation Web Camps

Si vous êtes familiarisé avec ASP.NET méthodes de contrôleur MVC 4, ou si vous avez terminé le Hands-On labo « Helpers, Forms and Validation », vous devez savoir qu’une grande partie de la logique de création, de mise à jour, de liste et de suppression de toute entité de données est répétée dans l’application. Sans mention que, si votre modèle a plusieurs classes à manipuler, vous serez susceptible de passer un temps considérable à écrire les méthodes d’action POST et GET pour chaque opération d’entité, ainsi que chacune des vues.

Dans ce labo, vous allez apprendre à utiliser la structure ASP.NET MVC 4 pour générer automatiquement la base de référence du CRUD (Create, Read, Update et Delete) de votre application. À partir d’une classe de modèle simple et, sans écrire une seule ligne de code, vous allez créer un contrôleur qui contiendra toutes les opérations CRUD, ainsi que toutes les vues nécessaires. Après avoir créé et exécuté la solution simple, vous aurez généré la base de données d’application, ainsi que la logique et les vues MVC pour la manipulation des données.

En outre, vous découvrirez comment il est facile d’utiliser Entity Framework Migrations pour effectuer des mises à jour de modèle dans l’ensemble de votre application. Entity Framework Migrations vous permet de modifier votre base de données une fois que le modèle a changé à l’aide d’étapes simples. Avec tous ces éléments à l’esprit, vous serez en mesure de créer et de gérer des applications web plus efficacement, en tirant parti des dernières fonctionnalités de ASP.NET MVC 4.

Remarque

Tous les exemples de code et extraits de code sont inclus dans le Kit de formation Web Camps, disponible à partir de Microsoft-Web/WebCampTrainingKit Releases. Le projet spécifique à ce labo est disponible dans ASP.NET structure et migrations d’Entity Framework MVC 4.

Objectifs

Dans ce Hands-On Lab, vous allez apprendre à :

Utilisez ASP.NET la génération automatique pour les opérations CRUD dans les contrôleurs.
Modifiez le modèle de base de données à l’aide d’Entity Framework Migrations.

Prérequis

Vous devez disposer des éléments suivants pour effectuer ce labo :

Microsoft Visual Studio Express 2012 pour le web ou supérieur (voir l’Annexe A pour obtenir des instructions sur la façon de l’installer).

Programme d’installation

Installation d’extraits de code

Pour des raisons pratiques, une grande partie du code que vous allez gérer dans ce labo est disponible sous forme d’extraits de code Visual Studio. Pour installer les extraits de code, exécutez le fichier .\Source\Setup\CodeSnippets.vsi .

Si vous n’êtes pas familiarisé avec les extraits de code Visual Studio code et que vous souhaitez savoir comment les utiliser, vous pouvez vous reporter à l’annexe de ce document « Annexe B : Utilisation d’extraits de code ».

Exercices

L’exercice suivant compose ce Hands-On Lab :

Utilisation de ASP.NET génération automatique MVC 4 avec des migrations Entity Framework

Remarque

Cet exercice est accompagné d’un dossier End contenant la solution résultante que vous devez obtenir une fois l’exercice terminé. Vous pouvez utiliser cette solution comme guide si vous avez besoin d’aide supplémentaire pour effectuer l’exercice.

Durée estimée d’exécution de ce labo : 30 minutes

Exercice 1 : Utilisation de ASP.NET génération automatique MVC 4 avec des migrations Entity Framework

ASP.NET la génération automatique MVC offre un moyen rapide de générer les opérations CRUD de manière standardisée, en créant la logique nécessaire qui permet à votre application d’interagir avec la couche de base de données.

Dans cet exercice, vous allez apprendre à utiliser d’abord ASP.NET génération automatique MVC 4 avec du code pour créer les méthodes CRUD. Ensuite, vous allez apprendre à mettre à jour votre modèle en appliquant les modifications apportées à la base de données à l’aide d’Entity Framework Migrations.

Tâche 1 : Création d’un projet ASP.NET MVC 4 à l’aide de la génération de modèles automatique

Si ce n’est pas déjà le cas, démarrez Visual Studio 2012.
Sélectionner un fichier | Nouveau projet. Dans la boîte de dialogue Nouveau projet, sous Visual C# | Section Web , sélectionnez ASP.NET application web MVC 4. Nommez le projet MVC4andEFMigrations et définissez l’emplacement sur Source\Ex1-UsingMVC4ScaffoldingEFMigrations dossier de ce labo. Définissez le nom de la solution sur Begin et vérifiez que l’option Créer un répertoire pour la solution est cochée. Cliquez sur OK.

Boîte de dialogue Nouveau projet ASP.NET MVC 4
Dans la boîte de dialogue Nouveau projet ASP.NET MVC 4 , sélectionnez le modèle Application Internet et assurez-vous que Razor est le moteur d’affichage sélectionné. Cliquez sur OK pour créer le projet.

Nouvelle application Internet ASP.NET MVC 4
Dans le Explorateur de solutions, cliquez avec le bouton droit sur Modèles, puis sélectionnez Ajouter | Classe pour créer une personne de classe simple (POCO). Nommez-le Person et cliquez sur OK.

Ouvrez la classe Person et insérez les propriétés suivantes.

(Code Snippet - ASP.NET MVC 4 et Entity Framework Migrations - Ex1 Person Properties)

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

namespace MVC4EF.Models
{
    public class Person
    {
        public int PersonID { get; set; }

        public string FirstName { get; set; }

        public string LastName { get; set; }        
    }
}

Cliquez sur Générer | Générer la solution pour enregistrer les modifications et générer le projet.

Génération de l'application
Dans le Explorateur de solutions, cliquez avec le bouton droit sur le dossier controllers et sélectionnez Ajouter | Contrôleur.
Nommez le contrôleur PersonController et complétez les options de génération automatique avec les valeurs suivantes.
1. Dans la liste déroulante Modèle , sélectionnez le contrôleur MVC avec des actions et des vues en lecture/écriture, à l’aide de l’option Entity Framework.
2. Dans la liste déroulante Classe de modèle , sélectionnez la classe Person .
3. Dans la liste Classe de contexte de données, sélectionnez <Nouveau contexte de données...> Choisissez un nom et cliquez sur OK.
4. Dans la liste déroulante Vues , vérifiez que Razor est sélectionné.
  
  automatique
  
  Ajout du contrôleur Person avec la génération de modèles automatique
Cliquez sur Ajouter pour créer le contrôleur pour Person avec la génération de modèles automatique. Vous avez maintenant généré les actions du contrôleur ainsi que les vues.

automatique automatique

Après avoir créé le contrôleur Person avec la génération de modèles automatique
Ouvrez la classe PersonController . Notez que les méthodes d’action CRUD complètes ont été générées automatiquement.

À l’intérieur du contrôleur de personne

À l’intérieur du contrôleur Person

Tâche 2 : Exécution de l’application

À ce stade, la base de données n’est pas encore créée. Dans cette tâche, vous allez exécuter l’application pour la première fois et tester les opérations CRUD. La base de données sera créée à la volée avec Code First.

Appuyez sur F5 pour exécuter l'application.
Dans le navigateur, ajoutez /Person à l’URL pour ouvrir la page Personne.

Application : première exécution
Vous allez maintenant explorer les pages Person et tester les opérations CRUD.
1. Cliquez sur Créer pour ajouter une nouvelle personne. Entrez un prénom et un nom, puis cliquez sur Créer.
  
  Ajout d’une nouvelle personne
2. Dans la liste de la personne, vous pouvez supprimer, modifier ou ajouter des éléments.
  
  Liste de personnes
3. Cliquez sur Détails pour ouvrir les détails de la personne.
  
  Détails de la personne
Fermez le navigateur et revenez à Visual Studio. Notez que vous avez créé l’ensemble du CRUD pour l’entité person dans votre application , du modèle aux vues, sans avoir à écrire une seule ligne de code !

Tâche 3 : Mise à jour de la base de données à l’aide d’Entity Framework Migrations

Dans cette tâche, vous allez mettre à jour la base de données à l’aide d’Entity Framework Migrations. Vous découvrirez à quel point il est facile de modifier le modèle et de refléter les modifications apportées à vos bases de données à l’aide de la fonctionnalité Migrations d’Entity Framework.

Ouvrez la console du gestionnaire de package. Cliquez sur Outils>Gestionnaire de package NuGet>Console du Gestionnaire de package.
Dans la Console du gestionnaire de package, entrez la commande suivante :

PMC
```
Enable-Migrations -ContextTypeName [ContextClassName]
```
Activation des migrations

La commande Enable-Migration crée le dossier Migrations , qui contient un script pour initialiser la base de données.

Dossier Migrations
Ouvrez le fichier Configuration.cs dans le dossier Migrations. Recherchez le constructeur de classe et remplacez la valeur AutomaticMigrationsEnabled partrue.
```
public Configuration()
{
    AutomaticMigrationsEnabled = true;
}
```

Ouvrez la classe Person et ajoutez un attribut pour le deuxième prénom de la personne. Avec ce nouvel attribut, vous modifiez le modèle.

public class Person
{
    public int PersonID { get; set; }
    public string FirstName { get; set; }
    public string LastName { get; set; }
    public string MiddleName { get; set; }
}

Sélectionner Générer | Générer la solution dans le menu pour générer l’application.

Génération de l’application
Dans la Console du gestionnaire de package, entrez la commande suivante :

PMC
```
Add-Migration AddMiddleName
```
Cette commande recherche les modifications apportées aux objets de données, puis ajoute les commandes nécessaires pour modifier la base de données en conséquence.

Ajout d’un deuxième prénom
(Facultatif) Vous pouvez exécuter la commande suivante pour générer un script SQL avec la mise à jour différentielle. Cela vous permet de mettre à jour la base de données manuellement (dans ce cas, ce n’est pas nécessaire) ou d’appliquer les modifications dans d’autres bases de données :

PMC
```
Update-Database -Script -SourceMigration:

$InitialDatabase
```
Génération d’un script SQL

Mise à jour du script SQL
Dans la console du Gestionnaire de package, entrez la commande suivante pour mettre à jour la base de données :

PMC
```
Update-Database -Verbose
```
Mise à jour de la base de données

Cela ajoute la colonne MiddleName dans la table Personnes pour qu’elle corresponde à la définition actuelle de la classe Person.
Une fois la base de données mise à jour, cliquez avec le bouton droit sur le dossier Contrôleur et sélectionnez Ajouter | Contrôleur pour ajouter à nouveau le contrôleur de personne (Terminer avec les mêmes valeurs). Cela met à jour les méthodes et les vues existantes en ajoutant le nouvel attribut.

Mise à jour du contrôleur
Cliquez sur Add. Ensuite, sélectionnez les valeurs Remplacer PersonController.cs et les vues associées, puis cliquez sur OK.

Ajout d’un remplacement de contrôleur

Mise à jour du contrôleur

Tâche4 - Exécution de l’application

Appuyez sur F5 pour exécuter l'application.
Ouvrez /Person. Notez que les données ont été conservées, tandis que la colonne du deuxième nom a été ajoutée.

Deuxième prénom ajouté
Si vous cliquez sur Modifier, vous pourrez ajouter un deuxième prénom à la personne actuelle.

Résumé

Dans ce Hands-On labo, vous avez appris à créer des opérations CRUD avec ASP.NET structure MVC 4 à l’aide de n’importe quelle classe de modèle. Ensuite, vous avez appris à effectuer une mise à jour de bout en bout dans votre application, de la base de données aux vues, à l’aide des migrations Entity Framework.

Annexe A : Installation de Visual Studio Express 2012 pour web

Vous pouvez installer Microsoft Visual Studio Express 2012 pour le web ou une autre version « Express » à l’aide du Microsoft Web Platform Installer. Les instructions suivantes vous guident tout au long des étapes requises pour installer Visual Studio Express 2012 pour le Web à l’aide de Microsoft Web Platform Installer.

Atteindre https://go.microsoft.com/?linkid=9810169. Si vous avez déjà installé web Platform Installer, vous pouvez également l’ouvrir et rechercher le produit « Visual Studio Express 2012 pour le web avec le Kit de développement logiciel (SDK) Azure Windows ».
Cliquez sur Installer maintenant. Si vous n’avez pas web Platform Installer , vous serez redirigé pour le télécharger et l’installer en premier.
Une fois le programme d’installation de plateforme web ouvert, cliquez sur Installer pour démarrer l’installation.

Installer Visual Studio Express
Lisez les licences et conditions générales de tous les produits, puis cliquez sur J’accepte pour continuer.

Acceptation des termes du contrat de licence
Attendez que le processus de téléchargement et d’installation se termine.

Progression de l’installation
Une fois l’installation terminée, cliquez sur Terminer.

Installation terminée
Cliquez sur Quitter pour fermer le programme d’installation de plateforme web.
Pour ouvrir Visual Studio Express pour le web, accédez à l’écran d’accueil et commencez à écrire « VS Express », puis cliquez sur la vignette VS Express pour le web.

Vignette VS Express pour le web

Annexe B : Utilisation d’extraits de code

Avec les extraits de code, vous avez tout le code dont vous avez besoin à portée de main. Le document lab vous indique exactement quand vous pouvez les utiliser, comme illustré dans la figure suivante.

Utilisation d’extraits de code Visual Studio pour insérer du code dans votre projet

Utilisation d’extraits de code Visual Studio pour insérer du code dans votre projet

Pour ajouter un extrait de code à l’aide du clavier (C# uniquement)

Placez le curseur à l’emplacement où vous souhaitez insérer le code.
Commencez à taper le nom de l’extrait de code (sans espaces ni traits d’union).
Observez qu’IntelliSense affiche les noms des extraits de code correspondants.
Sélectionnez l’extrait de code correct (ou continuez à taper jusqu’à ce que le nom de l’extrait de code entier soit sélectionné).
Appuyez deux fois sur tab pour insérer l’extrait de code à l’emplacement du curseur.

Commencer à taper le nom de l’extrait de code

Commencez à taper le nom de l’extrait de code

Appuyez sur Tab pour sélectionner l’extrait en surbrillance

Appuyez sur Tab pour sélectionner l’extrait de code mis en surbrillance

Appuyez de nouveau sur Tab pour que l’extrait de code développe

Appuyez à nouveau sur Tab pour que l’extrait de code se développe

Pour ajouter un extrait de code à l’aide de la souris (C#, Visual Basic et XML) 1. Cliquez avec le bouton droit à l’emplacement où vous souhaitez insérer l’extrait de code.

Sélectionnez Insérer un extrait de code suivi de Mes extraits de code.
Sélectionnez l’extrait de code approprié dans la liste en cliquant dessus.

Cliquez avec le bouton droit à l’emplacement où vous souhaitez insérer l’extrait de code, puis sélectionnez Insérer un extrait de code

Cliquez avec le bouton droit à l’emplacement où vous souhaitez insérer l’extrait de code, puis sélectionnez Insérer un extrait de code

Sélectionnez l’extrait de code approprié dans la liste, en cliquant dessus

Sélectionnez l’extrait de code approprié dans la liste en cliquant dessus