Selam,
Laravel’i öğrenmeye View yapısıyla devam ediyorum. Bugünkü konular:
- Blade(Laravel’in template engineı) temelleri
- View dosyalarına veri gönderme
- Karar yapıları ve döngüler
- View dosyalarını kalıtım yapma
- HTMLBuilder
Blade’in Temelleri
View dosyalarımız, app/views
dizininde tutuluyor ve bir view dosyasını geriye döndürmek istediğimiz zaman View
classından make
metodunu çağırıyoruz. Bu metoda view dosyasının adını argüman olarak veriyoruz.
Route::get('/', function() { return View::make('anasayfa'); });
Yukarıdaki kod ile sitenin anasayfa urli için sorumlu olan route
, View::make()
sayesinde “anasayfa
” ismindeki view dosyasını döndürüyor. Zaten bu kısma kadar olan bölümü geçen ders öğrenmiştim.
Eğer Laravel’in Blade template engineını kullanmak istersek view dosyalarımızın uzantısını .blade.php
olarak ayarlamamız yeterli. anasayfa.blade.php
gibi.
Blade ile echo Komutu
Blade kullanırken <?php echo $degisken; ?>
yerine {{ }}
kullanabiliriz. Bu Blade’le alakalı çok temel bir komut ama ilerliyen kısımlarda daha karmaşık kısımlara da değineceğiz.
İpucu: Sublime Text kullananlar, Laravel Blade Highligter eklentisi ile view dosyalarında daha rahat çalışabilir.
View Dosyalarına Veri Göndermek
View dosyalarına veri göndermek için 2 yol tercih edebiliriz.
1- with() metodu ile
View dosyalarımızı geriye döndürürken with()
metodunu da çağırarak verilerimizi gönderebiliriz. with()
2 parametre alıyor: İlk parametre verimiz için etiket, ikinci parametre ise verimizin değeri.
routes.php
:
Route::get('/', function() { $hayvan1 = "Balina"; $hayvan2 = "Penguen"; $sehir1 = "İstanbul"; $sehir2 = "Kocaeli"; return View::make('anasayfa')->with("veri", $hayvan1); });
Böylece anasayfa
view dosyamıza veri
etiketiyle $hayvan1
değerini göndermiş olduk. Yani balina. View dosyamızda gelen veriyi alıp ekrana yazdırmak istersek:
anasayfa.blade.php
:
<h1>{{$veri}}</h1>
2- make() metoduna 2. parametre olarak
View dosyamıza veri göndermenin 2. yolu ise make()
metodunu kullanmak. make()
ilk parametre olarak view dosyamızın adını alıyor. İstersek 2. parametre olarak verilerimizi bir dizi halinde gönderebiliriz. Bu dizinin anahtarları (key) yine etiket görevinde olacak.
Route::get('/', function() { $hayvan1 = "Balina"; $hayvan2 = "Penguen"; $sehir1 = "İstanbul"; $sehir2 = "Kocaeli"; return View::make('anasayfa', array("hayvanIki" => $hayvan2)); });
View dosyasında da yine aynı yöntemle gelen veriyi yazdırabiliriz.
<h1>{{$hayvanIki}}</h1>
Birden Fazla Veri Gönderme
Üstteki 2 yöntem ile birden çok veriyi de göndermemiz mümkün.
with()
ile bunu yapmak istersek, her veri için with()
metodunu çağırmamız gerek.
return View::make('anasayfa')->with("veri", $hayvan1)->with("veri2", $hayvan2);
make()
ile çoklu veri göndermek istersek, dizinin eleman sayısını arttırmamız yeterli.
return View::make('anasayfa', array("sehir1" => $sehir1, "sehir2" => $sehir2));
Sihirli Metod ile Veri Gönderme
Eğer view dosyasına tek değişken ile veri göndereceksek Laravel’in sihirli metodunu kullanabiliriz. Bunun için yine with() metoduna biraz sihir katmamız lazım (asıl sihri Laravel yapıyor tabii ki)
View::make('anasayfa')->with("veri", $hayvan1);
Bu bildiğimiz with() ile veri gönderme yöntemi. Sihri gerçekleştirmek için, kullandığımız etiketi “with“den sonrasına ekleyerek yeniden isimlendirmemiz yeterli.
View::make('anasayfa')->withHayvan($hayvan1);
camelCase tekniğini kullanmanız şart değil bu arada. Ve tabii ki view dosyasında $hayvan1
in değerini yazdırmak için değişken olarak $hayvan
ı kullanmamız gerek.
Dizileri Veri Olarak Göndermek
Sihirli metodu burada da kullanabiliriz:
Route::get('/', function() { $hayvan1 = "Balina"; $hayvan2 = "Penguen"; $sehir1 = "İstanbul"; $sehir2 = "Kocaeli"; $dizi = array( $hayvan1, $hayvan2, $sehir1, $sehir2); return View::make('anasayfa')->withDizi($dizi); });
Liste ögelerini ise her zamanki gibi indislerine göre yazdırabiliriz.
<h1>{{ $dizi[0]}}</h1> <h1>{{ $dizi[1]}}</h1> <h1>{{ $dizi[2]}}</h1> <h1>{{ $dizi[3]}}</h1>
with() metodu da kullanılabilir tabii ki:
return View::make('anasayfa')->with("dizi", $dizi);
Route Parametrelerini View Dosyalarına Gönderme
Evet, böyle bir şey de mümkünmüş.
Route::get("yorum/{bisey?}", function($bisey = "") { return View::make('anasayfa')->with("data", $bisey); } );
Sitenin yorum/
dizini altındaki herhangi bir url gelmesi durumunda, gelen url veri olarak anasayfa
view dosyasına gönderiliyor. yani localhost/yorum/abcdefg
adresine gittiğimizde anasayfa
view dosyasına “abcdefg
” verisi yüklenip döndürülecek.
Karar Yapıları ve Döngüler
Laravel Blade ile if
ve döngüleri nasıl kullanacağımızı öğreneceğimiz bölüme geldik.
Blade ve if – elseif – else
Route::get('/', function() { $filmler = array("Lord of the Rings"); return View::make("anasayfa") -> withFilmler($filmler); });
Tek elemanlı bir dizimiz var bunu anasayfa
view dosyasına gönderdik. Şimdi anasayfa
view dosyamızda Blade ile if
kullanarak bunu yazdıralım:
@if (count($filmler) == 1) Listede tek film var: {{$filmler[0]}} @endif
@if
ile bir if
koşulu belirteceğimizi bildiriyoruz. Koşulu sonlandırmak için @endif
eklemeliyiz.
else if
ya da else
kullanmak istersek:
@if (count($filmler) == 1) Listede tek film var: {{$filmler[0]}} @elseif(count($filmler) > 1) İzleyecek birden fazla film birikmiş :) @else Listede hiç film yok! @endif
else if
için @elseif
, else
için @else
kullanıyoruz. Tüm bunların sonuna yine @endif
eklemeliyiz.
@unless()
@unless()
kontrol ettiğimiz koşulların hatalı olması durumunda çalışıyor. Yani koşul ifadesi false
ise.
@unless(count($filmler) == 1) Listede birden çok film var @endunless
Döngüler
1- for
@for($i = 0; $i < count($filmler); $i++) Film {{ ($i+1).": ".$filmler[$i]}} </br> @endfor
2 – foreach
<h1>Filmler</h1> @foreach( $filmler as $film) {{$film}} <br/> @endforeach
3 – while
@while(false) Böyle bir şey hiç yaşanmadı @endwhile
View Dosyalarını Kalıtım Yapmak
Web sitemizin sayfalarını tasarlarken, genel bir şablonumuz vardır ve sitemizin sayfaları bu genel şablona göre tasarlanır. Daha sonra her sayfa için ufak düzenlemeler yapabiliriz.
Şimdi 3 sayfadan oluşan çok basit bir site oluşturacağız. Home, Hakkımızda ve İletişim sayfaları için HTML kodlarını düzenliyorum.
home.blade.php:
<!doctype html> <html lang="tr"> <body> <nav> <a href="/">Anasayfa</a> <a href="iletisim">İletişim</a> <a href="hakkimizda">Hakkımızda</a> </nav> <img src="http://www.cocotuts.com/images/logo.png"/> <section> Hoşgeldiniz! </section> </body> </html>
Anasayfamız bu şekilde tasarlandı. Şimdi kodları kopyalayıp, Hakkımızda
ve İletişim
için yapıştırıyorum ve sadece <section></section>
ile <nav></nav>
alanlarını sayfalara göre özelleştiriyorum.
hakkimizda.blade.php:
<!doctype html> <html lang="tr"> <body> <nav> <a href="/">Anasayfa</a> <a href="iletisim">İletişim</a> </nav> <img src="http://www.cocotuts.com/images/logo.png"/> <section> Hakkımızda sayfası </section> </body> </html>
iletisim.blade.php:
<!doctype html> <html lang="tr"> <body> <nav> <a href="/">Anasayfa</a> <a href="hakkimizda">Hakkımızda</a> </nav> <img src="http://www.cocotuts.com/images/logo.png"/> <section> İletişim Sayfası </section> </body> </html>
Bu şekilde zahmetlice bunu yapmaktansa ana şablonumuzu belirledikten sonra, alt sayfalara bu ana şablonu aktarabilseydik her şey daha güzel olurdu değil mi? Şimdi bunu nasıl yapacağımıza bakalım.
Önce app/views
altına layouts
isimli bir klasör oluşturup master.blade.php
isimli bir dosya oluşturuyorum. Bu ana şablonumuzu tutacak olan dosya. home.blade.php
içindeki kodların hepsini kopyalayıp master.blade.php
içine kopyalıyorum. Daha sonra sayfadan sayfaya farklılık gösterebilecek alanları Blade’e bildirmem lazım. Bizim senaryomuzda <section></section>
ile <nav></nav>
master.blade.php:
<!doctype html> <html lang="tr"> <body> <nav> @yield("ust-menu") </nav> <img src="http://www.cocotuts.com/images/logo.png"/> <section> @yield("icerik") </section> </body> </html>
Sayfadan sayfaya farklılık gösterebilecek alanları @yield()
kullanıp “entry-point” olarak düzenledim. Daha sonra bu ana şablonu aktaracağım sayfalarda kullanabilmek için bir etiket belirliyorum.
Şimdi Home, Hakkımızda ve İletişim sayfalarını yeniden düzenliyorum. İlk yapmam gereken kullanacağım master.blade.php
dosyasını alt sayfalara kalıtım yapmak. Bunun için @extends()
komutunu kullanacağız. Bu komuta parametre olarak master.blade.php
dosyasının yolunu bildirmemiz gerek.
home.blade.php:
@extends("layouts/master") @section("ust-menu") <a href="/">Anasayfa</a> <a href="iletisim">İletişim</a> <a href="hakkimizda">Hakkımızda</a> @stop @section("icerik") Hoşgeldiniz! @stop
Şimdi ne yaptığımıza adım adım tekrar bakalım:
- 1. satırda ana şablonumuzu tutan sayfayı yani
master.blade.php
dosyasını kalıtım yapıyoruz.layouts/master
yerinelayouts.master
da kullanabiliriz. - 3. satırda ana şablonda belirlediğimiz “entry-point” yerine gelecek kısmı belirtecek kodları giriyoruz. Bunu yapmak için
@seciton()
komutuna argüman olarak “entry-point” için belirlediğimiz etiketi girmemiz gerekli. - 9. satırda
@stop
komutunu kullanmamız gerekti çünkü her@section
komutunun bitişine bu komutu yazmamız lazım. - 11. satırda yine bulunduğumuz sayfaya göre değişen içeriklerimizi girmek için
@section()
komutunu kullanıyoruz. - 13. satırda
@section()
komutunu sonlandırıyoruz.
Şimdi master.blade.php
dosyamızı hakkimizda
ve iletisim
için de kalıtım yaparak kullanalım.
hakkimizda.blade.php:
@extends("layouts.master") @section("ust-menu") <a href="/">Anasayfa</a> <a href="iletisim">İletişim</a> @stop @section("icerik") Hakkımızda Sayfası @stop
iletisim.blade.php:
@extends("layouts.master") @section("ust-menu") <a href="/">Anasayfa</a> <a href="hakkimizda">Hakkımızda</a> @stop @section("icerik") İletişim Sayfası @stop
Buraya kadar olan kısım Blade ile kalıtım yapmanın temelleriydi. Şimdi öğrendiğim ufak bir numarayı daha paylaşmak istiyorum. Bu yöntemle view dosyaları üzerinde daha fazla kontrole sahip oluyoruz ve “override” yapabiliyoruz.
Bunun için master.blade.php
dosyasını şu şekilde düzenliyorum. Ama önce sizin de farkettiğiniz gibi tüm sayfalarımda <a href="/">Anasayfa</a>
mevcut. Bu kısmı da master.blade.php
içine almam daha mantıklı olacaktır.
master.blade.php:
<!doctype html> <html lang="tr"> <body> <nav> @section("ust-menu") <a href="/">Anasayfa</a> @show </nav> <img src="http://www.cocotuts.com/images/logo.png"/> <section> @yield("icerik") </section> </body> </html>
6.satırda @yield
yerine @section()
kullanıyorum. Ve @section()
komutlarını @show
ile sonlandırıyorum. Alt sayfalardaki komutlarda ise herhangi bir değişiklik yapmama gerek yok. Ama şu noktaya dikkat etmek gerek. Alt sayfalarda @section("ust-menu")
komutunu kullandığım zaman otomatik olarak override
edilmiş olacak. Yani master.blade.php
içinde belirlediğim kodlarım değil altsayfada yazdığım kodlar çalışacak. Eğer master.blade.php
içindeki @section("ust-menu")
içinde yer alan kodların da çalışmasını istersem altsayfada @parent
komutunu eklemem gerek. Anlatmak istediklerimi şu şekilde açıklayayım:
hakkimizda.blade.php:
@extends("layouts.master") @section("ust-menu") <a href="iletisim">İletişim</a> @stop @section("icerik") Hakkımızda Sayfası @stop
Eğer bu şekilde yazarsam, master.blade.php
içindeki @section("ust-menu")
geçersiz sayılıp hakkimizda.blade.php
içindeki kodlar çalışacak. Yani Anasayfa için belirlediğimiz link gözükmeyecek.
hakkimizda.blade.php:
@extends("layouts.master") @section("ust-menu") @parent <a href="iletisim">İletişim</a> @stop @section("icerik") Hakkımızda Sayfası @stop
Eğer hakkimizda.blade.php
sayfamı bu şekilde düzenlersem, yani @section("ust-menu")
içine @parent
komutunu eklersem, master.blade.php
içindeki @section("ust-menu")
de yer alan kodlar da aktarılacaktır.
HTMLBuilder
Laravel’le gelen HTMLBuilder classı ile view dosyalarımızı oluştururken, HTMLBuilder’ın sunduğu fonksiyonlar ile bazı işlemlerimizi daha pratik ve güvenli bir şekilde gerçekleştirebiliriz. Öğrendiğim birkaç tanesini paylaşıyorum. Tüm fonksiyonlar ve açıklamaları için de buraya link bırakıyorum.
script()
string script(string $url, array $attributes = array(), bool $secure = null)
Javascript dosyalarımız için link oluşturur.
{{ HTML::script("js/bootstrap.min.js") }}
Bu kod ile public/js
altındaki bootstrap.min.js
dosyasını dahil etmiş olduk.
style()
string style(string $url, array $attributes = array(), bool $secure = null)
CSS dosyalarımız için link oluşturur.
{{HTML::style("css/bootstrap.min.css")}}
public/css
altındaki bootstrap.min.css
için link hazır.
link()
string link(string $url, string $title = null, array $attributes = array(), bool $secure = null)
HTML linkleri oluşturur.
{{ HTML::link("http://www.cocotuts.com", "Cocotuts!") }}
ul()
string ul(array $list, array $attributes = array())
Dizinin elemanlarını sırasız liste şeklinde listeler.
routes.php
Route::get("anasayfa", function() { $list = array("A", "B", "C"); return View::make("anasayfa")->withList($list); });
anasayfa.blade.php
{{ HTML::ul($list) }}
ol()
string ol(array $list, array $attributes = array())
Dizi elemanlarını sıralı liste şeklinde listeler.
{{ HTML::ol($list) }}
Sırada Ne Var?
Sıradaki eğitim konum Form’lar.
- GET ve POST
- FormBuilder
Hatırlatma1: Laravel öğrenmek için bu linkteki eğitimi takip ediyorum ve öğrendiklerimi burada paylaşıyorum.Buraya tıklayarak eğitimin anasayfasına ulaşabilir ve kaynak kodlarını indirebilirsiniz.
Hatırlatma2: Lütfen eksik,hatalı ya da düzeltilmesi gereken bir şey farkederseniz bana bildirin.
Yorumlar