Laravel is a very popular framework of PHP. Laravel provides many features to developers like strong authentication, routing system etc., which are used to create a strong application. One important feature among these features is Blade Template, this is a very powerful template engine that allows developers to write clean, readable and maintainable frontend code. In this article, we will learn about Blade Template in Laravel in detail with the help of syntax & examples.
What is Blade?
Blade is a very simple, easy but powerfull template engine. It does not restrict us from writing plain PHP code like other PHP template engines. This means, we can easily write normal PHP code in it. Like all template engines, Blade also compiles and caches in plain PHP until there is no update in the code. That is why the performance of Blade template is very good.
Why Use Blade?
- We write the syntax of blade in very easy & clean way.
- In blade we can manage multiple layouts and also reuse components.
- Whatever output we get from the blade is automatically protected from XSS atatcks.
How to Setting Up a Blade Template
In Laravel, all blade files are created in the resources/views directory. All blade files have the extension .blade.php. For example
sample.blade.php
<!DOCTYPE html>
<html>
<head>
<title>Welcome</title>
</head>
<body>
<h1>Welcome To The World of PHP</h1>
</body>
</html>
Whenever we need to print a variable in a Blade template, we do it using {{ $fname }}. For example,
<!DOCTYPE html>
<html>
<head>
<title>First Name</title>
</head>
<body>
<h1>My first name is {{ $fname }}</h1>
</body>
</html>
Blade Includes
Just like in PHP we include one file inside another file, similarly in Blade template engine we use @include. For example,
@include('partials.header')
In the above code, particles is a folder, and header is the file that is being included.
Template Inheritance
This is a very powerful feature of blade template engine, using which we can create base layout and can also use it in child view. For example,
Creating Layout
resources/views/layout.blade.php
<!DOCTYPE html>
<html>
<head>
@yield('meta')
</head>
<body>
<div class="container">
@yield('content')
</div>
</body>
</html>
We have created a base layout, now to create a new page, we will use this base layout with the help of @extends.
resources/views/home.blade.php
@extends('layout')
@section('meta')
<title>This is meta title</title>
@endsection
@section('content')
<h1>Welcome to Home Page of Our Website</h1>
@endsection
In the above code, we reuse the entire layout that we have created using @extends. And with the help of @section, whatever dynamic needs to be shown in @yield, we write that code.
Conditional Statement
Blade provides an easy syntax for conditional statements (like if, else).
@if($age > 18) <p>Eligible for voting</p> @elseif($age == 24) <p>Eligible for marriage</p> @else <p>Not Eligible for voting</p> @endif
Control Statement
Blade also provides easy syntax for control structures (like for, while, foreach).
@foreach($products as $product)
<p>{{ $product->name }}</p>
@endforeach
@for($x = 0; $x < 10; $x++)
<p>Number is: {{ $x }}</p>
@endfor
Conclusion
Laravel Blade is an effective solution that improves code clarity and development productivity. It is more than just a templating engine. Components, inheritance, control structures, and custom directives are some of Blade's capabilities that make Laravel UI development simple and effective, regardless of the size of the application.
