Desenvolvendo Meu Primeiro WebSite ASP.NET MVC2 Utilizando Objetos Dinâmicos

Quando falamos em ASP.NET MVC, não estamos querendo dizer que a Microsoft lançou o padrão MVC, mas sim que ela incorporou o padrão MVC (Model-View-Controller) à implementação de aplicações para web ASP.NET. Mas porque implementar um padrão de desenvolvimento diferente do que já temos hoje, que é o WebForms? Tendo toda a facilidade de apenas arrastarmos controles da tollbox para o formulário web, e a IDE do Visual Studio gerar todo o código HTML pra mim? Existem várias explicações para que isso possa ser justificado.

O lançamento do novo Framework .NET 4.0 trouxe várias novidades. Tais como:
  • Programação Paralela
  • ASP.NET MVC 2
  • Objetos Dinâmicos
  • Computação nas Nuvens
  • Componentes Nativos de Gráficos (Chart)
  • Silverlight 4.0
  • Parâmetros Opcionais, igual a implementação que temos no VB.NET
  • Mudança na criação do Web.Config, onde podemos informar qual o estágio que o web.config será utilizado: Debug, Staging e Release
Como você pode observar, existem essas e muitas outras novidades no framework .net 4.0. Mas, iremos focar em 2 dessas novidades: ASP.NET MVC 2 e Objetos Dinâmicos.

Quando trabalhamos com formulários Web, utilizando aplicações ASP.NET normal, sem utilizar o padrão MVC; estamos fazendo uso, inconsciente, ou consciente, depende da experiência de cada um, da classe ViewState. Essa classe gerencia o estado da página web, de tal forma a duplicar os controles da página. Mas como assim? Vamos supor que sua página web tenha 3 TexbtBox e um botão; o ASP.NET tradicional (WebForm) fará uso da classe estática ViewState e duplicará os 3 TextBox, em campos tipo Hidden, ou seja, sua página não mais terá 3 TextBox, mas sim 6 TextBox. Isso se faz devido a manutenção do ESTADO da página. É desta forma, que a sua aplicação ASP.NET mantem os dados dentro dos controles, quando ocorre um Post na sua web page.

Trabalhando com o padrão MVC, não temos acesso ao ViewState, mas sim ao ViewData. Mas como faremos então para manter os dados na tela para que o usuário não precise re-informar os dados em tela? Você, como desenvolvedor do seu Controller (Controlador), terá que programa-lo para que isso não ocorra. Calma! Isso não é um trabalho braçal. Já que temos conhecimento do ViewState, do ASP.NET, vamos falar um pouco do ViewData.

O ViewData é como uma seção, mas só para aquela View (Apresentação), ou seja, se tentar acessar o valor de um ViewData em outra View, não será possível. É por meio do ViewData, que conseguimos informar dados do Controller (Controlador) para nossa View correspondente.

Outro ponto interressante que temos dentro do ASP.NET MVC é a questão de não termos que arrastar controles da toolbox para dentro do nosso formulário web, de forma RAD, mas sim, temos o que chamamos de HTMLHelper. Se trata de uma classe estática, a qual você terá acesso à vários métodos responsáveis por renderizar, na página web, os controles correspondentes.

E sobre os objetos dinâmicos? o que podemos falar deles? Com base nas implementações que temos no Haskel, hoje temos isso também no .NET 4.0. São objetos mutantes, vamos dizer assim. Os quais assumem, em tempo de desenvolvimento, os atributos que informamos para esse tipo de objeto. E como fazemos para utilizar esse recurso? Por meio da classe ExpandoObject e da palavra reservada dynamic.

Vamos agora começar a implementação de uma pequena aplicação web utilizando o padrão MVC 2 fazendo uso de objetos dinâmicos.

Abra o Visual Studio 2010, vá em File -> New Project, selecione do lado direito a opção Web e nos templates selecione a opção ASP.NET MVC 2 Empty Web Application, Deixe marcada a opção .NET Framework 4.0 e dê o nome DPWMVC2 para o seu projeto, como mostra a imagem abaixo:


Após configurado o template da sua aplicação web MVC, clique em OK. O Visual Studio 2010 irá criar o seu projeto, com a seguinte estrutura:



O Visual Studio, cria a seguinte estrutura de pastas:

  • Content - Pasta responsável por armazenar todos os CSS (Cascading Style Sheet) ou folhas de estilo que seu web site utilizará para manter um padrão de layout.
  • Controllers - Pasta onde ficarão todas as classes de controladores de sua aplicação web MVC.
  • Models - Pasta que terá como responsabilidade armazenar todos os Models (Modelos), caso seus modelos precisem estar no mesmo projeto de sua aplicação web. PS.: normalmente os Models não ficam nesta pasta, mas sim em projetos separados.
  • Scripts - Local onde armazenamos todos os scripts JavaScript e JQuery que nossa site irá utilizar.
  • Views - Pasta que armazena todas as views (Apresentação), páginas .aspx, contendo apenas código HTML.
    • Shared - Nesta pasta ficam nossas MasterPages, que serão, como o nome da pasta diz: Compartilhada dentro de nosso site.
