Freigeben über


Erstellen eines neuen ASP.NET MVC-Projekts

von Microsoft

PDF herunterladen

Dies ist Schritt 1 eines kostenlosen "NerdDinner"-Anwendungstutorial , das das Erstellen einer kleinen, aber vollständigen Webanwendung mit ASP.NET MVC 1 exemplarische Schritte durchläuft.

Schritt 1 zeigt, wie Sie die grundlegende NerdDinner-Anwendungsstruktur einrichten.

Wenn Sie ASP.NET MVC 3 verwenden, empfiehlt es sich, die Tutorials Erste Schritte Mit MVC 3 oder MVC Music Store zu befolgen.

NerdDinner Schritt 1: Dateineues> Projekt

Wir beginnen unsere NerdDinner-Anwendung, indem Sie entweder in Visual Studio 2008 oder im kostenlosen Visual Web Developer 2008 Express das Menüelement Datei-Neues> Projekt auswählen.

Dadurch wird das Dialogfeld "Neues Projekt" geöffnet. Um eine neue ASP.NET MVC-Anwendung zu erstellen, wählen Wir den Knoten "Web" auf der linken Seite des Dialogfelds und dann die Projektvorlage "ASP.NET MVC-Webanwendung" auf der rechten Seite aus:

Screenshot des Dialogfelds

Wichtig: Stellen Sie sicher, dass Sie ASP.NET MVC heruntergeladen und installiert haben. Andernfalls wird es nicht im Dialogfeld Neues Projekt angezeigt. Sie können V2 des Microsoft-Webplattform-Installer verwenden, wenn Sie sie noch nicht installiert haben (ASP.NET MVC im Abschnitt "Web Platform-Frameworks> and Runtimes" verfügbar ist).

Wir nennen das neue Projekt, das wir erstellen, "NerdDinner" und klicken dann auf die Schaltfläche "OK", um es zu erstellen.

Wenn Wir auf "OK" klicken, wird von Visual Studio ein zusätzliches Dialogfeld geöffnet, in dem wir aufgefordert werden, optional auch ein Komponententestprojekt für die neue Anwendung zu erstellen. Dieses Komponententestprojekt ermöglicht es uns, automatisierte Tests zu erstellen, mit denen die Funktionalität und das Verhalten unserer Anwendung überprüft werden (was wir später in diesem Tutorial behandeln werden).

Screenshot des Dialogfelds

Die Dropdownliste "Framework testen" im obigen Dialogfeld wird mit allen verfügbaren ASP.NET MVC-Komponententestprojektvorlagen gefüllt, die auf dem Computer installiert sind. Versionen können für NUnit, MBUnit und XUnit heruntergeladen werden. Das integrierte Visual Studio Unit Test-Framework wird ebenfalls unterstützt.

Hinweis: Das Visual Studio Unit Test Framework ist nur mit Visual Studio 2008 Professional und höheren Versionen verfügbar. Wenn Sie VS 2008 Standard Edition oder Visual Web Developer 2008 Express verwenden, müssen Sie die Erweiterungen NUnit, MBUnit oder XUnit für ASP.NET MVC herunterladen und installieren, damit dieses Dialogfeld angezeigt wird. Das Dialogfeld wird nicht angezeigt, wenn keine Testframeworks installiert sind.

Wir verwenden den Standardnamen "NerdDinner.Tests" für das von uns erstellte Testprojekt und die Frameworkoption "Visual Studio Unit Test". Wenn wir auf die Schaltfläche "OK" klicken, erstellt Visual Studio für uns eine Projektmappe mit zwei Projekten – eines für unsere Webanwendung und eines für unsere Komponententests:

Screenshot des Dialogfelds

Untersuchen der NerdDinner-Verzeichnisstruktur

Wenn Sie eine neue ASP.NET MVC-Anwendung mit Visual Studio erstellen, werden dem Projekt automatisch eine Reihe von Dateien und Verzeichnissen hinzugefügt:

Screenshot der Navigationsstruktur

ASP.NET MVC-Projekte verfügen standardmäßig über sechs Verzeichnisse der obersten Ebene:

Verzeichnis Zweck
/Controller Wo Sie Controllerklassen platzieren, die URL-Anforderungen verarbeiten
/Modelle Wo Sie Klassen platzieren, die Daten darstellen und bearbeiten
/Ansichten Speicherort für Benutzeroberflächenvorlagendateien, die für das Rendern der Ausgabe verantwortlich sind
/Skripts Speicherort für JavaScript-Bibliotheksdateien und -skripts (.js)
/Inhalt Speicherort für CSS- und Bilddateien sowie andere nicht dynamische/nicht-JavaScript-Inhalte
/App_data Wo Sie Datendateien speichern, die Sie lesen/schreiben möchten.

