ASP.NET MVC 4 – Gerüstbau und Migrationen mit dem Entity Framework

Nach Web Camps Team

Download Web Camps Training Kit

Wenn Sie mit ASP.NET MVC 4-Controllermethoden vertraut sind oder die Praktische Übung "Helpers, Forms and Validation" abgeschlossen haben, sollten Sie sich bewusst sein, dass ein Großteil der Logik zum Erstellen, Aktualisieren, Auflisten und Entfernen aller Datenentität in der gesamten Anwendung wiederholt wird. Nicht zu erwähnen: Wenn Ihr Modell mehrere Klassen zu bearbeiten hat, verbringen Sie wahrscheinlich eine beträchtliche Zeit mit dem Schreiben der POST- und GET-Aktionsmethoden für jeden Entitätsvorgang sowie jeder der Ansichten.

In dieser Übung erfahren Sie, wie Sie das ASP.NET MVC 4-Gerüst verwenden, um automatisch den Basisplan der CRUD Ihrer Anwendung zu generieren (Erstellen, Lesen, Aktualisieren und Löschen). Beginnend mit einer einfachen Modellklasse und, ohne eine einzelne Codezeile zu schreiben, erstellen Sie einen Controller, der alle CRUD-Vorgänge sowie alle erforderlichen Ansichten enthält. Nachdem Sie die einfache Lösung erstellt und ausgeführt haben, wird die Anwendungsdatenbank zusammen mit der MVC-Logik und -Ansichten für die Datenmanipulation generiert.

Darüber hinaus erfahren Sie, wie einfach es ist, Entity Framework-Migrationen zum Ausführen von Modellupdates in der gesamten Anwendung zu verwenden. Mit Entity Framework-Migrationen können Sie Ihre Datenbank ändern, nachdem sich das Modell mit einfachen Schritten geändert hat. All diese Punkte werden Sie in der Lage sein, Webanwendungen effizienter zu erstellen und zu verwalten, indem Sie die neuesten Features von ASP.NET MVC 4 nutzen.

Hinweis

Alle Beispielcode und Codeausschnitte sind im Web Camps Training Kit enthalten, das unter Microsoft-Web/WebCampTrainingKit Releases verfügbar ist. Das für dieses Lab spezifische Projekt ist unter ASP.NET MVC 4 Entity Framework Scaffolding und Migrationen verfügbar.

Ziele

In dieser praktischen Übung erfahren Sie, wie Sie:

• Verwenden Sie ASP.NET Gerüst für CRUD-Vorgänge in Controllern.
• Ändern Sie das Datenbankmodell mithilfe von Entity Framework-Migrationen.

Voraussetzungen

Sie müssen über die folgenden Elemente verfügen, um diese Übung abzuschließen:

• Microsoft Visual Studio Express 2012 für Web oder höher (lesen Sie Anhang A , um Anweisungen zur Installation zu erhalten).

Setup

Installieren von Codeausschnitten

Aus Gründen der Einfachheit ist ein Großteil des Codes, den Sie entlang dieser Übung verwalten, als Visual Studio-Codeausschnitte verfügbar. Führen Sie zum Installieren der Codeausschnitte die Datei ".\Source\Setup\CodeSnippets.vsi " aus.

Wenn Sie mit den Visual Studio Code Snippets nicht vertraut sind und erfahren möchten, wie Sie sie verwenden können, finden Sie in diesem Dokument den Anhang "Anhang B: Verwenden von Codeausschnitten".

---

Übungen

Die folgende Übung besteht aus diesem praktischen Übungslabor:

1. Verwenden von ASP.NET MVC 4-Gerüst mit Entity Framework-Migrationen

Hinweis

Diese Übung wird von einem Endordner mit der resultierenden Lösung begleitet, die Sie nach Abschluss der Übung erhalten sollten. Sie können diese Lösung als Leitfaden verwenden, wenn Sie zusätzliche Hilfe beim Durcharbeiten der Übung benötigen.

Geschätzte Zeit zum Abschließen dieser Übung: 30 Minuten

Übung 1: Verwenden von ASP.NET MVC 4-Gerüst mit Entity Framework-Migrationen

ASP.NET MVC-Gerüst bietet eine schnelle Möglichkeit zum Generieren der CRUD-Vorgänge auf standardisierte Weise, wodurch die erforderliche Logik erstellt wird, mit der Ihre Anwendung mit der Datenbankebene interagieren kann.

