Laravel'de Layout Kullanımı
Layout, web sayfalarının genel tasarımını ve yapısını tanımlayan bir şablon sistemidir. Bu, bir web uygulamasının farklı sayfaları arasında ortak bileşenlerin (örneğin başlık, menü, yan çubuklar) paylaşılmasını sağlar. Laravel'de layout, Blade şablonları aracılığıyla kolayca oluşturulabilir ve yönetilebilir.
Ana Layout Oluşturma
Öncelikle, uygulamanız için ana layout'u oluşturmanız gerekir. Bunun için resources/views/layouts dizinine yeni bir Blade dosyası oluşturabiliriz. Örneğin, app.blade.php adında bir dosya oluşturalım
<!DOCTYPE html>
<html lang="tr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>@yield('title')</title>
<!-- CSS ve JS dosyalarını buraya ekleyebilirsiniz -->
</head>
<body>
<header>
<!-- Header bileşenleri -->
</header>
<main>
@yield('content')
</main>
<footer>
<!-- Footer bileşenleri -->
</footer>
</body>
</html>
Bu dosyada @yield komutu, alt sayfalarda belirli bir bölümü (örneğin başlık veya içerik) doldurmak için kullanılır.
Alt Sayfaları Oluşturma
Şimdi, ana layout'u kullanarak alt sayfaları oluşturabiliriz. Örneğin, bir anasayfa home.blade.php ve bir hakkında sayfası about.blade.php oluşturalım
home.blade.php
@extends('layouts.app')
@section('title', 'Ana Sayfa')
@section('content')
<h1>Hoş Geldiniz!</h1>
<!-- Ana sayfa içeriği -->
@endsection
about.blade.php
@extends('layouts.app')
@section('title', 'Hakkımızda')
@section('content')
<h1>Hakkımızda</h1>
<!-- Hakkında sayfası içeriği -->
@endsection
Bu dosyalarda @extends komutu, belirli bir layout'u genişletmek için kullanılır. @section komutları, belirli bir bölümü doldurmak için kullanılır.
Layout Kullanımının Avantajları
- Tekrarı Önler: Ortak bileşenleri tek bir yerde tanımlayarak kod tekrarını önler.
- Bakımı Kolaylaştırır: Layout'u güncellediğinizde, tüm alt sayfaları etkiler, böylece bakımı kolaylaşır.
- Daha Organize Kod: Sayfalar arasındaki tutarlılık ve düzen, kodunuzu daha organize hale getirir.
- Verimlilik: Tekrar eden işleri yapmanıza gerek kalmadan daha hızlı uygulama geliştirmenizi sağlar.
- 0
- 0
- 254
- 05 May 2024
Yorum yapabilmek için giriş yapmanız gerekmektedir.