Projeto ASP.NET 5 Empty

Vamos começar com a criação do projeto. Então, abra o VS 2015, selecione File / New Project (Ctrl + Shift + N). Na janela aberta, selecione a linguagem Visual C#, a categoria Web e, nos templates, ASP.NET Web Application. O nome do projeto será ASP5_DNX, conforme a figura 1.

Clique no botão OK e, na janela aberta, selecione Empty, conforme a figura 2. Esse template cria apenas o projeto com os frameworks, não há nenhum arquivo relacionado ao template de Web Site, que usa o padrão MVC.

Clique no botão OK e aguarde a criação do projeto. Veja na figura 3 que em References há dois frameworks – o DNX 4.5.1, que contém o .NET completo, e o DNX Core 5.0, que é um framework enxuto.

Quando há uma solicitação no servidor pela primeira vez, tudo inicia no arquivo Startup.cs, portanto, abra e veja que temos dois métodos:

• ConfigureServices, que deve conter a lista de serviços (coleção IServiceCollection) da aplicação, por exemplo, configurações no AppSettings, Sql Server, Entity Framework, Identity etc., ou seja, você adiciona os serviços sob demanda, conforme os requisitos da aplicação.
• Configure, que recebe o IApplicationBuilder, no qual você pode configurar ambiente, página de erro, uso de arquivos estáticos, setar cookies, definir autenticações Windows, facebook, goggle, rotas para o ASP.NET MVC.

using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using Microsoft.AspNet.Builder;
using Microsoft.AspNet.Http;
using Microsoft.Framework.DependencyInjection;

namespace ASP5_DNX
{
    public class Startup
    {
        // For more information on how to configure your application, visit http://go.microsoft.com/fwlink/?LinkID=398940
        public void ConfigureServices(IServiceCollection services)
        {
        }

        public void Configure(IApplicationBuilder app)
        {
            app.Run(async (context) =>
            {
                await context.Response.WriteAsync("Hello World!");
            });
        }
    }
}

Vamos ver como entender o funcionamento da aplicação. No método Configure, adicione a linha “throw new Exception(“MVP virtual conference”);” dentro do app.Run.

public void Configure(IApplicationBuilder app)
{
    app.Run(async (context) =>
    {
        throw new Exception("MVP virtual conference");
        await context.Response.WriteAsync("Hello World!");
    });
}

Pressione F5 para executar a aplicação no browser, e conforme a figura 4 veja que a mensagem de o erro foi exibida com o texto “MVP virtual conference”.

Mas você deve estar pensando que o erro deveria ser mostrado numa página de erro, afinal é uma aplicação ASP.NET, certo? Não, pois até agora não adicionamos nenhuma referência ao namespace de diagnóstico. Então, abra o arquivo project.cs e adicione a referência “Microsoft.AspNet.Diagnostics” ao grupo de “dependencies”. E, para esclarecimento, isso chama-se injeção de dependência, você vai adicionando blocos de referências de acordo com a necessidade da aplicação. No momento da digitação do Microsoft, você já deve ter notado que o Intellisense o ajuda no preenchimento, tanto no nome do namespace, quanto na versão disponível.

"dependencies": {
    "Microsoft.AspNet.Server.IIS": "1.0.0-beta4",
    "Microsoft.AspNet.Server.WebListener": "1.0.0-beta4",
    "Microsoft.AspNet.Diagnostics": "1.0.0-beta4"
  }

Salve o arquivo e abra a lista de referências no References do Solution Explorer. Conforme a figura 5, note que esse Diagnostics foi adicionado aos dois frameworks. Além disso, vale ressaltar que as referências são as mínimas para executar o projeto. Agora, sim, você tem uma visão melhor que basta adicionar os blocos de namespaces de que necessita à lista de dependências, e pronto.

Em seguida, adicione a linha de código “app.UseErrorPage()” no início do método Configure, o qual captura Exceptions geradas por chamadas assíncrona ou síncrona e gera o HTML com todas as informações necessárias.

public void Configure(IApplicationBuilder app)
{
    app.UseErrorPage();

    app.Run(async (context) =>
    {
        throw new Exception("MVP virtual conference");
        await context.Response.WriteAsync("Hello World!");
    });
}

Execute o projeto no browser novamente e veja que a mensagem de erro mudou, agora contém o HTML com as informações de erro, conforme a figura 6. Claro que até aqui a página está praticamente em branco porque não há nada.

Execução com o DNX

Na estrutura do projeto, temos o folder wwwroot, que chamamos de ponto de entrada do site. Basta abrir o arquivo project.cs e localizar a linha “webroot”: “wwwroot”. E, como não temos nenhuma página a ser executada, no Solution Explorer, clique com o botão direito em wwwroot, selecione Add / New Item / HTML Page chamada OlaMundo.html. Veja o código completo a seguir:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
</head>
<body>
    Olá mundo ASP.NET 5!
