Escolar Documentos
Profissional Documentos
Cultura Documentos
NET Razor
Alexandre Tadashi Sato Janeiro 2011 Tecnologias: WebMatrix Beta 3
Sumrio: Este artigo tem como objetivo apresentar uma introduo ao ASP.NET Razor, uma view engine da Microsoft que permite inserir cdigos diretamente na camada de visualizao da aplicao, facilitando a codificao do projeto.
Contedo
Introduo Como funciona ? Conhecendo o caracter @ Trabalhando com variaveis Trabalhando com objetos Inserindo comandos de deciso e loop Concluso Sobre o Autor
Introduo
O ASP.NET Razor uma view engine que j est includa no WebMatrix, com ele temos a possibilidade de inserir a lgica da aplicao diretamente na camada de visualizao do projeto, por exemplo, possvel inserir a sintax razor junto com os cdigos HTML dentro da mesma pgina, a sintaxe do ASP.NET Razor extremamente simplificada, baseado na linguagem C# .NET, embora seja possvel utilizar a linguagem Visual Basic .NET. Neste artigo voc conhecer o que e como funciona a view engine Razor, este artigo no tem como objetivo aprofundar na sintaxe da view engine Razor, mas apresentar um overview tcnico com o suficiente para criar pginas dinmicas usando o ASP.NET Razor. A Sintaxe do Razor baseada na consagrada tecnologia ASP.NET, que tem como base o Microsoft .Net Framework, possibilitando que o programador tenha todo o poder do ASP.NET utilizando o WebMatrix e o Razor, porm com uma sintaxe simplificada, como resultado o programador ganha produtividade alm de ter uma curva de aprendizado menor.
Como funciona?
Com o WebMatrix possvel criar pginas com contedo dinmico, existem dois tipos de contedo, o contedo que executado do lado do cliente, ou seja, a marcao HTML, CSS e JavaScript por exemplo, e o contedo executado do lado do servidor, esse o contedo que utilizamos por exemplo para acessar informaes em base de dados, o Razor permite que voc adicione o cdigo do servidor ao contedo do cliente, sendo que em uma nica pagina criada com o WebMatrix voc poder utilizar marcaes HTML em conjunto com cdigo ASP.NET Razor.
As pginas ASP.NET criadas pelo WebMatrix utilizando a view engine Razor possuem uma extenso de arquivo especial, os arquivos que utilizam como base a linguagem C# .NET tem a extenso CSHTML e as que utilizam do Visual Basic .NET tem a extenso VBHTML, sendo que essas extenses especiais so reconhecidas pelo servidor web e executa em primeiro lugar os cdigos que so executados pelo servidor e em seguida envia a pgina para o navegador.
Conhecendo o caractere @
O caractere especial @ inicia uma expresso, um bloco com uma nica instruo ou vrias, por exemplo, podemos inserir um cdigo Razor diretamente na marcao HTML, utilizando o caractere @ para iniciar um expresso de condio ou apresentar o contedo de uma varivel. Quando voc exibe o contedo de uma pgina utilizando o carter @, o ASP.NET RAZOR codifica a sada, substituindo caracteres reservados do HTML com os cdigos que permitem que sejam exibidos como texto em uma pgina web ao invs de serem interpretados como tag HTML. Os colchetes so utilizados para agrupar uma ou mais expresses iniciadas pelo caractere @, formando blocos de expresses que so executadas em seqncia, assim como na sintaxe da linguagem C# .NET, voc utiliza o ponto e virgula para finalizar uma expresso. No caso de uma expresso inline, ou seja, dentro da marcao HTML utilizando o caracter @, no necessrio utilizar o ponto e vrgula para informar o final da expresso. <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8" /> <title>Razor</title> </head> <body> @{ var engine = "Razor"; } @{ var IDE = "WebMatrix"; } <p>A IDE utilizada o: @IDE </p> <p>A view engine utilizada o : @engine</p> @{ var texto = "O WebMatrix e o Razor so tecnologias var empresa = "Microsoft."; var textoCompleto = texto + " : " + empresa; ";
<!DOCTYPE html> <html lang="en"> <head> <title>Objetos</title> <meta charset="utf-8" /> <style type="text/css"> body {background-color: beige; font-family: Verdana, Arial; margin: 50px; } form {padding: 8px; border-style: solid; width: 280px;}
</style> </head> <body> <p>Digite o seu nome e sobrenome:</p> <form action="" method="post"> <p><label for="text1">Nome:</label> <input type="text" name="txtNome" /> </p> <p><label for="text1">Sobrenome:</label> <input type="text" name="txtSobrenome" /> </p>
<p><input type="submit" value="Enviar" /></p> </form> <p>Nome Completo: <b> @nomeCompleto </b></p> </body> </html> Listagem 3 Trabalhando com objetos
} else { <p>Reprovado.</p> } }
</body> </html> Listagem 4 Utilizando if Comandos de loop so essenciais para percorrer elementos em uma aplicao, o Razor tem suporte ao for next, com este comando voc pode criar um loop e percorrer os elementos. @for(var i = 0; i <= 10; i++) { <p>Nmero: @i</p> } Listagem 5 Utilizando for next
Concluso
O artigo apresentou um overview bsico sobre a view engine Razor e um pouco sobre sua sintaxe, mas a tecnologia pode ir muito alm, o engine pode manipular colees, fazer chamadas a mtodos com parmetros, trabalhar com arquivos entre outras tarefas. Seu poder est justamente na elegncia e praticidade de inserir a lgica da aplicao diretamente na camada de visualizao, criando uma forma rpida e simples de criar aplicativos dinmicos, com a engine Razor, temos uma forma prtica de testar uma rotina, desenvolver um pequeno projeto, manipular formulrios e dados ou ainda, juntamente com o WebMatrix Beta 3, pode ser a porta de entrada para o universo de desenvolvimento web com a plataforma .net.