Laravel Blade Templates

Merhaba Mobilhanem.com takipçileri,
Laravel ile eğitim serimizin bu dersinde Laravel Blade Templates yapısını anlatmaya çalışacağım.

Laravel Blade Templates

Blade aslında bir şablon sistemidir. İçerisine alışık olduğunu PHP kodlarını da yazabilmeniz bir çok yazılımcının Laravel öğrenirken kendini rahat hissetmesini sağlamaktadır. Daha önce PHP ile site ya da uygulama yazdıysanız özellikle üst veya alt kısımlar için tek bir dosya kullanıp, onu her sayfaya ‘include’ ile çağırmışsınızdır. Bunun amacı tüm sitenizin üst kısmında yapacağınız değişikliğin tek tek her php dosyasında değil; tek bir yerden yapmanızı sağlamaktır. Laravel Blade Templates, içinse bu özellik layouttur. PHP ile yaptığınız ‘include’ durumundan farklı olarak burada bir ana şablon tanımlar ve diğer sayfaları bu şablonu ‘extend’ ederek oluşturursunuz. Hemen bir şablon örneği yazalım.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>@yield('baslik')</title>
</head>
<body>
    @yield('icerik')
</body>
</html>

Yukarıdaki şablona dikkat ederseniz ‘title’ etiketleri arasında @yield(‘başlık’) kodunu yerleştirdik. Bu oluşturacağımız diğer sayfalar ile bu bölümünün iletişimini sağlayacak olan kod kısmıdır. Şimdi de bir alt daha doğrusu genişletilmiş bir sayfa yazalım.

@extends('sablon')

@section('baslik', 'Sayfa Başlık')

@section('icerik')
    <p>Buraya içerik gelecek</p>
@endsection

Şablon sayfamızdaki değişkenlerle bir sayfa oluşturmak çok kolaylaştı. İhtiyacımız olan alanları ekleyip o alanları doldurmamız yeterli olacak.

İlk satırda yer alan ‘extends’ oluşturduğumuz alt sayfanın hangi üst sayfadan çoğaltılacağını açıklıyor. Daha sonrada sizin de göreceğiniz gibi baslik ve icerik için gerekli alanları belirterek alt sayfanın verilerini bu alanlara yazdık. Bu şekilde alt sayfalar için genel bir şablona sahip oluyoruz.

Laravel Blade Templates Döngüler

Yazılım dillerinde belki de en çok kullanılan terimlerdir döngüler. Bu yüzden yazımda bu döngülere değinmenin uygun olacağını düşündüm.

laravel blade templates ile frontend programlama
laravel blade templates kullanımı

Üstteki ekran görüntülerinde sol taraf blade ile sağ taraf ise düz PHP ile yapılmıştır. Özellikle sol bölümde seçili alanda önemli bir nokta var. PHP kodlarının içerisine bir yazı yazdırmak istediğimizde ya PHP etiketlerini kapatmamız ya da ‘echo’ kullanmamız gerekli. Fakat Laravel Blade Templates için bu duruma gerek yok. Döngüler kendi satırlarında biter ve alt satıra indiğinizde artık orası HTML olarak okunur.

Yine sol tarafta görebileceğiniz gibi değişkenler de ‘{{‘ ile ‘}}’ arasına yazılarak kısaltılmış bir ‘echo’ kullanılmış olunuyor. Kullanılan çift süslü parantezler XSS engellemen adına ‘htmlspecialchars’ fonksiyonu kullanılmış hali ile gelmektedir. Yani HTML etiketleri bu değişkenden temizlenir. Siz eğer HTML etiketli halini kullanmak isterseniz ‘{!!’ ile ‘!!}’ arasına yazmalısınız değişkeninizi. Yine bir örnek kod ile anlatmaya çalışayım.

$x = "<p>Buraya bir paragraf gelecek</p>";

{{$x}} // çıktısı Buraya bir paragraf gelecek

{!!$x!!} // çıktısı <p>Buraya bir paragraf gelecek</p>

 

Mobilhanem.com için yazdığım bu eğitimde Laravel Blade Templates yapısını anlatmaya çalıştım. Daha fazla detaylı bilgi için laravel dökümanından yararlanabilirsiniz.

Tüm Laravel Derslerimiz için tıklayınız.

Mobilhanem.com üzerinden yayınladığım laravel eğitimlerine devam edeceğiz. Yazımız ile ilgili tüm sorularınızı yorum bölümden ulaştırabilirsiniz. Bunun dışındaki diğer sorularınız için sorucevap.mobilhanem.com sitesini kullanabilirsiniz.

Umarım sizin için yararlı olmuştur. Okuduğunuz için teşekkürler. Daha fazla kişinin okuması için paylaşmayı unutmayın…

78

Onur Üre

Aslen jeoloji mühendisi olup hiç mesleğini yapmaya fırsat bulamayan ve gönlünde hep bilgisayar ve programlama olan, evden (home-office) çalışma şekline bayılan, evli, 2 kedi ve 1 tavşan babası, sokaktaki her köpek, kedi, kuşun abisi olmaya çalışan biriyim. Lütfen bir kap su bir kap yemek her köşe başına...

4 Yorum

Haftalık Bülten

Mobilhanem'de yayınlanan dersleri haftalık mail almak ister misiniz?