Mastering Blade Templates in Laravel 10.x for Web Developers 🚀

Mastering Blade Templates in Laravel 10.x for Web Developers 🚀

Hello fellow developers, today I'm going to guide you through the advanced utilization of Blade templates in Laravel 10.x. For those who haven't heard of Blade, it's Laravel's simple yet powerful templating engine. 😊

At first, let's create a new Laravel project.

composer create-project --prefer-dist laravel/laravel blade-templates

Once switched to the project directory, create a new Blade file under "resources/views" and name it as 'welcome.blade.php'.

Passing Data To Views 📊

Passing data to views is straightforward in Laravel. Let's say we want to pass a $title variable to our 'welcome' view.

return view('welcome', ['title' => 'Hello, Laravel Bladers!']);

Here, an associative array is used to pass data where key is the variable name inside the view.

Extending A Layout 🎭

With Blade, you can make use of layouts to maintain a consistent look and feel across your application. First, create a master layout. Let's name it 'app.blade.php' under resources/views/layouts directory.

<!-- Stored in resources/views/layouts/app.blade.php -->
<!DOCTYPE html>
<html>
<head>
    <title>@yield('title')</title>
</head>
<body>
    <div class="container">
        @yield('content')
    </div>
</body>
</html>

From this layout, @yield directive is used to inject content for the chosen section.

Now, in the welcome.blade.php file, extend from the master layout.

<!-- Stored in resources/views/welcome.blade.php -->
@extends('layouts.app')
@section('title', 'Welcome to Laravel!')
@section('content')
 <p>Welcome to Laravel Blade Templating!</p>
@endsection

@extend directive is used to extend a layout, and @section directive is used to override a specific section.

That's it for now, fellow devs! You're well on your way to mastering Laravel's Blade Templating engine. Practice and dig deeper into the documentation to discover even more capabilities!🚀

But please keep in mind that technology is advancing pretty fast, hence some of the links provided here might get outdated.

Reference links

  1. Laravel documentation: Blade link
  2. Laravel News: Getting Started with Blade Templating link
  3. Laravel from Scratch: Views and Blade Layouts link

Happy coding! 💻