Desenvolvimento de Aplicação ASP.NET 5 MVC 6
Self-Host
Felipe Alves Tavares, Jony Teixeira Melo
Instituto de Informática – Centro Universitário do Triângulo (UNITRI) Caixa Postal 309 – 38.411-106 – Uberlândia – MG – Brasil
felipe.at@live.com, jonytme@gmail.com
Resumo. Com o aumento da utilização de aplicações web, surge a
necessidade de melhorar os recursos e funcionalidades já existentes para esta plataforma. Este artigo tem como objetivo apresentar através de uma aplicação, as novas funcionalidades do ASP.NET 5, o novo framework da Microsoft. No ASP.NET 5 vários novos recursos virão para ajudar o desenvolvedor a criar aplicações robustas e forma rápida e pratica.
1. Introdução
Com a grande popularização e o aumento da utilização da internet nos últimos anos, se fazem necessárias aplicações web modernas, ágeis e práticas. Diante desta necessidade, surgem várias plataformas de desenvolvimento e vários ambientes integrados para desenvolvimento de softwares (IDE’s) para que os desenvolvedores possam criar estas aplicações robustas.
Baseado neste feito, este artigo apresenta um estudo sobre a plataforma ASP.NET e seu IDE Visual Studio 2015, demonstrando as vantagens, desvantagens, facilidades e dificuldades que ela traz com a nova plataforma.
A nova plataforma ASP.NET 5 cuja versão final ainda não foi lançada (esta em Release Candidate) apresenta muitos recursos que facilitam o desenvolvimento de aplicações modernas e práticas dando uma melhor experiência ao desenvolvedor.
O artigo também aborda a utilização do MVC, um padrão de desenvolvimento de projeto que auxilia na organização do código dividindo-o em três camadas, a model, a view e o controller.
As sessões a seguir mostram um pouco da plataforma .NET, das novidades do ASP.NET 5 e seus recursos, da evolução do MVC, os recursos que estão chegando com o MVC 6 e o desenvolvimento de uma aplicação web, utilizando o ASP.NET 5 MVC 6 hospedando a aplicação a partir do processamento da máquina (Self-host).
2. O ASP.NET
O desenvolvimento web na Microsoft começou com o ASP clássico no final da década de 90. Tempos depois a Microsoft deixou de dar continuidade ao ASP clássico e criou o ASP.NET. O ASP.NET foi introduzido em 2002 e foi construído com base na plataforma do .NET e também em 2002 foi desenvolvido uma IDE chamado Visual Studio 2002 [PROFESSIONAL ASP.NET 4.5 C#].
Atualmente o ASP.NET se encontra na versão 4.6, e a versão mais atual da IDE é o Visual Studio 2013 [MICROSOFT MSDN], e está sendo desenvolvido a versão 5.0
da plataforma ASP.NET e o Visual Studio 2015 que já se encontra em Release Candidate [MICROSOFT ASP.NET VNEXT].
2.1. O ASP.NET 5
O ASP.NET 5 é uma plataforma de código aberto para construção de aplicações web modernas que podem ser desenvolvidas em Windows, Linux e Mac. Nele está incluído o MVC 6, que é a integração do MVC com a Web API e Web Pages dentro de um único framework de programação web. O ASP.NET 5, também é a base para o SignalR 3, permitindo adicionar funcionalidades em tempo real para aplicações conectadas em nuvem.
As mudanças que foram feitas no ASP.NET 5, foram baseadas nas solicitações dos usuários e nos comentários das versões anteriores do ASP.NET. Todas estas mudanças foram realizadas para ajudar no desenvolvimento, hospedagem e na manutenção, e são voltadas para o desenvolvimento de aplicações web modernas. Foram feitas várias mudanças na arquitetura que possibilitam com que a Core Web Framework ficasse mais leve e mais modular. O ASP.NET 5 não é mais baseado na System.Web.dll, e sim em um conjunto bem consignado de pacotes NuGet que permite otimizar a aplicação para ter apenas o que ela precisa.
Figura 1. Arquitetura do ASP.NET 5 [MSDN MICROSOFT].
O ASP.NET 5 trouxe várias mudanças em sua arquitetura, como utilizar diferentes versões da plataforma .NET lado a lado, isso permite que, quando se tem alguma aplicação que depende de alguma versão especifica da plataforma .NET, e é necessário atualizar a plataforma .NET, mas não tem certeza se todas aplicação irão trabalhar adequadamente naquela versão, o ASP.NET 5 vem para resolver este problema.
Além de utilizar diferentes versões da plataforma .NET lado a lado, o ASP.NET 5 possibilita ao usuário construir e executar aplicações web através de vários sistemas operacionais, sejam eles o Windows, o Linux (para o sistema operacional Linux, está disponível apenas para o Debian e Ubuntu, mas futuramente estará disponível também
para CentOS e Fedora) e o Mac (OS X). Para isto a Microsoft construiu uma IDE chamada Visual Studio Code.
Figura 2. Esta figura mostra o IDE Visual Studio Code de fundo e os sistemas operacionais ao qual ele consegue operar [VISUAL STUDIO CODE].
O ASP.NET 5 muda também a forma de gerenciamento de dependências, simplificando as dependências nos projetos. Ao invés de importar assemblies e referências, deverá importar as dependências de pacotes NuGet, que pode ser feito tanto no gerenciamento de pacotes NuGet quanto no arquivo Project.json da aplicação.
Quando é criado um projeto no ASP.NET 5, este já está estruturado para facilitar a implantação em um ambiente em nuvem. O Visual Studio 2015 fornece um novo sistema de configuração que substitui o arquivo Web.Config e permite solicitar valores de variáveis JSON, XML ou variáveis de ambiente.
Ferramentas populares de desenvolvimento como a Bower, Grunt e Gulp foram integradas no Visual Studio 2015. A Bower é um gerenciador de pacotes para as bibliotecas client-side. Grunt e Gulp são executadores de tarefas, que auxilia a automatizar o fluxo de trabalho do desenvolvimento web. Pode utilizar Grunt ou Gulp para compilação de arquivos LESS, CoffeScript ou arquivos TypeScript, rodar JSLint ou criar versões minimizadas de arquivos JavaScript.
O ASP.NET 5 traz também a eliminação da duplicação do MVC, Web API e Web Pages fundindo em um framework único chamado MVC 6 [MICROSOFT ASP.NET].
2.2. O MVC
O MVC é um padrão de arquitetura muito importante para a ciência da computação. Criado em 1979, originalmente chamado de Thing-Model-View-Editor, para mais tarde ser simplificado para apenas Model-View-Controller.
O padrão MVC, tem sido usado por dezenas de frameworks desde que foi introduzido. É possível achar o padrão MVC em Java, C++, PHP, e muitos outros frameworks.
O MVC é separado em três aspectos:
Model: Um conjunto de classes que descreve os dados que estão sendo trabalhados, bem como a regra de negócios de como os dados podem ser alterados e manipulados.
View: Define como a User Interface será exibida.
Controller: Um conjunto de classes que manipula a comunicação do usuário e a lógica especifica da aplicação [PROFESSIONAL ASP.NET MVC 5].
2.3. Evolução do ASP.NET MVC
O ASP.NET MVC foi anunciado em 2007, porém apenas em março de 2009 foi lançado a sua primeira versão, o ASP.NET MVC 1. Apenas um ano após o lançamento do ASP.NET MVC 1, em março de 2010, é lançado o MVC 2. O ASP.NET MVC 3, chegou em apenas 10 meses depois do MVC 2. Em Agosto de 2012, o ASP.NET MVC 4 foi lançado [PROFESSIONAL ASP.NET MVC 5].
O MVC 5 foi liberado para uso junto com o Visual Studio 2013 em outubro de 2013. O principal foco do MVC 5 é a iniciativa One ASP.NET que é a unificação da criação do tipo de projeto. Por exemplo, na versão anterior do MVC deparava-se com uma escolha sempre que fosse criar um projeto. Tinha que se escolher entre aplicação MVC, Web Forms ou algum outro tipo de projeto. Depois de ter escolhido o tipo de projeto caso a escolha fosse MVC, poderia adicionar Web Forms, mas caso a escolha fosse Web Forms era difícil adicionar MVC, porque o MVC tinha um tipo especial de projeto GUID escondido dentro do arquivo csproj. E o One ASP.NET veio para mudar este tipo de problema que existia [PROFESSIONAL ASP.NET MVC 5].
E o MVC 6, que é a nova criação da Microsoft, que ainda se encontra na fase de implementações e testes.
2.4. ASP.NET MVC 6
O MVC 6 ainda não foi lançado no mercado sua versão final, mas está mudando o conceito de criação web dentro do framework ASP.NET. O ASP.NET MVC 6 unificará o modelo de programação do MVC, Web API e Web Pages.
Nas versões anteriores do ASP.NET, estes frameworks eram implementados separadamente e, portanto, existiam algumas duplicações e inconsistências. O MVC 6 está fundindo estes modelos em um único modelo de programação. Agora o programador pode criar um único projeto web e manipular serviços de Web UI e dados sem a necessidade de conciliar diferenças nesses quadros de programação.
Além da unificação do modelo de programação, o MVC 6 trará também novas mudanças para fazer o desenvolvimento web do lado do servidor mais fácil utilizando os novos Tag Helpers. Com os Tag Helpers, é possível utilizar os HTML Helpers na View, simplificando a semântica das tags.
Figura 3. Sintaxe Razor [MICROSOFT WEBLOGS].
Ao invés de escrever um código HTML como mostra a figura 3, você poderá escrever o código HTML conforme a figura 4 [MICROSOFT WEBLOGS].
Figura 4. Nova Tag Helpers utilizando HTML Helpers [MICROSOFT WEBLOGS].
3. Recursos do ASP.NET 5
O ASP.NET 5 trouxe vários novos recursos para se utilizar dentro dos projetos. Um deles é o desenvolvimento dinâmico.
Com o desenvolvimento dinâmico, não é mais preciso recompilar todas às vezes o projeto para ver as mudanças, ao invés disto, basta editar o código, salvar as alterações, atualizar o browser, e ver as mudanças quer foram realizadas.
Além do desenvolvimento dinâmico, o ASP.NET traz também a possibilidade de utilizar softwares lado-a-lado. Para fazer isto, basta selecionar seu projeto, selecionar propriedades clicando com o botão direito e marcar “Use specific DNX version” e em Plataform escolher o .NET Core.
Há também um melhoramento no desempenho do HTTP, pois o ASP.NET 5 está introduzindo a nova requisição de HTTP pipeline. Este HTTP pipeline é modular, então, pode-se adicionar apenas os componentes que são necessários. O pipeline não mais depende da System.Web. Para customizar quais componentes utilizará a nova requisição de HTTP pipeline, é utilizado o método Configure no arquivo Startup.cs como mostra na figura 5.
Figura 5. Configuração da Startup.cs para utilização do HTTP pipeline [WEBLOGS ASP.NET].
O ASP.NET 5 traz a possibilidade de desenvolver aplicações em diversos sistemas operacionais. Através do site: https://code.visualstudio.com/ é possível baixar o IDE Visual Studio Code para desenvolver para Linux e iOS, além é claro do Windows.
Um dos recursos que também está incluso no ASP.NET 5 é a simplificação do gerenciamento de dependências. Para utilizar, basta baixar o pacote de dependências no NuGet Manager ou simplesmente editar o arquivo JSON (Project.json) que lista os pacotes NuGet e a versão usada no projeto. O arquivo Project.json é fácil de utilizar e pode ser editado em qualquer editor de texto, o que permite que você atualize as dependências, mesmo quando o aplicativo foi implantado na nuvem. O Visual Studio 2015 também traz o IntelliSense, que ajuda a encontrar os pacotes NuGet disponíveis e as versões de cada pacote. Além da simplificação do gerenciamento de dependências, o ASP.NET traz também uma configuração pronta para nuvem.
Para se utilizar o Bower, basta acessar o arquivo bower.json dentro do projeto e adicionar as bibliotecas JavaScript que desejar. Para se utilizar o Grunt, acesse o arquivo package.json e adicione o pacote grunt que desejar. O Gulp utiliza o mesmo sistema que o Grunt, basta acessar o package.json, adicionar os pacotes gulp que desejar. Para que o grunt ou o gulp adicione estes pacotes, deve executar um Task Runner, para executa-lo basta clicar com o botão direito do mouse em cima do arquivo grunt.js ou gulp.js e clicar em Task Runner Explorer. Dentro do Task Runner Explorer, selecione a task (tarefa) que deseja executar e clique em Run.
3.1. Self-Host no ASP.NET 5
O ASP.NET 5 traz também a habilidade de hospedar a aplicação dentro próprio processo (Self-host) ou dentro do IIS. Quando se utiliza o Core CLR, pode-se distribuir a aplicação com cada dependência dentro do pacote de implantação, fazendo com que a
aplicação e as dependências sejam completamente autossuficientes e não dependam mais de uma instalação da plataforma .NET no sistema, possibilitando o self-host. Ainda é recomendada a utilização do IIS como melhor opção para hospedagem, porém pode ser necessário utilizar uma plataforma diferente para hospedar o projeto.
Para se utilizar o Self-host, basta ir no arquivo Project.json e adicionar um comando na seção command, e adicionar a seguinte linha [WEBLOGS ASP.NET]: "Microsoft.AspNet.Hosting --server Microsoft.AspNet.Server.WebListener --server.urls http://localhost:5000"
3.2. Estrutura de um projeto ASP.NET 5
A estrutura de um projeto ASP.NET 5 está bastante diferente comparado ao ASP.NET 4.5.2 que é a ultima versão atuante.
Conforme mostra imagem abaixo, um projeto ASP.NET 5 utilizando um template padrão de Web Site tem esta estrutura:
Figura 6. Estrutura de um projeto ASP.NET 5.
3.2. Criação de um projeto ASP.NET 5 MVC 6
A criação de um projeto ASP.NET 5 é bastante simples. A forma de criação de um projeto não foi alterada comparada as versões anteriores.
Para se criar um projeto basta acessar o menu superior e clicar em File, New, Project. Aparecerá uma tela para selecionar o nome do projeto, o local que deseja salvar e o modelo que deseja utilizar, seja para desktop, web ou mobile conforme mostra figura:
Figura 7. Criação de um novo projeto.
Após escolhido o nome do projeto e o modelo que deseja utilizar você deverá escolher o template do projeto, como mostra na figura 7.
Figura 8. Escolha do Template do novo projeto.
Na sessão a seguir, será apresentado o desenvolvimento de uma aplicação utilizando o ASP.NET 5 MVC 6 mostrando os novos recursos e comparando-os com a versão anterior do ASP.NET MVC. Será feito também um comparativo entre ambos para apresentar as facilidades, dificuldades, vantagens e desvantagens em se utilizar o MVC 6 comparado ao MVC 5 do ASP.NET.
4. Estudo de Caso
O objetivo é criar uma aplicação para mostrar na prática as facilidades, dificuldades, vantagens e desvantagens do MVC 6. Para este projeto foi utilizado uma biblioteca
chamada open-weather para buscar a temperatura de algumas cidades pré-definidas. E este projeto terá como base as novidades que chegaram ao ASP.NET 5 para o desenvolvimento do mesmo.
Para iniciar o desenvolvimento das aplicações, foi utilizado o Visual Studio 2015 para criar o projeto MVC 6. O download, do Visual Studio pode ser encontrado no site da Microsoft: http://www.asp.net.
4.1. O Desenvolvimento no ASP.NET 5 MVC 6
Para se desenvolver a aplicação, foi definido no arquivo config.json o código como mostra na figura abaixo para uma configuração que servirá de base para consultar o serviço o da biblioteca Open Weather.
Figura 9. Configuração no arquivo config.json.
Para configurar as dependências do projeto, na classe Startup, foi realizado uma chamada no método IConfiguration Configuration adicionando o método AddSingleton que faz com que todas as dependências encontradas no projeto sejam executadas em apenas uma instância de IConfiguration. Para isto, deve-se adicionar a seguinte linha: “services.AddSingleton<IConfiguration>(_=> Configuration);”.
Após configurado o arquivo json e as dependências do projeto, foi realizado a importação dos arquivos da biblioteca Open Weather utilizando Bower e Grunt. Para realizar esta importação primeiro é configurado o arquivo Bower para manipulação dos pacotes client-side. O arquivo contem IntelliSense facilitando a adição da biblioteca a qual deseja utilizar. Deve-se adicionar a biblioteca que deseja utilizar na tag Dependencies como mostra a imagem:
Figura 10. Configuração no arquivo bower.json.
Depois da adição da biblioteca no arquivo Bower, deve-se rodar o Task Runner Explorer do arquivo Grunt, clicando com o botão direito no arquivo Grunt.js. Aparecerá uma janela onde será apresentado a Task do Bower, e para executar esta tarefa, basta clicar com o botão direito e selecionar Run.
No ASP.NET 5 não existe mais as Partial Views, foram substituídas por um recurso conhecido como View Component. Este componente servirá como base para apresentar as informações do clima de uma cidade especifica. O View Component ficará como mostra a figura 11.
Figura 11. View Component.
Em seguida, foi criada uma View para mostrar a representação do HTML que é gerado através da View Component. Dentro desta View, ficará o método openWeather que será chamado e fará uma requisição ao serviço da Open Weather onde será retornado as informações sobre o clima.
Após a criação da View, é criado um Controller para acessar as informações que foram configuradas no config.json e posteriormente retornando-as a View. O Controller ficará como mostra na imagem.
Figura 12. Métodos do Controller Cidade.
Finalizado o Controller, devem ser criadas agora as View que são chamadas dentro do controle.
Figura 13a. View utilizando Razor.
Foram criadas 2 View’s, uma utilizando a sintaxe Razor, e a outra utilizando as Tag Helpers como mostra na figura 13a e 13b.
Figura 13b. View utilizando HTML Helper.
E a última, mas não menos importante é a utilização do self-host para rodar no processo da máquina, inserindo a linha de comando no arquivo Project,json como está exemplificado abaixo:
"web": "Microsoft.AspNet.Hosting --server Microsoft.AspNet.Server.WebListener --server.urls http://localhost:5000"
Figura 14. Comando para inserção do self-host no arquivo Project.json.
5. Conclusão
O ASP.NET 5 traz diversas funcionalidades para ajudar o desenvolvedor a criar aplicações robustas de uma maneira rápida e prática. O MVC 6 veio para facilitar em vários aspectos a vida do desenvolvedor.
Com o Visual Studio Code, possibilita os desenvolvedores a escolher o sistema operacional que deseja criar as aplicações, não ficando preso ao Windows, tendo também o Linux e o Mac como opções.
O self-host é uma grande vantagem do ASP.NET 5 pois possibilita uma flexibilidade para trabalhar independente do IIS, além disto, hospedar o projeto em várias plataformas não dependendo mais do sistema operacional que será implantado. Anteriormente, não havia a possibilidade de hospedar um projeto fora do IIS, consequentemente, não era possível hospedar em outros sistemas a não ser o Windows, com o self-host não depende-se mais do sistema operacional a qual irá hospedar a aplicação.
Uma facilidade que o ASP.NET 5 traz também é o gerenciamento de dependências, não sendo mais necessário a importação de referências e assemblies como eram realizados nas versões anteriores, ao invés disto, será referenciado pacotes NuGet no Project.json.
Outro item muito importante dentro do ASP.NET 5 que facilitou bastante para os desenvolvedores é não precisar recompilar o projeto toda vez que fossem feitas mudanças na parte do servidor para visualizá-las.
No ASP.NET 5, a dificuldade e/ou desvantagem da utilização é que toda mudança tem sua fase de amadurecimento, pois o desenvolvedor deverá aprender todas as mudanças realizadas dentro do framework, praticar, ganhar agilidade no
desenvolvimento e só assim estará em um mesmo padrão de desenvolvimento comparado as versões anteriores que supostamente tinha experiência.
Como sugestão para trabalhos futuros, é recomendável a implementação de aplicações ASP.NET utilizando o Visual Studio Code para que sejam executados no Linux ou Mac, explorando mais a utilização do self-host além é claro, das novas funcionalidades.
4. Referencias
BARRY M. LEINER. “Brief History Of The Internet” Disponível em: <http://www.internetsociety.org/internet/what-internet/history-internet/brief-history-internet>. Acesso em abril de 2015.
DANIEL ROTH. “Introduction to ASP.NET 5” Disponível em: < http://docs.asp.net/en/latest/conceptual-overview/aspnet.html >. Acesso em março de 2015.
GALOWAY, J. et al. Professional ASP.NET MVC 5. Indiana, Wrox, 2014, 584p. MICROSOFT MSDN. “.NET Framework Versions and Dependencies” Disponível em:
<https://msdn.microsoft.com/pt-br/library/bb822049(v=vs.110).aspx>. Acesso em abril de 2015.
RENATO JOSE GROFFE. “Implementando uma aplicação ASP.NET 5 MVC 6” Disponível em: < http://www.devmedia.com.br/visual-studio-2015-implementando-uma-aplicacao-asp-net-mvc-6/32265 >. Acesso em junho de 2015.
RENATO JOSE GROFFE. “Gerenciando bibliotecas de Script no Visual Studio 2015” Disponível em: < http://www.devmedia.com.br/gerenciando-bibliotecas-de-scripts-no-visual-studio-2015/31869 >. Acesso em junho de 2015.
SCOTT. “Introducing ASP.NET 5” Disponível em: <
https://weblogs.asp.net/scottgu/introducing-asp-net-5 >. Acesso em março de 2015. STEVE SMITH. “Understanding ASP.NET 5 Web Apps” Disponível em: <
http://docs.asp.net/en/latest/conceptual-overview/understanding-aspnet5-apps.html >. Acesso em junho de 2015.
VISUAL STUDIO CODE. “Why Visual Studio Code?” Disponível em: < https://code.visualstudio.com/Docs/whyvscode >. Acesso em maio de 2015.
WORLD DEVELOPMENT INDICATIORS. “Internet Users (per 100 people)” Disponível em: < http://data.worldbank.org/indicator/IT.NET.USER.P2>. Acesso em abril de 2015.