In dieser Übung erfahren Sie, wie Sie zunächst ASP.NET MVC 4-Gerüst mit Code verwenden, um die CRUD-Methoden zu erstellen. Anschließend erfahren Sie, wie Sie Ihr Modell aktualisieren, indem Sie Entity Framework-Migrationen verwenden, um die Änderungen in der Datenbank anzuwenden.

Aufgabe 1: Erstellen eines neuen ASP.NET MVC 4-Projekts mithilfe von Gerüsten

1. Wenn noch nicht geöffnet, starten Sie Visual Studio 2012.

2. Datei auswählen | Neues Projekt. Im Dialogfeld "Neues Projekt" unter Visual C# | Wählen Sie im Webabschnitt ASP.NET MVC 4-Webanwendung aus. Benennen Sie das Projekt in MVC4andEFMigrations , und legen Sie den Speicherort auf "Source\Ex1-UsingMVC4ScaffoldingEFMigrations"-Ordner dieses Labors fest. Legen Sie den Projektmappennamen auf " Beginnen " fest, und stellen Sie sicher, dass das Verzeichnis für die Lösung erstellt wurde. Klicken Sie auf OK.

   

   Neues ASP.NET MVC 4-Projektdialogfeld

3. Wählen Sie im Dialogfeld "Neues ASP.NET MVC 4-Projekt " die Internetanwendungsvorlage aus, und stellen Sie sicher, dass Razor das ausgewählte Ansichtsmodul ist. Klicken Sie auf OK, um das Projekt zu erstellen.

   

   Neue ASP.NET MVC 4-Internetanwendung

4. Klicken Sie im Projektmappen-Explorer mit der rechten Maustaste auf "Modelle", und wählen Sie "Hinzufügen" | aus. Klasse zum Erstellen einer einfachen Kursperson (POCO). Benennen Sie die Person , und klicken Sie auf "OK".

5. Öffnen Sie die Person-Klasse, und fügen Sie die folgenden Eigenschaften ein.

   (Codeausschnitt - ASP.NET MVC 4- und Entity Framework-Migrationen – Ex1-Personeneigenschaften)

   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; }        
       }
   }
   

6. Klicken Sie auf Build | Erstellen Sie die Projektmappe , um die Änderungen zu speichern und das Projekt zu erstellen.

   

   Erstellen der Anwendung

7. Klicken Sie im Projektmappen-Explorer mit der rechten Maustaste auf den Ordner "Controller", und wählen Sie "Hinzufügen" | aus. Controller.

8. Benennen Sie den Controller PersonController , und schließen Sie die Gerüstoptionen mit den folgenden Werten ab.

   1. Wählen Sie in der Dropdownliste "Vorlage " den MVC-Controller mit Lese-/Schreibzugriffsaktionen und -ansichten mithilfe der Option "Entity Framework " aus.

   2. Wählen Sie in der Dropdownliste " Modellklasse " die Klasse "Person " aus.

   3. Wählen Sie in der Liste der Datenkontextklassen den< Eintrag "Neuer Datenkontext" aus.> Wählen Sie einen beliebigen Namen aus, und klicken Sie auf "OK".

   4. Stellen Sie in der Dropdownliste "Ansichten" sicher, dass Razor ausgewählt ist.

      

      Hinzufügen des Personencontrollers mit Gerüst

9. Klicken Sie auf "Hinzufügen" , um den neuen Controller für "Person" mit Gerüst zu erstellen. Sie haben nun die Controlleraktionen sowie die Ansichten generiert.

   

   Nach dem Erstellen des Personencontrollers mit Gerüst

10. Öffnen Sie die PersonController-Klasse . Beachten Sie, dass die vollständigen CRUD-Aktionsmethoden automatisch generiert wurden.

Innerhalb des Personencontrollers

Aufgabe 2: Ausführen der Anwendung

Zu diesem Zeitpunkt wird die Datenbank noch nicht erstellt. In dieser Aufgabe führen Sie die Anwendung zum ersten Mal aus und testen die CRUD-Vorgänge. Die Datenbank wird automatisch mit Code First erstellt.

1. Drücken Sie F5, um die Anwendung auszuführen.

2. Fügen Sie im Browser "/Person" zur URL hinzu, um die Seite "Person " zu öffnen.

   

   Anwendung: Erste Ausführung

3. Sie werden nun die Personenseiten erkunden und die CRUD-Vorgänge testen.

   1. Klicken Sie auf " Neu erstellen", um eine neue Person hinzuzufügen. Geben Sie einen Vornamen und einen Nachnamen ein, und klicken Sie auf " Erstellen".

      

      Hinzufügen einer neuen Person

   2. In der Liste der Person können Sie Elemente löschen, bearbeiten oder hinzufügen.

      

      Personenliste

   3. Klicken Sie auf "Details ", um die Details der Person zu öffnen.

      

      Details der Person

