This comprehensive tutorial explains Blade templates in Laravel, guiding you step by step with code examples. You’ll learn how to use layouts, sections, loops, conditionals, and components to build reusable, clean, and maintainable views in Laravel. Ideal for beginners and those who want to master Laravel’s templating engine.
Table of contents [Show]
Every web application needs a way to display content to users. In Laravel, this job is handled by its powerful templating engine called Blade. Blade allows developers to build reusable views, apply layouts, and write clean, readable templates that make development faster and easier.
Unlike plain PHP or HTML files, Blade gives you elegant syntax for control structures, template inheritance, and components. Once you start using Blade, building user interfaces becomes enjoyable and efficient.
Blade is Laravel’s built-in template engine. It compiles templates into plain PHP and caches them for performance. The syntax is simple and expressive, making it a joy to use.
.blade.php extension.resources/views directory.Let’s create a basic Blade template inside the resources/views directory.
<!-- resources/views/welcome.blade.php -->
<!DOCTYPE html>
<html>
<head>
<title>Welcome Page</title>
</head>
<body>
<h1>Hello, Laravel Blade!</h1>
</body>
</html>Now define a route to render this view:
// routes/web.php
Route::get('/', function () {
return view('welcome');
});
You can display variables using curly braces:
<h1>Hello, {{ $name }}</h1>Blade automatically escapes data. Use {!! !!} to render raw HTML.
{{-- This is a Blade comment --}}Blade comments are not included in the rendered HTML:
{{-- This is a Blade comment --}}Blade provides clean directives for conditions and loops.
@if ($user->isAdmin())
<p>Welcome, Admin!</p>
@elseif ($user->isEditor())
<p>Welcome, Editor!</p>
@else
<p>Welcome, Guest!</p>
@endif@foreach ($posts as $post)
<li>{{ $post->title }}</li>
@endforeach
@for ($i = 0; $i < 5; $i++)
<p>Iteration {{ $i }}</p>
@endfor@foreach ($users as $user)
@if ($loop->first)
<p>First User: {{ $user->name }}</p>
@endif
@if ($loop->last)
<p>Last User: {{ $user->name }}</p>
@endif
@endforeachOne of Blade’s most powerful features is template inheritance, allowing you to create layouts and extend them.
<!-- resources/views/layouts/app.blade.php -->
<!DOCTYPE html>
<html>
<head>
<title>@yield('title')</title>
</head>
<body>
<header>
<h1>My Laravel App</h1>
</header>
<main>
@yield('content')
</main>
</body>
</html><!-- resources/views/home.blade.php -->
@extends('layouts.app')
@section('title', 'Home Page')
@section('content')
<h2>Welcome Home</h2>
<p>This is the home page content.</p>
@endsectionYou can include smaller view files for reuse, such as headers and footers.
<!-- resources/views/partials/navbar.blade.php -->
<nav>
<a href="/">Home</a>
<a href="/about">About</a>
</nav>
<!-- In layout -->
@include('partials.navbar')
Components allow you to create reusable, independent UI elements.
php artisan make:component AlertThis creates:
app/View/Components/Alert.phpresources/views/components/alert.blade.php<!-- resources/views/components/alert.blade.php -->
<div >
{{ $slot }}
</div><x-alert type="success">
Your account has been created!
</x-alert>Blade comes with many directives to simplify your templates.
| Directive | Usage | Description |
|---|---|---|
@if / @endif | @if($user) ... @endif | Conditional statements |
@foreach | @foreach($items as $item) | Loop through items |
@include | @include('view') | Include partial view |
@extends | @extends('layout') | Extend a parent layout |
@section | @section('content') | Define a section for layout |
@yield | @yield('content') | Output a section in layout |
<!-- Layout -->
@stack('scripts')
<!-- Child view -->
@push('scripts')
<script src="/js/app.js"></script>
@endpush@inject('metrics', 'App\Services\MetricsService')
<p>Total Users: {{ $metrics->countUsers() }}</p>
// AppServiceProvider.php
use Illuminate\Support\Facades\Blade;
public function boot()
{
Blade::directive('datetime', function ($expression) {
return "<?php echo ($expression)->format('m/d/Y H:i'); ?>";
});
}
@datetime($post->created_at)Blade templates in Laravel make building user interfaces a breeze. From basic variable rendering to advanced features like template inheritance and reusable components, Blade is both powerful and elegant.
By following the step-by-step examples in this guide, you now know how to:
Keep practicing, refactor your templates into components, and you’ll see how Blade helps maintain a clean and scalable Laravel application.
This article is a comprehensive tutorial on using the Prohibited Validation Rules in Laravel. You will learn how to apply prohibited, prohibited_if, and prohibited_unless with clear explanations, real-life scenarios, and code examples. This guide is perfect for developers who want to master advanced validation techniques in Laravel applications.
This detailed tutorial explores request validation in Laravel controllers. You’ll learn multiple techniques—basic controller validation, using form request classes, custom rules, conditional validation, error handling, localization, and best practices. With practical examples, code snippets, and structured explanations, this article is designed for beginners to advance learner.
This guide teaches you how to deploy Laravel applications to production servers. From preparing your environment and configuring Nginx or Apache, to database migrations, caching, performance optimization, CI/CD pipelines, and security practices—this article covers everything step by step.It’s suitable for both beginners and advanced developers who want to ship stable, secure & scalable app.
