Layout Nedir?
Razor layout, sitenin her sayfasında ortak kalan kısımları (header, footer, ana navigasyon) tek dosyada toplar. _Layout.cshtml bu işin standart adıdır.
<!DOCTYPE html>
<html>
<head>
<title>@ViewData["Title"] - ElmaWeb</title>
<link rel="stylesheet" href="~/css/style.css" />
</head>
<body>
<partial name="_Header" />
<main>@RenderBody()</main>
<partial name="_Footer" />
</body>
</html>Sayfa view'ları layout'u "doldurur"; @RenderBody() kısmı, o sayfanın özel içeriği olur.
Sections — Sayfaya Özel Stil/Script
Bazı sayfalar layout'a script veya CSS eklemek ister. @section tam bunun için.
// _Layout.cshtml içinde
</head>
@await RenderSectionAsync("Scripts", required: false)
// Sayfa içinde
@section Scripts {
<script src="~/js/dashboard.js"></script>
}required: false önemli — yoksa section'ı tanımlamayan her sayfa hata verir.
Partial View'lar
Tekrarlayan bir HTML bloğunu ayrı bir dosyaya taşıyıp birden fazla yerden çağırmak için. Genellikle _ProjeKart.cshtml gibi alt çizgi ile başlatılır (Razor convention).
<!-- _ProjeKart.cshtml -->
@model ProjeViewModel
<article class="project">
<h3>@Model.Baslik</h3>
<p>@Model.Aciklama</p>
</article>
<!-- Index.cshtml içinde -->
@foreach (var proje in Model.Projeler)
{
<partial name="_ProjeKart" model="proje" />
}View Component'ler — Mantığı Olan Parçalar
Partial veri taşır ama mantık yapmaz. Eğer bileşen kendi başına veri çekmesi gereken biri ise (örn. "son 5 mesaj" widget'ı), ViewComponent doğru araç:
public class SonMesajlarViewComponent : ViewComponent
{
private readonly IMesajService _service;
public SonMesajlarViewComponent(IMesajService s) => _service = s;
public async Task<IViewComponentResult> InvokeAsync()
{
var liste = await _service.SonMesajlarAsync(5);
return View(liste);
}
}<!-- Layout veya başka view içinde -->
<vc:son-mesajlar />
Hangisini seçeyim?
Sadece HTML tekrarlıyorsa Partial. Bileşen kendi başına veri çekecekse veya iş mantığı içerecekse ViewComponent.