4. Schließen Sie den Browser und kehren Sie zu Visual Studio zurück. Beachten Sie, dass Sie die gesamte CRUD für die Personenentität in der gesamten Anwendung erstellt haben – vom Modell bis zu den Ansichten - ohne eine einzelne Codezeile schreiben zu müssen!

Aufgabe 3: Aktualisieren der Datenbank mithilfe von Entity Framework-Migrationen

In dieser Aufgabe aktualisieren Sie die Datenbank mithilfe von Entity Framework-Migrationen. Sie erfahren, wie einfach es ist, das Modell zu ändern und die Änderungen in Ihren Datenbanken mithilfe des Entity Framework-Migrationsfeatures widerzuspiegeln.

1. Öffnen Sie die Paket-Manager-Konsole. Klicken Sie auf Extras>NuGet-Paket-Manager>Paket-Manager-Konsole.

2. Geben Sie in der Paket-Manager-Konsole den folgenden Befehl ein:

   PMC

   Enable-Migrations -ContextTypeName [ContextClassName]
   

   

   Aktivieren von Migrationen

   Der Befehl "Migration aktivieren" erstellt den Ordner "Migrationen ", der ein Skript zum Initialisieren der Datenbank enthält.

   

   Migrationsordner

3. Öffnen Sie die datei Configuration.cs im Ordner "Migrationen". Suchen Sie den Klassenkonstruktor, und ändern Sie den Wert "AutomaticMigrationsEnabled " in "true".

   public Configuration()
   {
       AutomaticMigrationsEnabled = true;
   }
   

4. Öffnen Sie die Person-Klasse, und fügen Sie ein Attribut für den zweiten Namen der Person hinzu. Mit diesem neuen Attribut ändern Sie das Modell.

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

5. Build auswählen | Erstellen Sie die Projektmappe im Menü, um die Anwendung zu erstellen.

   

   Erstellen der Anwendung

6. Geben Sie in der Paket-Manager-Konsole den folgenden Befehl ein:

   PMC

   Add-Migration AddMiddleName
   

   Dieser Befehl sucht nach Änderungen in den Datenobjekten und fügt dann die erforderlichen Befehle hinzu, um die Datenbank entsprechend zu ändern.

   

   Hinzufügen eines zweiten Vornamens

7. (Optional) Sie können den folgenden Befehl ausführen, um ein SQL-Skript mit der differenziellen Aktualisierung zu generieren. Auf diese Weise können Sie die Datenbank manuell aktualisieren (in diesem Fall ist es nicht erforderlich), oder die Änderungen in anderen Datenbanken anwenden:

   PMC

   Update-Database -Script -SourceMigration:
   
   $InitialDatabase
   

   

   Generieren eines SQL-Skripts

   

   SQL-Skriptaktualisierung

8. Geben Sie in der Paket-Manager-Konsole den folgenden Befehl ein, um die Datenbank zu aktualisieren:

   PMC

   Update-Database -Verbose
   

   

   Aktualisieren der Datenbank

   Dadurch wird die Spalte "MiddleName " in der Tabelle "Personen " hinzugefügt, um der aktuellen Definition der Person-Klasse zu entsprechen.

9. Nachdem die Datenbank aktualisiert wurde, klicken Sie mit der rechten Maustaste auf den Ordner "Controller", und wählen Sie "Hinzufügen" | aus. Controller zum erneuten Hinzufügen des Personencontrollers (Vollständig mit denselben Werten). Dadurch werden die vorhandenen Methoden und Ansichten aktualisiert, die das neue Attribut hinzufügen.

   

   Aktualisieren des Controllers

10. Klicken Sie auf Hinzufügen. Wählen Sie dann die Werte "Überschreiben" aus, PersonController.cs und die zugeordneten Ansichten überschreiben, und klicken Sie auf "OK".

Aktualisieren des Controllers

Task4: Ausführen der Anwendung

1. Drücken Sie F5, um die Anwendung auszuführen.

2. Öffnen Sie /Person. Beachten Sie, dass die Daten beibehalten wurden, während die Spalte mit dem zweiten Namen hinzugefügt wurde.

   

   Zweiter Vorname hinzugefügt

3. Wenn Sie auf "Bearbeiten" klicken, können Sie der aktuellen Person einen zweiten Namen hinzufügen.

   

---

