Why Blade directives in Laravel? - Purpose & Use Cases

The Big Idea

Discover how Blade directives turn messy PHP views into clean, readable templates effortlessly!

The Scenario

Imagine writing HTML pages where you have to manually add PHP code for every condition, loop, or include. For example, showing a message only if a user is logged in means mixing lots of PHP tags inside your HTML.

The Problem

Manually mixing PHP and HTML gets messy fast. It's hard to read, easy to make mistakes, and difficult to maintain. You might forget to close tags or write complex PHP logic inside your views, making your code confusing.

The Solution

Blade directives let you write clean, simple commands inside your HTML templates. They handle conditions, loops, includes, and more with easy-to-read syntax, keeping your views neat and your logic clear.

Before vs After

✗ Before

<?php if($user): ?> <p>Welcome, <?php echo $user->name; ?></p> <?php endif; ?>

✓ After

@if($user) <p>Welcome, {{ $user->name }}</p> @endif

What It Enables

Blade directives make your templates easy to write, read, and maintain, so you can focus on building great features without messy code.

Real Life Example

When building a blog, you can easily show or hide edit buttons only for logged-in authors using simple Blade directives, without cluttering your HTML with PHP.

Key Takeaways

Blade directives simplify mixing logic and HTML.

They improve code readability and reduce errors.

They help you build dynamic views quickly and cleanly.

Practice

1. Which Blade directive is used to display a variable safely escaped in a Laravel view?

easy

A. @foreach($variable as $item)

B. @php $variable @endphp

C. {{ $variable }}

D. @if($variable)

Solution

1. Step 1: Understand Blade variable display

   Blade uses double curly braces {{ }} to safely display variables with HTML escaping.

2. Step 2: Identify correct directive for safe output

   The {{ $variable }} syntax outputs the variable safely, preventing XSS attacks.

3. Final Answer:

   {{ $variable }} -> Option C

4. Quick Check:

   Safe variable display = {{ $variable }} [OK]

Hint: Use double curly braces {{ }} for safe variable output [OK]

Common Mistakes:

• Using @php for output instead of {{ }}
• Confusing @if with variable display
• Using @foreach for single variable output

2. Which of the following is the correct syntax to start a Blade loop over an array $items?

easy

A. @loop($items as $item)

B. @for($items as $item)

C. @while($items as $item)

D. @foreach($items as $item)

Solution

1. Step 1: Recall Blade loop directives

   Blade uses @foreach to loop over arrays or collections.

2. Step 2: Match correct syntax

   The correct syntax is @foreach($items as $item), which loops through each item.

3. Final Answer:

   @foreach($items as $item) -> Option D

4. Quick Check:

   Loop over array = @foreach [OK]

Hint: Use @foreach for looping arrays in Blade [OK]

Common Mistakes:

• Using @loop which does not exist
• Using @for incorrectly for arrays
• Using @while for array loops

3. What will be the output of this Blade snippet if $count = 3?

@if($count > 5)
  Large
@elseif($count > 1)
  Medium
@else
  Small
@endif

medium

A. Large

B. Medium

C. Small

D. No output

Solution

1. Step 1: Evaluate the condition $count > 5

   Since $count = 3, 3 > 5 is false, so skip the first block.

2. Step 2: Evaluate the @elseif($count > 1) condition

   3 > 1 is true, so Blade outputs "Medium" and skips the @else.

3. Final Answer:

   Medium -> Option B

4. Quick Check:

   3 > 1 but not > 5 = Medium [OK]

Hint: Check conditions top to bottom; first true block runs [OK]

Common Mistakes:

• Choosing Large because 3 is close to 5
• Ignoring @elseif and picking @else
• Thinking all blocks output

4. Identify the error in this Blade snippet:

@foreach($users as $user)
  
{{ $user->name }}
@endforeach
@endfor

medium

A. Incorrect closing directive @endfor instead of @endforeach

B. Missing closing @endforeach directive

C. Incorrect variable name $user instead of $users

D. Missing opening @for directive

Solution

1. Step 1: Check loop opening and closing directives

   The loop starts with @foreach but incorrectly ends with @endfor.

2. Step 2: Match correct closing directive

   Blade requires @endforeach to close a @foreach loop, so @endfor is invalid here.

3. Final Answer:

   Incorrect closing directive @endfor instead of @endforeach -> Option A

4. Quick Check:

   Match @foreach with @endforeach [OK]

Hint: Close @foreach with @endforeach, not @endfor [OK]

Common Mistakes:

• Using @endfor to close @foreach
• Confusing $user and $users variables
• Missing closing directive entirely

5. You want to include a Blade template named header.blade.php inside your main view. Which directive correctly includes it and passes a variable $title with value 'Welcome'?

hard

A. @include('header', ['title' => 'Welcome'])

B. @include('header', $title = 'Welcome')

C. @include('header', ['title' => Welcome])

D. @include('header', title = 'Welcome')

Solution

1. Step 1: Recall correct syntax for @include with data

   Blade's @include accepts the view name and an associative array of data.

2. Step 2: Check array syntax for passing variables

   The correct way is @include('header', ['title' => 'Welcome']) with quotes around string values.

3. Final Answer:

   @include('header', ['title' => 'Welcome']) -> Option A

4. Quick Check:

   Pass variables as array in @include [OK]

Hint: Pass variables as array in @include(['key' => value]) [OK]

Common Mistakes:

• Passing variable without array brackets
• Missing quotes around string values
• Using assignment syntax inside @include