Skip to content

1. Inleiding

De PDF van dit document is beschikbaar |HIER|.

De voorbeelden in dit document zijn beschikbaar |HIER|.

We willen hier aan de hand van voorbeelden de belangrijke begrippen van ASP.NET MVC, een webframework, introduceren.NET, dat een raamwerk biedt voor het ontwikkelen van webapplicaties volgens het MVC-model (Model – View – Controller).

Om de voorbeelden in dit document te begrijpen, zijn er weinig voorkennisvereisten. Alleen basiskennis van de taal C# is nodig. Deze is te vinden in het document „Inleiding tot de taal C# bij URL [http://tahe.developpez.com/dotnet/csharp]“. Er wordt een casestudy aangeboden om de opgedane kennis in de praktijk te brengen op ASP.NET MVC. Hierbij wordt gebruikgemaakt van de ORM (Object Relational Mapper) Entity Framework. Dit ORM wordt beschreven in het document „Inleiding tot Entity Framework 5 Code First”, dat beschikbaar is op de URL [http://tahe.developpez.com/dotnet/ef5cf].

De verschillende voorbeelden uit dit document zijn beschikbaar op URL [HIER] in de vorm van een downloadbaar bestand zip.

Dit document is in veel opzichten onvolledig. Voor meer informatie over ASP.NET MVC kunt u de volgende bronnen raadplegen:

  • [ref1]: het boek „Pro ASP.NET MVC 4”, geschreven door Adam Freeman en uitgegeven door Apress. Het is een uitstekend boek. Als het gratis online en in het Frans beschikbaar zou zijn, zou dit document niet nodig zijn. Ik raad iedereen die daartoe in de gelegenheid is aan om zich met behulp van dit boek te verdiepen in ASP.NET MVC. De broncodes van de voorbeelden uit het boek zijn gratis beschikbaar op de URL [http://www.apress.com/9781430242369];
  • [ref2]: de website van het [http://www.asp.net/mvc]-framework. Daar vind je al het benodigde materiaal om jezelf de materie eigen te maken. Een Franse versie is beschikbaar op de URL [http://dotnet.developpez.com/mvc/];
  • de website van [developpez.com] gewijd aan ASP.NET [http://dotnet.developpez.com/aspnet/].

Het document is zo geschreven dat het ook zonder computer bij de hand kan worden gelezen. Daarom zijn er veel schermafbeeldingen opgenomen.

1.1. De rol van ASP.NET en MVC in een webapplicatie

Laten we allereerst de plaats van ASP.NET MVC binnen de ontwikkeling van een webapplicatie in kaart brengen. Meestal wordt deze gebouwd op basis van een meerlaagse architectuur, zoals de volgende:

  • De laag [Web] is de laag die in contact staat met de gebruiker van de webapplicatie. De gebruiker communiceert met de webapplicatie via webpagina’s die in een browser worden weergegeven. In deze laag bevinden zich ASP.NET en MVC, en uitsluitend in deze laag;
  • de laag [métier] implementeert de bedrijfsregels van de applicatie, zoals de berekening van een salaris of een factuur. Deze laag maakt gebruik van gegevens die afkomstig zijn van de gebruiker via de laag [Web] en van SGBD via de laag [DAO];
  • De laag [DAO] (Data Access Objects), de laag [ORM] (Object Relational Mapper) en de connector ADO.NET regelen de toegang tot de gegevens van de SGBD. De laag [ORM] vormt een brug tussen de objecten die door de laag [DAO] worden beheerd en de rijen en kolommen van de tabellen in een relationele database. Twee ORM-lagen worden wereldwijd veel gebruikt: NET, NHibernate (http://sourceforge.net/projects/nhibernate/) en Entity Framework (http://msdn.microsoft.com/en-us/data/ef.aspx);
  • de integratie van de lagen kan worden gerealiseerd door middel van een Dependency Injection Container zoals Spring (http://www.springframework.net/ );

De meeste voorbeelden die hierna worden gegeven, maken slechts gebruik van één laag, namelijk de laag [Web]:

Dit document wordt echter afgesloten met het bouwen van een meerlaagse webapplicatie:

1.2. Het ontwikkelingsmodel van ASP.NET MVC

ASP.NET MVC implementeert het zogenaamde MVC-architectuurmodel (Model – View – Controller) op de volgende manier:

De verwerking van een verzoek van een klant verloopt als volgt:

  1. verzoek – de aangevraagde URL hebben de vorm http://machine:port/contexte/Controlleur/Action/param1/param2/....?p1=v1&p2=v2&.... De [Front Controller] gebruikt een configuratiebestand om het verzoek door te sturen naar de juiste controller en de juiste actie binnen die controller. Hiervoor gebruikt hij het pad [Controlleur/Action] van de URL. De rest van de URL en [/param1/param2/...] zijn optionele parameters die naar de actie worden doorgestuurd. De C van MVC is hier de tekenreeks [Front Controller, Contrôleur, Action]. Als het pad [Controlleur/Action] niet leidt naar een bestaande controller of actie, zal de webserver antwoorden dat de gevraagde URL niet is gevonden.
  1. verwerking
  • De gekozen actie kan gebruikmaken van de parameters parami die de [Front Controller] aan haar heeft doorgegeven. Deze kunnen uit verschillende bronnen afkomstig zijn:
  • het pad [/param1/param2/...] van de URL,
  • de parameters [p1=v1&p2=v2] van de URL,
  • van parameters die door de browser bij het verzoek zijn meegestuurd;
  • bij de verwerking van het verzoek van de gebruiker kan de actie de laag [métier] [2b] nodig hebben. Zodra het verzoek van de klant is verwerkt, kan dit verschillende reacties oproepen. Een klassiek voorbeeld is:
  • een foutpagina als het verzoek niet correct kon worden verwerkt
  • een bevestigingspagina in het andere geval
  • de actie vraagt om een bepaalde weergave [3] weer te geven. Deze weergave toont gegevens die het model van de weergave worden genoemd. Dit is de M van MVC. De actie zal dit model M [2c] aanmaken en vragen om een weergave V weer te geven [3];
  1. antwoord – de gekozen weergave V gebruikt het door de actie opgebouwde model M om de dynamische delen van het antwoord HTML te initialiseren dat zij naar de client moet verzenden, en verstuurt vervolgens dit antwoord.

Laten we nu de relatie tussen webarchitectuur MVC en gelaagde architectuur verduidelijken. Afhankelijk van de definitie die men aan het model geeft, zijn deze twee concepten al dan niet met elkaar verbonden. Laten we een webapplicatie ASP.NET MVC met één laag nemen:

Als we de laag [Web] implementeren met ASP.NET en MVC, hebben we weliswaar een webarchitectuur MVC, maar geen meerlaagse architectuur. Hier zal de laag [Web] alles voor zijn rekening nemen: presentatie, bedrijfslogica, toegang tot gegevens. Het zijn de acties die dit werk zullen doen.

Laten we nu eens kijken naar een meerlaagse webarchitectuur:

De laag [Web] kan worden geïmplementeerd zonder framework en zonder het model MVC te volgen. We hebben dan wel een meerlaagse architectuur, maar de weblaag implementeert het model MVC niet.

Zo kan de hierboven genoemde laag [Web]bovenstaande laag [Web] kan dus worden geïmplementeerd met ASP.NET en MVC, waardoor we een gelaagde architectuur krijgen met een [Web]-laag van het type MVC. Zodra dit is gebeurd, kan deze laag ASP.NET MVC worden vervangen door een klassieke laag ASP.NET (WebForms), terwijl de rest (bedrijfslaag, DAO, ORM) ongewijzigd. We hebben dan een gelaagde architectuur met een laag [Web] die niet langer van het type MVC is.

In MVC hebben we gezegd dat het model M dat van de weergave V is, c.a.d. De verzameling gegevens die door de weergave V wordt weergegeven. Er wordt een andere definitie van het model M van MVC gegeven:

Veel auteurs zijn van mening dat wat zich rechts van de laag [Web] bevindt, het model M van MVC vormt. Om dubbelzinnigheden te voorkomen, kan men spreken van:

  • het domeinmodel wanneer men alles bedoelt wat zich rechts van de laag [Web] bevindt
  • het model van de weergave wanneer we verwijzen naar de gegevens die door een weergave V worden getoond

In het vervolg zal de term „M-model“ uitsluitend verwijzen naar het model van een weergave V.

1.3. De gebruikte tools

Hieronder gebruiken we (september 2013) de Express-versies van Visual Studio 2012:

  • [http://www.microsoft.com/visualstudio/fra/products/visual-studio-express-for-windows-desktop ] voor desktoptoepassingen;
  • [http://www.microsoft.com/visualstudio/fra/products/visual-studio-express-for-Web ] voor webtoepassingen.

Om de nieuwste versies van deze producten te installeren, kunt u het product [Web Platform Installer] van Microsoft gebruiken (http://www.microsoft.com/Web/downloads/platform.aspx ).

Daarnaast gebruikt u de Chrome-browser van Google (http://www.google.fr/intl/fr/chrome/browser/). Hieraan voegt u de extensie [Advanced Rest Client] toe . U kunt als volgt te werk gaan:

 
  • de applicatie is dan beschikbaar om te downloaden:
  • om deze te downloaden, moet u een Google-account aanmaken. [Google Web Store] vraagt vervolgens om bevestiging [1]:
  • In [2] is de toegevoegde extensie beschikbaar via de optie [Applications] [3]. Deze optie wordt weergegeven op elk nieuw tabblad dat u aanmaakt (CTRL-T) in de browser.

1.4. De voorbeelden

De meeste leervoorbeelden zullen beperkt blijven tot de weblaag:

Zodra deze leermodule is afgerond, zullen we een meerlaagse webapplicatie presenteren:

https://stahe.github.io
Deze cursus-tutorial, geschreven door Serge Tahé, wordt aan het publiek ter beschikking gesteld volgens de voorwaarden van de Creative Commons Naamsvermelding – Geen commercieel gebruik – Delen onder dezelfde voorwaarden 3.0 ongewijzigd.