Freigeben über


Erstellen des Projekts

von Erik Reitan

In dieser Tutorialreihe erfahren Sie die Grundlagen zum Erstellen einer ASP.NET Web Forms-Anwendung mit ASP.NET 4.5 und Microsoft Visual Studio Express 2013 für Web. Für diese Tutorialreihe steht ein Visual Studio 2013 Projekt mit C#-Quellcode zur Verfügung.

In diesem Tutorial erstellen, überprüfen und führen Sie das Standardprojekt in Visual Studio aus, sodass Sie sich mit den Features von ASP.NET vertraut machen können. Außerdem überprüfen Sie die Visual Studio-Umgebung.

Sie lernen Folgendes:

  • Erstellen eines neuen Web Forms-Projekts
  • Die Dateistruktur des Web Forms-Projekts.
  • Ausführen des Projekts in Visual Studio.
  • Die verschiedenen Features der Standardwebformularanwendung.
  • Einige Grundlagen zur Verwendung der Visual Studio-Umgebung.

Erstellen des Projekts

  1. Öffnen Sie Visual Studio.

  2. Wählen Sie in Visual Studio im Menü Datei die Option Neues Projekt aus.

    Erstellen des Menüelements Projekt – Neues Projekt

  3. Wählen Sie links die Gruppe Vorlagen ->Visual C# ->Webvorlagen aus.

  4. Wählen Sie die Vorlage ASP.NET Web Application in der mittleren Spalte aus.
    In dieser Tutorialreihe wird .NET Framework 4.5.2 verwendet.

  5. Nennen Sie Ihr Projekt WingtipToys , und wählen Sie die Schaltfläche OK aus.

    Dialogfeld

    Hinweis

    Der Name des Projekts in dieser Tutorialreihe lautet WingtipToys. Es wird empfohlen, diesen genauen Projektnamen zu verwenden, damit der in der Tutorialreihe bereitgestellte Code wie erwartet funktioniert.

  6. Klicken Sie auf die Schaltfläche Authentifizierung ändern. Wählen Sie Einzelne Benutzerkonten aus, und klicken Sie auf die Schaltfläche OK .

  7. Wählen Sie die Web Forms-Vorlage aus, und klicken Sie auf die Schaltfläche OK.

    Screenshot des Fensters

Die Erstellung des Projekts dauert einige Zeit. Wenn sie bereit ist, öffnen Sie die Seite Default.aspx .

Screenshot des Fensters Microsoft Visual Studio Express 2013 für Web, in dem die seite Default.aspx angezeigt wird.

Sie können zwischen Entwurfsansicht und Quellansicht wechseln, indem Sie unten im mittleren Fenster eine Option auswählen. Die Entwurfsansicht zeigt ASP.NET Webseiten, master Seiten, Inhaltsseiten, HTML-Seiten und Benutzersteuerelemente mithilfe einer Near-WYSIWYG-Ansicht an. In der Quellansicht wird das HTML-Markup für Ihre Webseite angezeigt, das Sie bearbeiten können.

Tipp

Grundlegendes zu ASP.NET Frameworks

Mit ASP.NET Web Forms können Sie dynamische Websites mit einem vertrauten ereignisgesteuerten Modell und Unterstützung für Ziehen und Ablegen erstellen. Mit einer Designoberfläche und Hunderten von Steuerelementen und Komponenten können Sie schnell und einfach komplexe und umfangreiche GUI-gesteuerte Websites mit Datenzugriff erstellen. Der Wingtip Toy Store basiert auf ASP.NET Web Forms, aber viele der Konzepte, die Sie in dieser Tutorialreihe lernen, gelten für alle ASP.NET.