Agora vamos começar a criar o nosso Controller (Controlador) para o nosso site. Então, clique com o botão direito do mouse sobre a pasta Controller e selecione a opção Add -> Controller, como mostra a imagem abaixo:


Feito este passo, a IDE do Visual Studio irá nos apresentar uma janela, onde iremos informar o nome do nosso controlador e configurar se precisaremos ou não de que a IDE crie os métodos de CRUD (Create, Retrieve, Update e Delete), e iremos deixar esta opção desmarcada. O nome do nosso controlador será Home, seguido do noem Controller, pois todo controlador MVC precisa que o nome Controller esteja junto do nome do nosso controlador, isso é um padrão de funcionamento, e não convenção de nomenclatura. A imagem abaixo mostra como você deve configurar a tela em exibição:



O que está selecionado, será trocado por Home, mantendo o nome Controller junto do nome Home, e a opção do checkbox, permanecerá desmarcada. Pronto! o VS2010 já criou o arquivo contendo a classe do seu controlador, como mostrado na imagem abaixo:



Com a nossa classe do controlador criada, vamos agora criar uma view. Mas como assim, criar a view? Pensei que seria criada automaticamente, na criação do controlador! Calma, a view será criada, de forma automatizada sim. Mas, como explicamos, o padrão MVC é separado em 3 partes: Model, View e Controller, essas partes precisam ser construídas separadamente; pois senão teriamos, aqui um modelo WebForm novamente.


Para criarmos uma view, é muito fácil. No editor de código, posicione o mouse por cima do nome do método Index, clique com o botão direito do mouse, e selecione a opção Add View..., como mostrado na imagem abaixo:



Após clicar nesta opção, a IDE do VS2010 irá te apresentar uma tela de configuração da nossa View. No campo View name você irá permanecer com o nome sugerido pela IDE, que é Index. Você, também, deixará desmarcada as 2 opções de checkbox abaixo do campo View name e irá desmarcar a opção Select master page. Pronto! pode clicar em Add, como mostrado na imagem abaixo:



Agora com nossa View e Controller criados, vamos começar a implementar o nosso controlador. O bloco de código abaixo, será adicionado ao método public ActionResult Index()...:


List<ExpandoObject> listaClientesDinamicos = null;

dynamic clienteDinamico = null;


try

{

listaClientesDinamicos = new List<ExpandoObject>();


for (int i = 1; i <= 100; i++)

{

clienteDinamico = new ExpandoObject();


clienteDinamico.Id = i;

clienteDinamico.Nome = "Cliente " + i.ToString();

clienteDinamico.DataCadastro = DateTime.Now.Date;

clienteDinamico.LimiteCompra = i * 1000.00;


listaClientesDinamicos.Add(clienteDinamico);

}


ViewData["clientes"] = listaClientesDinamicos;

}

catch (Exception ex)

{

throw ex;

}


return View();


No código acima, temos a declaração de 2 variáveis: uma do tipo Lista Genérica tipada para ExpandoObject e uma outra do tipo dynamic. A classe ExpandoObject é responsável pela expansão, ou seja, pelo comportamento metamórfico que um objeto dynamic pode assumir. Então, no código, temos uma variável que nomeamos de clienteDinamico, o qual possui 4 atributos. Mas de onde surgiram esses atributos? do comportamento dinâmico da variável. Então, com isso podemos criar vários atributos para uma variável dinâmica, como no exemplo acima. Mas variável dinâmica não só tem esse tipo de utilidade, existem diversos outros tipos, por hora, vamos ficar apenas com esse mesmo.


Então o que falta para concluirmos nossa implementação? Resposta: Programar nossa View para receber os dados vindos no método do nosso respectivo controlador. Segue abaixo os códigos necessários para implementarmos o necessário para nossa view funcionar:


<%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage<dynamic>" %>


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">


<html xmlns="http://www.w3.org/1999/xhtml" >

<head runat="server">

<title>Index</title>

</head>

<body>

<div>

<table>

<%

var listaClientes = (List<System.Dynamic.ExpandoObject>)ViewData["clientes"];

foreach (dynamic cliente in listaClientes)

{

%>

<tr>

<td>

<%: cliente.Id%>

</td>

<td>

<%: cliente.Nome%>

</td>

<td>

<%: cliente.DataCadastro%>

</td>

<td>

<%: cliente.LimiteCompra%>

</td>

</tr>

<% } %>

