ASP.NET MVC – Utilizando áreas para organizar a aplicação (pt-BR)
Introdução
No artigo anterior (ASP.NET MVC 3 – Desenvolver ficou fácil) eu comentei sobre o uso de áreas para melhor organizar a aplicação Web (Não a solução), porém não apliquei na prática o conceito.
Um cenário comum para as áreas é um e-Commerce por exemplo, onde temos uma área para os usuários, que podem ver ou comprar os produtos e outra área administrativa, para que os funcionários cadastrem os produtos.
Não temos um limite de áreas a serem criadas, e cada área pode possuir seus próprios controllers, views, css, scripts e etc. É como se fosse uma nova aplicação, porém, reaproveitando o domínio e outras coisas compartilhadas entre os projetos.
Criando áreas
Como era de se esperar, o Visual Studio novamente dá uma “mãozinha” e permite a criação de uma nova área com poucos cliques (E claro, todo código gerado pode ser editado).
Para não tomar muito tempo, utilizarei o projeto anterior, que pode ser encontrado neste link:
Com a solução carregada, clique com o botão direito do mouse sobre o projeto MvcFakeStore.Web e selecione a opção Add –> Area, como mostrado na Figura 1.
http://weblogs.asp.net/blogs/andrebaltieri/image_thumb_4576EC1F.png
Figura 1 – Adicionando uma nova área.
Uma nova janela se abrirá, para que esta área seja nomeada. No meu exemplo utilizei o nome “Administrativo”.
Neste ponto, uma nova estrutura de pastas foi criada na aplicação, como mostrado na Figura 2.
http://weblogs.asp.net/blogs/andrebaltieri/image_thumb_4607CA69.png
Figura 2 – Estrutura de pastas criado para a nova área.
É importante notar que temos a mesma estrutura da pasta raiz da aplicação dentro desta área, incluindo as pastas model, Views, Shared e etc, ou seja, é como se fosse outra aplicação.
Em extra será criado um arquivo com o nome <SuaArea>AreaRegistration.cs que se encarregará de registrar a área na aplicação e fazer o mapeamento das URLs também para sua área.
Com a área criada, criarei os dois controllers (ProductController e CategoryController) novamente nesta área, e posteriormente, deixarei somente os metodos Index e Details (Listar e ver detalhes dos produtos/categoria) nos controllers da raiz da aplicação, e os métodos de criação, edição e exclusão, dentro da área administrativa.
Antes de começar, copie o arquivo _Layout.cshtml da pastas /Views/Shared para a pasta Areas/Administrativo/Views/Shared, como mostrado na Figura 3.
http://weblogs.asp.net/blogs/andrebaltieri/image_thumb_54D721A3.png
Figura 3 – Copia do arquivo _Layout.cshtml
Aproveite para abrir o arquivo e alterar seu cabeçalho, como mostrado na Figura 4, apenas para diferenciar as áreas.
http://weblogs.asp.net/blogs/andrebaltieri/image_thumb_7FD6C1BB.png
Figura 4 – Alterando o cabeçalho da página inicial.
Feito isso, na nova área criada, repita os passos do artigo “ASP.NET MVC 3 – Desenvolver ficou fácil”, sessão “Criando os Controllers e Views com Scaffolding Templates”, porém utilizando a pasta Controllers da área “Administrativo” que acabamos de criar e também alterando o template padrão, para usar este Layout que acabamos de criar, como na Figura 5.
http://weblogs.asp.net/blogs/andrebaltieri/image_thumb_513AD5D0.png http://weblogs.asp.net/blogs/andrebaltieri/image_thumb_321CDA52.png http://weblogs.asp.net/blogs/andrebaltieri/image_thumb_53C345E7.png
Figura 5 – Selecionando o template das Views.
Ao fim a estrutura do projeto deve estar similar a apresentada na Figura 6.
http://weblogs.asp.net/blogs/andrebaltieri/image_thumb_4DA11AAE.png
Figura 6 – Estrutura do projeto ao fim da criação dos controllers e views.
Decorando as Classes
Assim como fizemos no artigo anterior “ASP.NET MVC 3 – Desenvolver ficou fácil”, redecoraremos as classes, agora de acordo com suas áreas, como mostrado nas imagens abaixo:
http://weblogs.asp.net/blogs/andrebaltieri/image_thumb_151B1BF6.png
ProductController.cs
http://weblogs.asp.net/blogs/andrebaltieri/image_thumb_7CB029FA.png
CategoryController.cs
Voltando ao projeto inicial, removeremos os métodos de criação, exclusão e edição dos controllers, e suas respectivas Views, como mostrado nas imagens abaixo:
http://weblogs.asp.net/blogs/andrebaltieri/image_thumb_41816F91.png
CategoryController.cs (Raiz do site)
http://weblogs.asp.net/blogs/andrebaltieri/image_thumb_49318A53.png
ProductController.cs (Raiz do site)
http://weblogs.asp.net/blogs/andrebaltieri/image_thumb_54EBF2E7.png
Views removidas, restando apenas as necessárias.
ActionLinks para áreas diferentes
Até este ponto temos a aplicação dividida entre site e setor administrativo, para demonstrar a criação de ActionLinks entre areas, criaremos um link no _Layout.cshtml do site ligando-o com a área administrativa, como mostrado na Figura 7.
http://weblogs.asp.net/blogs/andrebaltieri/image_thumb_61151F21.png
Figura 7 – ActionLink parametrizado para direcionar para um controller/action de uma área específica.
Note que simplesmente definimos um parâmetro “area” e informamo a qual área o usuário será redirecionado. Por fim como a sobrecarga do método exige um parâmetro para os Html Objects, informamos null para dar um by pass.
Controllers iguais em áreas diferentes
Em alguns casos, pode acontecer um conflito entre controllers (Caso do controller Home – Se criar outro controller Home na área Administrativa ocorrerá o erro da Figura 8.)
http://weblogs.asp.net/blogs/andrebaltieri/image_thumb_00EB34F0.png
Figura 8 – Erro de controllers duplicados.
Para corrigir este problemas precisamos informar qual namespace do controller home principal nas definições das rotas, no arquivo Global.asax.
A Figura 9 mostra a solução para este problema.
http://weblogs.asp.net/blogs/andrebaltieri/image_thumb_79F0A3CC.png
Figura 9 – Adicionando namespaces para definir o controller a ser mapeado.
Conclusão
As áreas nos permitem uma divisão dentro das aplicações MVC, é como se tivessemos dois sites dentro de apenas um. Além disso contamos com o compartilhamento das informações entre os sites, o domínio e até o layout.
Downloads
André Baltieri
MTAC – Microsoft Technical Audience Contributor
MSN: andrebaltieri@hotmail.com | Twitter:
@andrebaltieri
Blog: http://andrebaltieri.wordpress.com
Inside .NET Users Group Leader
http://www.insidedotnet.com.br/