</body>
</html>

Salve o arquivo html. Agora é preciso fazer um ajuste no Startup.cs, comente a linha do throw que inserimos anteriormente. A partir de agora, não execute mais essa aplicação pelo VS 2015 com o F5, pois usaremos o DNX via comando de prompt.

Para facilitar a digitação, abra esse projeto na pasta onde foi criada, ou seja, dê um clique com o botão direito no Solution Explorer e selecione Open folder in File Explorer. Localize o endereço que contém a pasta com o nome do projeto dentro da pasta SRC (source) – no meu caso, C:\ProjetosASPNET5\ASP5_DNX\src\ASP5_DNX, conforme a figura 7. Copie esse endereço.

Em seguida, abra o Comando de Prompt como Administrador e digite cd\+endereço completo copiado na memória (você pode usar o clique com o botão direito/Colar). O prompt mostrará o local atual, sendo: c:\ProjetosASPNET5\ASP5_DNX\src\ASP5_DNX. Em seguida, digite o comando “dnx . web”. Aguarde alguns segundos para o DNX montar o ambiente e, pronto, você verá uma mensagem “Started”, conforme a figura 8, ou seja, está pronto para execução.

E qual o endereço a ser usado no browser? É simples: no VS, abra o arquivo project.cs e localize a declaração “web” no grupo “commands”. Note que aponta para http://localhost:5000.

"commands": {
    "web": "Microsoft.AspNet.Hosting --server Microsoft.AspNet.Server.WebListener --server.urls http://localhost:5000"

Então, abra o browser e digite este endereço http://localhost:5000. Veja na figura 9 que o resultado não é o esperado, ou seja, a nossa página HTML criada, e sim a mensagem “Hello World!”, que está declarada no Startup.cs “await context.Response.WriteAsync(“Hello World!”);”.

Isso está errado? Não, o que precisamos fazer é informar ao ASP.NET 5 que temos uma página estática HTML e pronto. Lembre-se de que comentei sobre o ponto de entrada (wwwroot), e até agora no projeto não dissemos que há páginas estáticas, então o framework não sabe que existe uma página que ele deverá executar. Vamos aos ajustes. No arquivo Project.cs, adicione a declaração do “Microsoft.AspNet.StaticFiles” nas dependências. Salve esse arquivo.

"dependencies": {
  "Microsoft.AspNet.Server.IIS": "1.0.0-beta4",
  "Microsoft.AspNet.Server.WebListener": "1.0.0-beta4",
  "Microsoft.AspNet.Diagnostics": "1.0.0-beta4",
  "Microsoft.AspNet.StaticFiles": "1.0.0-beta4"
},

O último ajuste é informar no método Configure do arquivo Startup.cs que a aplicação usará arquivos estáticos. Para isso, adicione o código app.UseStaticFiles(), conforme a seguir.

public void Configure(IApplicationBuilder app)
{
    app.UseErrorPage();
    app.UseStaticFiles();

    app.Run(async (context) =>
    {
        //throw new Exception("MVP virtual conference");
        await context.Response.WriteAsync("Hello World!");
    });
}

Salve o arquivo, abra novamente a janela do Comando de Prompt, dê um ENTER para interromper a execução. Digite novamente “dnx . web” para iniciar o ambiente do servidor web e aguarde a mensagem “Started”. Agora, basta abrir o browser e digitar o nome da sua página com o endereço completo, sendo: http://localhost:5000/olamundo.html, conforme a figura 10.

Observe que o VS 2015 é apenas o editor de códigos. Adicione uma nova página chamada ExecucaoViaDNX.html com o seguinte conteúdo.

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
</head>
<body>
    Esta página foi executada via DNX!!
</body>
</html>

Salve a página e, no navegador, digite o endereço completo, sendo: http://localhost:5000/ExecucaoViaDNX.html. Veja na figura 11 que a página mostra o respectivo conteúdo, mas o interessante é que no VS 2015 nem compilamos nada, apenas o usamos como editor.

Existem outros editores de códigos, fique à vontade para usá-los, seja o notepad, o Sublime, o novo Visual Studio Code, que é o VS para mundo não Microsoft.

Conclusão

Esta nova maneira de criar aplicações de Console ou ASP.NET 5 do tipo Cross-Platform deixa qualquer desenvolvedor ao alcance da plataforma .NET, com diversas ferramentas de edição e ambientes de execução.

Agradeço a oportunidade de poder compartilhar o conhecimento deste artigo. Qualquer dúvida e preparação de times de desenvolvimento, por favor me contate.