Plan du site  
pixel
pixel

Articles - Étudiants SUPINFO

Organiser son projet ASP.Net MVC avec les "Areas"

Par Jérémy SUINI Publié le 24/07/2015 à 16:47:32 Noter cet article:
(0 votes)
Avis favorable du comité de lecture

Introduction

Lors de la création d'une application ASP.NET MVC, nous avons au départ peu de contrôleurs et peu de vues. Plus cette application va grandir plus elle contiendra de vues et de contrôleurs. Le risque de se perdre dans notre projet devient important.

Il existe une technique trés simple: découper notre projet en zones de travail, que l'on appele plus communément les "areas". Au travers de cet article, je vous expliquerai comment créer ces "areas" en démontrant leur utilité lors de la mise en place d'un projet ASP.NET MVC.

L'environnement de développement utilisé dans cet article est Microsoft Visual Studio 2013. Il est donc nécessaire d'avoir des connaissances minimales d'utilisation de cet environnement de développement, ainsi que les bases du développement MVC.

Dans un premier temps nous allons voir comment créer une "Area" puis dans un second temps nous appliquerons ce principe dans un exemple plus concret.

Création d'une zone ou "Area"

Création de la zone "Test"

Nous supposerons ici que nous avons créé au préalable un projet MVC nommé "AreaTest".

Tout d'abord, comment créer une Area ?

Il suffit de faire un clic droit sur notre projet "AreaTest" , de cliquer sur "Add" et enfin sur "Area".

Vous pouvez nommer votre "Area" comme vous le souhaitez, ici je la nommerai "Test"

Après la création de notre "Area", nous pouvons remarquer que Visual Studio a fait plusieurs choses.

Tout d'abord il a créé un répertoire "Areas" qui contient lui même des sous répertoires "Models", "Controllers" et "Views", sur le même modèle de ce qui existe déjà dans le projet MVC.

Deuxièmement, et ceci est trés important, notre outil Visual Studio a créé un fichier "TestAreaRegistration.cs", qui contient le code suivant.

Nous pouvons voir sur le code ci-dessus que Visual Studio a défini une route "Test/{controller}/{action}/{id}" pour la zone que nous avons créée, qu'il préfixe par "Test".

"TestAreaRegistration" est une classe qui dérive de la classe "AreaRegistration", en d'autres termes elle hérite de toutes les propriétés de "AreaRegistration".

Utilisation de la zone "Test"

Nous allons maintenant voir ensemble comment accéder à notre vue "Test" grâce à l'URL définie par Visual Studio ("Test/{controller}/{action}/{id}") dans notre fichier "TestAreaRegistration.cs".

Nous allons tout d'abord créer un contrôleur "TestControlleur" dans le dossier "/Areas/Test/Controllers". Celui-ci contient le code suivant :

Puis nous créeons la vue "Index.cshtml" "/Areas/Test/Views". A noter que si vous utilisez le raccourci pour créer la vue depuis le contrôleur, celle-ci se mettra automatiquement dans le répertoire correspondant.

Lorsque l'on lance notre projet, nous pouvons désormais accéder à notre vue "Test" grâce à l'URL suivante : "siteweb/Test/Test/Index".

On obtient bien le résultat attendu : un titre <h2>Index</h2>

Exemple

Nous allons maintenant voir un exemple concret. Nous allons créé trois Area dans le cadre de la création d'un site communautaire. Nous définissons tout d'abord trois Area : Forum, Actualités et Administration.

Comme prévu, nos trois Area ont été créee. Chacune est composée des sous-dossiers "Models", "Views" et "Controllers" et du fichier "xAreaRegistration.cs". Nous pourrions dire que nous avons trois mini-sites web dans un site web.

Notre projet est donc bien segmenté en trois éléments fonctionnels différents, de plus la lisibilité s'en trouve acrrue.

Conclusion

Tout d'abord merci à tous d'avoir lu cet article.

Je vous ai donc présenté comment organiser votre projet ASP.NET MVC grâce aux "Areas".

Celles ci permettent d'avoir un projet plus propre, clair, précis et mieux organisé d'un point de vue fonctionnel.

A propos de SUPINFO | Contacts & adresses | Enseigner à SUPINFO | Presse | Conditions d'utilisation & Copyright | Respect de la vie privée | Investir
Logo de la société Cisco, partenaire pédagogique de SUPINFO, la Grande École de l'informatique, du numérique et du management Logo de la société IBM, partenaire pédagogique de SUPINFO, la Grande École de l'informatique, du numérique et du management Logo de la société Sun-Oracle, partenaire pédagogique de SUPINFO, la Grande École de l'informatique, du numérique et du management Logo de la société Apple, partenaire pédagogique de SUPINFO, la Grande École de l'informatique, du numérique et du management Logo de la société Sybase, partenaire pédagogique de SUPINFO, la Grande École de l'informatique, du numérique et du management Logo de la société Novell, partenaire pédagogique de SUPINFO, la Grande École de l'informatique, du numérique et du management Logo de la société Intel, partenaire pédagogique de SUPINFO, la Grande École de l'informatique, du numérique et du management Logo de la société Accenture, partenaire pédagogique de SUPINFO, la Grande École de l'informatique, du numérique et du management Logo de la société SAP, partenaire pédagogique de SUPINFO, la Grande École de l'informatique, du numérique et du management Logo de la société Prometric, partenaire pédagogique de SUPINFO, la Grande École de l'informatique, du numérique et du management Logo de la société Toeic, partenaire pédagogique de SUPINFO, la Grande École de l'informatique, du numérique et du management Logo du IT Academy Program par Microsoft, partenaire pédagogique de SUPINFO, la Grande École de l'informatique, du numérique et du management

SUPINFO International University
Ecole d'Informatique - IT School
École Supérieure d'Informatique de Paris, leader en France
La Grande Ecole de l'informatique, du numérique et du management
Fondée en 1965, reconnue par l'État. Titre Bac+5 certifié au niveau I.
SUPINFO International University is globally operated by EDUCINVEST Belgium - Avenue Louise, 534 - 1050 Brussels