ASP.NET bietet vier primäre Entwicklungsframeworks:

  • ASP.NET Web Forms
    Das Web Forms Framework richtet sich an Entwickler, die deklarative und steuerelementbasierte Programmierung bevorzugen, z. B. Microsoft Windows Forms (WinForms) und WPF/XAML/Silverlight. Es bietet ein WYSIWYG-Designer-basiertes Entwicklungsmodell, sodass es bei Entwicklern beliebt ist, die nach einer RAD-Umgebung (Rapid Application Development) für die Webentwicklung suchen. Wenn Sie noch nicht mit der Webprogrammierung vertraut sind und mit den herkömmlichen Microsoft RAD-Cliententwicklungstools vertraut sind (z. B. für Visual Basic und Visual C#), können Sie schnell eine Webanwendung erstellen, ohne Über Erfahrung mit HTML und JavaScript zu verfügen.
  • ASP.NET MVC
    ASP.NET MVC richtet sich an Entwickler, die an Mustern und Prinzipien wie testgesteuerte Entwicklung, Trennung von Bedenken, Inversion der Steuerung (IoC) und Abhängigkeitsinjektion (Dependency Injection, DI) interessiert sind. Dieses Framework unterstützt die Trennung der Geschäftslogikebene einer Webanwendung von ihrer Präsentationsebene.
  • ASP.NET-Webseiten 2
    ASP.NET Web Pages richtet sich an Entwickler, die eine einfache Webentwicklungsstory im Rahmen von PHP wünschen. Im Webseitenmodell erstellen Sie HTML-Seiten und fügen der Seite dann serverbasierten Code hinzu, um dynamisch zu steuern, wie dieses Markup gerendert wird. Webseiten sind speziell für ein einfaches Framework konzipiert, und es ist der einfachste Einstiegspunkt in ASP.NET für Personen, die HTML kennen, aber möglicherweise keine umfassende Programmiererfahrung haben - z. B. Studenten oder Hobbyisten. Es ist auch eine gute Möglichkeit für Webentwickler, die PHP oder ähnliche Frameworks kennen, ASP.NET zu verwenden.
  • ASP.NET Einzelseitenanwendung
    ASP.NET Single Page Application (SPA) hilft Ihnen beim Erstellen von Anwendungen, die wichtige clientseitige Interaktionen mit HTML 5, CSS 3 und JavaScript enthalten. Das ASP.NET and Web Tools 2012.2 Update enthält eine neue Vorlage zum Erstellen von Einzelseitenanwendungen mit knockout.js und ASP.NET-Web-API. Zusätzlich zur neuen SPA-Vorlage stehen auch neue von der Community erstellte SPA-Vorlagen zum Download zur Verfügung.

Zusätzlich zu den vier Standard Entwicklungsframeworks bietet ASP.NET auch zusätzliche Technologien, die wichtig sind, um sich bewusst zu sein und vertraut zu sein, aber nicht in dieser Tutorialreihe behandelt werden:

  • ASP.NET-Web-API : Ein Framework zum Erstellen von HTTP-Diensten, die eine breite Palette von Clients erreichen, einschließlich Browsern und mobilen Geräten.
  • ASP.NET SignalR : Eine Bibliothek, die die Entwicklung von Echtzeit-Webfunktionen vereinfacht.

Überprüfen des Projekts

In Visual Studio können Sie im fenster Projektmappen-Explorer Dateien für das Projekt verwalten. Sehen wir uns die Ordner an, die Ihrer Anwendung in Projektmappen-Explorer hinzugefügt wurden. Die Webanwendungsvorlage fügt eine grundlegende Ordnerstruktur hinzu:

Erstellen des Projekts – Projektmappen-Explorer

Visual Studio erstellt einige anfängliche Ordner und Dateien für Ihr Projekt. Die ersten Dateien, mit denen Sie später in diesem Tutorial arbeiten werden, sind die folgenden:

File Zweck
Default.aspx In der Regel wird die erste Seite angezeigt, wenn die Anwendung in einem Browser ausgeführt wird.
Site.Master Eine Seite, mit der Sie ein konsistentes Layout erstellen und das Standardverhalten für Seiten in Ihrer Anwendung verwenden können.
Global.asax Eine optionale Datei, die Code zum Reagieren auf Ereignisse auf Anwendungs- und Sitzungsebene enthält, die von ASP.NET oder von HTTP-Modulen ausgelöst werden.
Web.config Die Konfigurationsdaten für eine Anwendung.

Ausführen der Standardwebanwendung

Die Standardwebanwendung bietet eine umfassende Benutzeroberfläche, die auf integrierter Funktionalität und Unterstützung basiert. Ohne Änderungen am Standardprojekt web forms kann die Anwendung in Ihrem lokalen Webbrowser ausgeführt werden.

  1. Drücken Sie in Visual Studio die Taste F5 .
    Die Anwendung erstellt und wird in Ihrem Webbrowser angezeigt.

    Erstellen des Projekts – Standardseite

  2. Nachdem Sie die Überprüfung der ausgeführten Anwendung abgeschlossen haben, schließen Sie das Browserfenster.

In dieser Standardwebanwendung gibt es drei Standard Seiten: Default.aspx (Home), About.aspx und Contact.aspx. Jede dieser Seiten kann über die obere Navigationsleiste erreicht werden. Es gibt auch zwei zusätzliche Seiten im Ordner Konto, die Seite Register.aspx und Login.aspx Seite. Auf diesen beiden Seiten können Sie die Mitgliedschaftsfunktionen von ASP.NET verwenden, um Benutzeranmeldeinformationen zu erstellen, zu speichern und zu überprüfen.

ASP.NET Web Forms Hintergrund

ASP.NET Web Forms sind Seiten, die auf der Microsoft ASP.NET-Technologie basieren, in der Code, der auf dem Server ausgeführt wird, dynamisch die Ausgabe von Webseiten an den Browser oder das Clientgerät generiert. Eine ASP.NET Web Forms Seite rendert automatisch den richtigen browserkonformen HTML-Code für Features wie Stile, Layout usw. Web Forms sind mit allen Sprachen kompatibel, die von der .NET Common Language Runtime unterstützt werden, z. B. Microsoft Visual Basic und Microsoft Visual C#. Darüber hinaus basieren Web Forms auf dem Microsoft .NET Framework, das Vorteile wie eine verwaltete Umgebung, Typsicherheit und Vererbung bietet.

Wenn eine ASP.NET Web Forms Seite ausgeführt wird, durchläuft die Seite einen Lebenszyklus, in dem sie eine Reihe von Verarbeitungsschritten ausführt. Diese Schritte umfassen Initialisierung, Instanziieren von Steuerelementen, Wiederherstellen und Aufrechterhalten des Zustands, Ausführen von Ereignishandlercode und Rendering. Wenn Sie sich mit der Leistungsfähigkeit von ASP.NET Web Forms vertraut machen, ist es wichtig, dass Sie den ASP.NET Seitenlebenszyklus verstehen, damit Sie Code in der entsprechenden Lebenszyklusphase für die gewünschte Wirkung schreiben können.

Wenn ein Webserver eine Anforderung für eine Seite empfängt, findet er die Seite, verarbeitet sie, sendet sie an den Browser und verwirft dann alle Seiteninformationen. Wenn der Benutzer dieselbe Seite erneut anfordert, wiederholt der Server die gesamte Sequenz und verarbeitet die Seite von Grund auf neu. Anders ausgedrückt: Ein Server verfügt über keinen Speicher von Seiten, die verarbeitet wurden. Das ASP.NET Seitenframework übernimmt automatisch die Aufgabe, den Zustand Ihrer Seite und ihrer Steuerelemente beizubehalten, und bietet Ihnen explizite Möglichkeiten, den Status anwendungsspezifischer Informationen beizubehalten.

Tipp

Webanwendungsfeatures in der Web Forms-Anwendungsvorlage

Die Vorlage ASP.NET Web Forms-Anwendung bietet eine Vielzahl von integrierten Funktionen. Es bietet Ihnen nicht nur eine Home.aspx Seite, eine About.aspx Seite, eine Contact.aspx Seite, sondern enthält auch Mitgliedschaftsfunktionen, die Benutzer registrieren und ihre Anmeldeinformationen speichern, damit sie sich bei Ihrer Website anmelden können. Diese Übersicht enthält weitere Informationen zu einigen der Features, die in der Vorlage ASP.NET Web Forms-Anwendung enthalten sind und wie sie in der Wingtip Toys-Anwendung verwendet werden.

Mitgliedschaft

ASP.NET Identität speichert die Anmeldeinformationen Ihrer Benutzer in einer Datenbank, die von der Anwendung erstellt wurde. Wenn sich Ihre Benutzer anmelden, überprüft die Anwendung ihre Anmeldeinformationen, indem sie die Datenbank liest. Der Ordner "Konto " Ihres Projekts enthält die Dateien, die die verschiedenen Teile der Mitgliedschaft implementieren: Registrieren, Anmelden, Ändern eines Kennworts und Autorisieren des Zugriffs. Darüber hinaus unterstützt ASP.NET Web Forms OAuth und OpenID. Diese Authentifizierungserweiterungen ermöglichen es Benutzern, sich mit vorhandenen Anmeldeinformationen über Konten wie Facebook, Twitter, Windows Live und Google bei Ihrer Website anzumelden.

Erstellen des Projekts – Projektmappen-Explorer (ASP.NET Identität)

Standardmäßig erstellt die Vorlage eine Mitgliedschaftsdatenbank unter Verwendung eines Standarddatenbanknamens auf einer instance von SQL Server Express LocalDB, dem Entwicklungsdatenbankserver, der mit Visual Studio Express 2013 für Web enthalten ist.

SQL Server Express LocalDB

SQL Server Express LocalDB ist eine einfache Version von SQL Server, die viele Programmierbarkeitsfeatures einer SQL Server-Datenbank bietet. SQL Server Express LocalDB wird im Benutzermodus ausgeführt und verfügt über eine schnelle Installation ohne Konfiguration ohne Konfiguration, die eine kurze Liste der Installationsvoraussetzungen enthält. In Microsoft SQL Server kann jeder Datenbank- oder Transact-SQL-Code ohne Upgradeschritte von SQL Server Express LocalDB in SQL Server und SQL Azure verschoben werden. Daher kann SQL Server Express LocalDB als Entwicklerumgebung für Anwendungen für alle Editionen von SQL Server verwendet werden. SQL Server Express LocalDB ermöglicht Features wie gespeicherte Prozeduren, benutzerdefinierte Funktionen und Aggregate, .NET Framework Integration, räumliche Typen und andere, die in SQL Server Compact nicht verfügbar sind.

Masterseiten

Eine ASP.NET master Seite definiert eine konsistente Darstellung und ein konsistentes Verhalten für alle Seiten in Ihrer Anwendung. Das Layout der master Seite wird mit dem Inhalt einer einzelnen Inhaltsseite zusammengeführt, um die letzte Seite zu erzeugen, die dem Benutzer angezeigt wird. In der Wingtip Toys-Anwendung ändern Sie die Seite Site.master master so, dass alle Seiten der Wingtip Toys-Website dasselbe charakteristische Logo und dieselbe Navigationsleiste verwenden.

HTML5

Die Vorlage ASP.NET Web Forms-Anwendung unterstützt HTML5, die neueste Version der HTML-Markupsprache. HTML5 unterstützt neue Elemente und Funktionen, die das Erstellen von Websites erleichtern.

Modernizr

Für Browser, die HTML5 nicht unterstützen, können Sie Modernizr verwenden. Modernizr ist eine Open-Source-JavaScript-Bibliothek, die erkennen kann, ob ein Browser HTML5-Features unterstützt, und diese aktivieren kann, falls dies nicht der Fall ist. In der ASP.NET Web Forms-Anwendungsvorlage wird Modernizr als NuGet-Paket installiert.

Bootstrap

Die Visual Studio 2013 Projektvorlagen verwenden Bootstrap, ein von Twitter erstelltes Layout- und Designframework. Bootstrap verwendet CSS3, um ein reaktionsfähiges Design bereitzustellen, was bedeutet, dass Layouts dynamisch an unterschiedliche Browserfenstergrößen angepasst werden können. Sie können auch das Designfeature von Bootstrap verwenden, um eine einfache Änderung des Erscheinungsbilds der Anwendung zu bewirken. Standardmäßig enthält die ASP.NET-Webanwendungsvorlage in Visual Studio 2013 Bootstrap als NuGet-Paket.

NuGet-Pakete

Die ASP.NET Web Forms-Anwendungsvorlage enthält eine Reihe von NuGet-Paketen. Diese Pakete bieten komponentenweise Funktionen in Form von Open Source Bibliotheken und Tools. Es gibt eine Vielzahl von Paketen, mit denen Sie Ihre Anwendungen erstellen und testen können. Visual Studio vereinfacht das Hinzufügen, Entfernen und Aktualisieren von NuGet-Paketen. Entwickler können auch Pakete zu NuGet erstellen und hinzufügen.

Screenshot des Fensters

Wenn Sie ein Paket installieren, kopiert NuGet Dateien in Ihre Lösung und nimmt automatisch alle erforderlichen Änderungen vor, z. B. das Hinzufügen von Verweisen und das Ändern der Konfiguration, die Ihrer Webanwendung zugeordnet ist. Wenn Sie sich entscheiden, die Bibliothek zu entfernen, entfernt NuGet Dateien und kehrt alle änderungen in Ihrem Projekt zurück, sodass keine Unordnung mehr vorhanden ist. NuGet ist über das Menü Extras in Visual Studio verfügbar.

jQuery

jQuery ist eine schnelle und präzise JavaScript-Bibliothek, die html-Dokumentdurchläufe, Ereignisbehandlung, Animierung und Ajax-Interaktionen für eine schnelle Webentwicklung vereinfacht. Die jQuery JavaScript-Bibliothek ist in der Vorlage ASP.NET Web Forms-Anwendung als NuGet-Paket enthalten.

Unauffällige Validierung

Integrierte Validierungssteuerelemente wurden so konfiguriert, dass sie unauffälliges JavaScript für die clientseitige Validierungslogik verwenden. Dadurch wird die Menge der inline gerenderten JavaScript-Elemente im Seitenmarkup erheblich reduziert und die Gesamtseitengröße reduziert. Die unauffällige Überprüfung wird der vorlage ASP.NET Web Forms Anwendung global hinzugefügt, basierend auf der Einstellung im <appSettings-Element> der Web.config Datei im Stammverzeichnis der Anwendung.

Entity Framework Code First

Neben den Features in der ASP.NET Web Forms-Anwendungsvorlage verwendet die Wingtip Toys-Anwendung Entity Framework Code First, eine NuGet-Bibliothek, die codeorientierte Entwicklung ermöglicht, wenn Sie mit Daten arbeiten. Einfach ausgedrückt, erstellt es den Datenbankteil Ihrer Anwendung für Sie basierend auf dem von Ihnen geschriebenen Code. Mithilfe von Entity Framework können Sie Daten als stark typisierte Objekte abrufen und bearbeiten. Dadurch können Sie sich auf die Geschäftslogik in Ihrer Anwendung konzentrieren und nicht auf die Details des Datenzugriffs.

Weitere Informationen zu den installierten Bibliotheken und Paketen, die in der ASP.NET Web Forms-Vorlage enthalten sind, finden Sie in der Liste der installierten NuGet-Pakete. Erstellen Sie hierzu in Visual Studio ein neues Web Forms-Projekt, wählen Sie Tools>NuGet-Paket-Manager>NuGet-Pakete für Projektmappe verwalten und im Dialogfeld NuGet-Pakete verwalten die Option Installierte Pakete aus.

Touring Visual Studio

Zu den primären Fenstern in Visual Studio gehören die Projektmappen-Explorer, die Server-Explorer (Datenbank-Explorer in Express), das Eigenschaftenfenster, die Toolbox, die Symbolleiste und das Dokumentfenster.

Diagramm mit den primären Fenstern in Visual Studio.

Weitere Informationen zu Visual Studio finden Sie unter Visual Guide to Visual Web Developer.

Zusammenfassung

In diesem Tutorial haben Sie die Standardanwendung Web Forms erstellt, überprüft und ausgeführt. Sie haben die verschiedenen Features der Standardwebformularanwendung überprüft und einige Grundlagen zur Verwendung der Visual Studio-Umgebung kennengelernt. In den folgenden Tutorials erstellen Sie die Datenzugriffsebene.

Weitere Ressourcen

Vergleich von Webanwendungsprojekten und Websiteprojekten
ASP.NET Web Forms-Seiten – Übersicht