ASP.NET MVC erfordert diese Struktur nicht. In der Tat partitionieren Entwickler, die an großen Anwendungen arbeiten, die Anwendung in der Regel über mehrere Projekte hinweg, um sie besser zu verwalten (z. B. Datenmodellklassen werden häufig in einem separaten Klassenbibliotheksprojekt von der Webanwendung verwendet). Die Standardprojektstruktur bietet jedoch eine schöne Standardverzeichniskonvention, die wir verwenden können, um die Anwendungsaspekte sauber zu halten.

Wenn wir das Verzeichnis /Controller erweitern, stellen wir fest, dass Visual Studio dem Projekt standardmäßig zwei Controllerklassen hinzugefügt hat: HomeController und AccountController:

Screenshot der Navigationsstruktur

Wenn wir das Verzeichnis /Views erweitern, finden Wir drei Unterverzeichnisse – /Home, /Account und /Shared – sowie mehrere Vorlagendateien, die dem Projekt standardmäßig hinzugefügt wurden:

Screenshot der Navigationsstruktur

Wenn wir die Verzeichnisse /Content und /Scripts erweitern, finden Wir eine Site.css-Datei, die zum Formatieren des gesamten HTML-Codes auf der Website verwendet wird, sowie JavaScript-Bibliotheken, die ASP.NET AJAX- und jQuery-Unterstützung innerhalb der Anwendung aktivieren können:

Screenshot: Navigationsstruktur Projektmappen-Explorer Nerd Dinner Nerd Dinner ist hervorgehoben und erweitert.

Wenn wir das Projekt NerdDinner.Tests erweitern, finden wir zwei Klassen, die Komponententests für unsere Controllerklassen enthalten:

Screenshot der Projektmappen-Explorer Navigationsstruktur Controller werden ausgewählt und erweitert.

Diese von Visual Studio hinzugefügten Standarddateien bieten uns eine grundlegende Struktur für eine funktionierende Anwendung – komplett mit Startseite, Infoseite, Anmelde-/Abmelde-/Registrierungsseiten für Konten und einer nicht behandelten Fehlerseite (alle kabelgebunden und sofort einsatzbereit).

Ausführen der NerdDinner-Anwendung

Wir können das Projekt ausführen, indem Sie entweder die Menüelemente Debuggen-Starten> von Debuggen oder Debuggen-Start> ohne Debuggen auswählen:

Screenshot von Microsoft Visual Studio. Die Menüelemente Debuggen werden angezeigt. Debuggen starten ist hervorgehoben.

Dadurch wird der integrierte ASP.NET-Webserver gestartet, der in Visual Studio enthalten ist, und die Anwendung wird ausgeführt:

Screenshot der Seite

Im Folgenden finden Sie die Startseite für unser neues Projekt (URL: "/"), wenn es ausgeführt wird:

Screenshot der Willkommensseite

Wenn Sie auf die Registerkarte "Info" klicken, wird eine Infoseite angezeigt (URL: "/Home/About"):

Screenshot der Seite

Wenn Sie oben rechts auf den Link "Anmelden" klicken, gelangen Sie zu einer Anmeldeseite (URL: "/Konto/LogOn")

Screenshot der Anmeldeseite

Wenn wir kein Anmeldekonto haben, können wir auf den Registrierungslink (URL: "/Konto/Registrierung") klicken, um ein Konto zu erstellen:

Screenshot der Seite

Der Code zum Implementieren der oben genannten Home-, About- und Abmelde-/Registrierungsfunktionen wurde standardmäßig hinzugefügt, als wir unser neues Projekt erstellt haben. Wir verwenden sie als Ausgangspunkt unserer Anwendung.

Testen der NerdDinner-Anwendung

Wenn wir die Professional Edition oder eine höhere Version von Visual Studio 2008 verwenden, können wir die integrierte Komponententest-IDE-Unterstützung in Visual Studio verwenden, um das Projekt zu testen:

Screenshot der Menüelemente

Wenn Sie eine der oben genannten Optionen auswählen, wird der Bereich "Testergebnisse" innerhalb der IDE geöffnet und uns status für die 27 Komponententests in unserem neuen Projekt bereitgestellt, die die integrierte Funktionalität abdecken:

Screenshot des Bereichs

Weiter unten in diesem Tutorial werden wir mehr über automatisierte Tests sprechen und zusätzliche Komponententests hinzufügen, die die von uns implementierten Anwendungsfunktionen abdecken.

Nächster Schritt

Wir haben jetzt eine grundlegende Anwendungsstruktur eingerichtet. Nun erstellen wir eine Datenbank zum Speichern unserer Anwendungsdaten.