1. O que é Razor
Razor é a sintaxe de template do ASP.NET Core — arquivos .cshtml que
misturam HTML normal com trechos de C#, prefixados por @. É
conceitualmente parecido com qualquer template engine que você já tenha usado no Node (EJS,
Handlebars, Pug), mas com C# completo disponível, não um subconjunto limitado de lógica.
@model Cliente
<h1>@Model.Nome</h1>
<p>E-mail: @Model.Email</p>
@if (Model.Ativo)
{
<span class="badge">Ativo</span>
}
else
{
<span class="badge inativo">Inativo</span>
}
<ul>
@foreach (var pedido in Model.Pedidos)
{
<li>Pedido #@pedido.Id — @pedido.ValorTotal.ToString("C")</li>
}
</ul>
| Sintaxe | Papel |
|---|---|
@model Cliente | Declara o tipo do modelo que a View espera receber |
@Model.Nome | Insere um valor C# direto no HTML |
@if / @foreach | Controle de fluxo — idêntico ao C# normal, sem @ repetido dentro do bloco |
Model (maiúsculo) dentro do .cshtml é a
instância do tipo declarado em @model — exatamente o objeto passado
pelo Controller em return View(cliente);, visto no capítulo anterior.
2. Layout — o "molde" compartilhado entre páginas
Assim como um template base.html em outros ecossistemas, um Layout
Razor define a estrutura comum (cabeçalho, menu, rodapé) que todas as Views compartilham:
<!DOCTYPE html>
<html>
<head>
<title>@ViewData["Title"] - Meu Sistema</title>
</head>
<body>
<nav>...</nav>
<main>
@RenderBody()
</main>
<footer>© 2026</footer>
</body>
</html>
@RenderBody() é onde o conteúdo específico de cada View entra. Uma
View "assina" qual layout usar (ou herda o padrão configurado globalmente):
@{
Layout = "_Layout";
}
3. Partial Views — reaproveitando pedaços de HTML
Uma partial view é um fragmento de Razor reaproveitável entre páginas diferentes — o equivalente a um componente sem estado próprio:
@model Cliente
<div class="card">
<h3>@Model.Nome</h3>
<p>@Model.Email</p>
</div>
@model List<Cliente>
<div class="grid">
@foreach (var cliente in Model)
{
<partial name="_CardCliente" model="cliente" />
}
</div>
4. Tag Helpers — HTML com superpoderes de C#
Tag Helpers são atributos HTML especiais, processados pelo servidor, que geram marcação correta automaticamente — o exemplo mais comum é gerar URLs sem escrever a string manualmente:
<!-- gera <a href="/Cliente/Detalhes/42"> automaticamente -->
<a asp-controller="Cliente" asp-action="Detalhes" asp-route-id="42">Ver detalhes</a>
<form asp-controller="Cliente" asp-action="Novo" method="post">
<input asp-for="Nome" />
<span asp-validation-for="Nome"></span>
<button type="submit">Salvar</button>
</form>
asp-for="Nome" gera automaticamente o name,
id e valor atual do input com base na propriedade do modelo — e
conecta com a validação do lado do servidor, assunto do capítulo 5.
5. Onde isso te leva
Com Views cobertas, o próximo capítulo trata do outro lado da comunicação: como os dados que o usuário envia (formulários, query strings) chegam de volta como objetos C# tipados — e a diferença entre um Model de domínio e um ViewModel feito sob medida para uma tela específica.