Delen via


Inleiding tot ASP.NET MVC 4

door Rick Anderson

Een bijgewerkte versie van deze zelfstudie is hier beschikbaar met Visual Studio 2013. In de nieuwe zelfstudie wordt gebruikgemaakt van ASP.NET MVC 5. Dit biedt veel verbeteringen in deze zelfstudie.

In deze zelfstudie leert u de basisbeginselen van het bouwen van een ASP.NET MVC 4-webtoepassing met behulp van Microsoft Visual Studio Express 2012 of Visual Web Developer 2010 Express Service Pack 1. Visual Studio 2012 wordt aanbevolen. U hoeft niets te installeren om de zelfstudie te voltooien. Als u Visual Studio 2010 gebruikt, moet u de onderstaande onderdelen installeren. U kunt ze allemaal installeren door op de volgende koppelingen te klikken:

Als u Visual Studio 2010 gebruikt in plaats van Visual Web Developer 2010, installeert u het WPI-installatieprogramma voor ASP.NET MVC 4 en de volgende vereisten voor Visual Studio 2010

Er is een Visual Web Developer-project met C#-broncode beschikbaar voor dit onderwerp. Download de C#-versie.

In de zelfstudie voert u de toepassing uit in Visual Studio. U kunt de toepassing ook beschikbaar maken via internet door deze te implementeren naar een hostingprovider. Microsoft biedt gratis webhosting voor maximaal 10 websites in een gratis Windows Azure-proefaccount. Zie Een ASP.NET website en SQL Database maken en implementeren met Visual Studio voor meer informatie over het implementeren van een Visual Studio-webproject op een Windows Azure-website. Deze zelfstudie laat ook zien hoe u Entity Framework Code First Migrations gebruikt om uw SQL Server-database te implementeren in Windows Azure SQL Database (voorheen SQL Azure).

Deze handleiding is geschreven door Rick Anderson ( @RickAndMSFT ).

Wat je gaat bouwen

Opmerking

Een bijgewerkte versie als deze zelfstudie hier beschikbaar is met Visual Studio 2013. In de nieuwe zelfstudie wordt gebruikgemaakt van ASP.NET MVC 5. Dit biedt veel verbeteringen in deze zelfstudie.

U implementeert een eenvoudige toepassing voor filmvermeldingen die ondersteuning biedt voor het maken, bewerken, zoeken en weergeven van films uit een database. Hieronder ziet u twee schermopnamen van de toepassing die u gaat bouwen. Het bevat een pagina met een lijst met films uit een database:

Schermopname van de zoekindexpagina van de MVC Movie-app. Ghost wordt ingevoerd in de Titelzoekbalk.

Met de toepassing kunt u ook films toevoegen, bewerken en verwijderen, evenals details over afzonderlijke films bekijken. Alle scenario's voor gegevensinvoer omvatten validatie om ervoor te zorgen dat de gegevens die zijn opgeslagen in de database juist zijn.

Schermopname van de pagina Bewerken van de M V C Movie-app. Er zijn twee tekstvelden, Releasedatum en Prijs, gemarkeerd, waarin de gebruiker wordt gevraagd de juiste waarden in te voeren.

Aan de slag komen

Begin met het uitvoeren van Visual Studio Express 2012 of Visual Web Developer 2010 Express. De meeste schermafbeeldingen in deze reeks gebruiken Visual Studio Express 2012, maar u kunt deze zelfstudie voltooien met Visual Studio 2010/SP1, Visual Studio 2012, Visual Studio Express 2012 of Visual Web Developer 2010 Express. Selecteer Nieuw project op de startpagina .

Visual Studio is een IDE of een geïntegreerde ontwikkelomgeving. Net zoals u Microsoft Word gebruikt om documenten te schrijven, gebruikt u een IDE om toepassingen te maken. In Visual Studio ziet u bovenaan een werkbalk met verschillende opties die voor u beschikbaar zijn. Er is ook een menu dat een andere manier biedt om taken uit te voeren in de IDE. (In plaats van Nieuw project te selecteren op de startpagina, kunt u het menu gebruiken en Bestand> selecterenNieuw project.)

Schermopname van de startpagina van Visual Studio Express. De optie Nieuw project is gemarkeerd.

Uw eerste toepassing maken

U kunt toepassingen maken met Visual Basic of Visual C# als programmeertaal. Selecteer Visual C# aan de linkerkant en selecteer vervolgens ASP.NET MVC 4-webtoepassing. Geef uw project de naam 'MvcMovie' en klik op OK.

Schermopname van het venster Nieuw project. Er is een S P dot NET M V C 4-webtoepassing geselecteerd.

Selecteer Internettoepassing in het dialoogvenster Nieuw ASP.NET MVC 4-project. Laat Razor staan als de standaardweergave-engine.

Schermopname van het venster New A S P dot NET M V C 4 Project. De sjabloon Internettoepassing is geselecteerd.

Klik op OK. Visual Studio heeft een standaardsjabloon gebruikt voor het ASP.NET MVC-project dat u zojuist hebt gemaakt, zodat u nu een werkende toepassing hebt zonder iets te doen. Dit is een eenvoudig 'Hallo wereld!'-project en het is een goede plek om uw toepassing te starten.

Schermopname die laat zien dat de tabbladen A S P dot NET M V C Project Home Controller c s en Solution Explorer geopend zijn.

Vanuit het menu Foutopsporing, selecteer Foutopsporing starten.

Schermopname van het vervolgkeuzemenu A S P dot NET M V C-project DEBUG. De optie Foutopsporing starten is geselecteerd.

U ziet dat de sneltoets voor het starten van foutopsporing F5 is.

F5 zorgt ervoor dat Visual Studio IIS Express start en uw webtoepassing uitvoert. Visual Studio start vervolgens een browser en opent de startpagina van de toepassing. U ziet dat de adresbalk van de browser zegt localhost en niet iets als example.com. Dat komt omdat localhost altijd verwijst naar uw eigen lokale computer, die in dit geval de toepassing uitvoert die u zojuist hebt gemaakt. Wanneer Visual Studio een webproject uitvoert, wordt er een willekeurige poort gebruikt voor de webserver. In de onderstaande afbeelding is het poortnummer 41788. Wanneer u de toepassing uitvoert, ziet u waarschijnlijk een ander poortnummer.

Schermopname van de startpagina van de M V C Movie.

Deze standaardsjabloon bevat direct de pagina's Start, Contact en Info. Het biedt ook ondersteuning voor het registreren en aanmelden, en koppelingen naar Facebook en Twitter. De volgende stap is het wijzigen van de werking van deze toepassing en een beetje leren over ASP.NET MVC. Sluit uw browser en we gaan wat code wijzigen.