Zusammenfassung

In dieser praktischen Übung haben Sie einfache Schritte zum Erstellen von CRUD-Vorgängen mit ASP.NET MVC 4 Scaffolding mithilfe einer beliebigen Modellklasse gelernt. Anschließend haben Sie gelernt, wie Sie mithilfe von Entity Framework-Migrationen eine End-to-End-Aktualisierung in Ihrer Anwendung durchführen – von der Datenbank bis zu den Ansichten.

Anhang A: Installieren von Visual Studio Express 2012 für Web

Sie können Microsoft Visual Studio Express 2012 für Web oder eine andere "Express"-Version mit dem Microsoft-Webplattform Installer installieren. Die folgenden Anweisungen führen Sie durch die Schritte, die zum Installieren von Visual Studio Express 2012 für Web mit Microsoft-Webplattform Installer erforderlich sind.

1. Wechseln Sie zu https://learn.microsoft.com/iis/extensions/introduction-to-iis-express/iis-express-overview?linkid=9810169. Wenn Sie das Webplattform-Installationsprogramm bereits installiert haben, können Sie es öffnen und nach dem Produkt "Visual Studio Express 2012 for Web with Windows Azure SDK" suchen.

2. Klicken Sie auf "Jetzt installieren". Wenn Sie nicht über das Webplattform-Installationsprogramm verfügen, werden Sie umgeleitet, um es zuerst herunterzuladen und zu installieren.

3. Klicken Sie nach dem Öffnen des Webplattform-Installers auf "Installieren ", um das Setup zu starten.

   

   Installieren von Visual Studio Express

4. Lesen Sie alle Lizenzen und Bedingungen der Produkte, und klicken Sie auf "Ich stimme zu", um den Vorgang fortzusetzen.

   

   Akzeptieren der Lizenzbedingungen

5. Warten Sie, bis der Download- und Installationsprozess abgeschlossen ist.

   

   Installationsfortschritt

6. Wenn die Installation abgeschlossen ist, klicken Sie auf "Fertig stellen".

   

   Installation abgeschlossen

7. Klicken Sie auf "Beenden ", um den Webplattform-Installer zu schließen.

8. Um Visual Studio Express für Web zu öffnen, wechseln Sie zum Startbildschirm, und beginnen Sie mit dem Schreiben von "VS Express", und klicken Sie dann auf die VS Express für Webkachel.

   

   VS Express für Webkachel

Anhang B: Verwenden von Codeausschnitten

Mit Codeausschnitten verfügen Sie über den gesamten Code, den Sie benötigen, jederzeit. Das Lab-Dokument teilt Ihnen genau mit, wann Sie sie verwenden können, wie in der folgenden Abbildung dargestellt.

Verwenden von Visual Studio-Codeausschnitten zum Einfügen von Code in Ihr Projekt

So fügen Sie einen Codeausschnitt mithilfe der Tastatur hinzu (nur C#)

1. Platzieren Sie den Cursor an der Stelle, an der Sie den Code einfügen möchten.
2. Beginnen Sie mit der Eingabe des Codeausschnittnamens (ohne Leerzeichen oder Bindestriche).
3. Sehen Sie sich an, wie IntelliSense übereinstimmende Codeausschnittnamen anzeigt.
4. Wählen Sie den richtigen Codeausschnitt aus (oder halten Sie die Eingabe, bis der Name des gesamten Codeausschnitts ausgewählt ist).
5. Drücken Sie zweimal die TAB-TASTE, um den Codeausschnitt an der Cursorposition einzufügen.

Beginnen Sie mit der Eingabe des Codeausschnittnamens.

Drücken Sie die TAB-TASTE, um den hervorgehobenen Codeausschnitt auszuwählen.

Drücken Sie erneut die TAB-TASTE, und der Codeausschnitt wird erweitert.

So fügen Sie einen Codeausschnitt mit der Maus (C#, Visual Basic und XML) 1 hinzu. Klicken Sie mit der rechten Maustaste auf die Stelle, an der Sie den Codeausschnitt einfügen möchten.

1. Wählen Sie "Codeausschnitt einfügen" gefolgt von "Codeausschnitte" aus.
2. Wählen Sie den relevanten Codeausschnitt aus der Liste aus, indem Sie darauf klicken.

Klicken Sie mit der rechten Maustaste auf die Stelle, an der Sie den Codeausschnitt einfügen möchten, und wählen Sie "Codeausschnitt einfügen" aus.

Wählen Sie den relevanten Codeausschnitt aus der Liste aus, indem Sie darauf klicken.