</table>

</div>

</body>

</html>


Para os que já programavam em MVC 1, podem estar se perguntando: Mas onde é que foi parar então a tag <%= ? A resposta para isso chama-se: Segurança! Com base no expertise dos engenheiros da Microsoft, observou-se uma falha de segurança na estrutura antiga, observando uma série de vulnerabilidades, possibilitando a execução de Cross Site Scripting ou X-Scripting. Por isso que na versão MVC 2, a tag mudou para <%:.


No HTML acima, temos a declaração de uma variável do tipo variante, assumindo o comportamento de uma lista, advinha do nosso conhecido: ViewData. Variável responsável por compartilhar informações entre o controlador e o a View. Executamos um Foreach, montando um código HTML, Limpo, Claro e Objetivo, para apresentar os nossos 100 clientes dinâmicos. Pronto! Pode executar sua aplicação, e se você seguiu todos os passos, corretamente, verá na tela os 100 clientes dinâmicos exibidos na sua View.


Com a apresentação deste artigo, concluímos que a utilização do MVC, pode parecer um pouco trabalhosa. Mas atente-se para o seguinte: É Apenas uma primeira impressão, tendo em vista que estavamos acostumados a trabalhar com WebForms, apenas arrastando controles asp.net, e deixando nosso código um pouco poluído. Já no MVC, você pode perceber e vivenciar, como é fácil, prático e limpo, construir código HTML com o ASP.NET MVC 2. Desta forma, você terá sempre aplicações fáceis de manter, código HTML facilmente gerenciado, clareza no que está sendo construído, separação de responsabilidades entre apresentação, controlador e modelo (acesso ao banco de dados).


Link:

Exibições: 925

Comentar

Você precisa ser um membro de DevBrasil para adicionar comentários!

Entrar em DevBrasil

Comentário de Helio Passos em 26 novembro 2010 às 15:59
Olá, mais uma dúvida! Criei uma aplicação, mas o aquivo tem muitos campos. Como eu organizo na pagina esses registros?
Comentário de Helio Passos em 26 novembro 2010 às 15:53
Boa tarde!
Como eu configuraria o logon para acessar uma base de dados? E onde são armazenadas as informações dos usuários quando cadaaaastramos?
Comentário de Cleiton Felipe de Moraes em 1 novembro 2010 às 9:34
Fala José Roberto, agora deu certo muito obrigado!!!

Até mais...
Comentário de José Roberto Araújo em 31 outubro 2010 às 10:38
Cleiton,
Se você der uma olhada lá na minha página, tem um pequeno resumo do meu CV e tem meus contatos por lá.

Vamos que Vamos :)
Comentário de Cleiton Felipe de Moraes em 31 outubro 2010 às 10:35
Que isso José, temos que valorizar quem ajuda a comunidade assim como todos na comunidade Desenvolvendo para web sendo com posts assim como os seus ou duvidas...bom voltando ao assunto vou te disponibilizar sim me passe um email que posso estar enviando, por que a opção de download daqui não está funcionando ok....muito obrigado pela ajuda......e novamente parabéns...
Comentário de José Roberto Araújo em 31 outubro 2010 às 9:37
Cleiton,
Muito obrigado pelo acompanhamento dos posts, estou tentando ajudar a comunidade como posso :). Mas com relação ao que estou vendo, você está usando WebForms, como sendo sua view. Você poderia disponibilizar o seus fontes, para analisar?

abraço
Comentário de Cleiton Felipe de Moraes em 31 outubro 2010 às 0:34
Parabéns...cara seus posts estas muito bons mesmo, somente uma duvida estou tentando rodar a aplicação dando Debug do Visual Studio 2010 e esta aparecendo uns erros não sei porque o primeiro erro é o seguinte ele informa que tenho 3 erros no HomeController.cs são os seguintes

o outro é este

se puder me ajudar eu agradeço...Mas não posso deixar de te ter dar os parabéns....até mais...
Comentário de Haddan de Queiroz Rocha em 28 outubro 2010 às 23:09
Muito bom msm !!! Aguardo mais exemplos, pois estou começando a desenvolver agora, e meu conhecimento ainda é restrito !!!!
Comentário de José Roberto Araújo em 28 outubro 2010 às 7:12
É isso ai Haddan, teremos mais artigos sobre ASP.NET MVC2 e MVC3...
:)
Comentário de Haddan de Queiroz Rocha em 27 outubro 2010 às 21:28
Parabéns !! Deu certo !!

© 2018   Criado por Ramon Durães.   Ativado por

Badges  |  Relatar um incidente  |  Termos de serviço