Blade directives in Laravel - Cheat Sheet & Quick Revision

Recall & Review

beginner

What is a Blade directive in Laravel?

A Blade directive is a special instruction in Laravel's Blade templating engine that starts with @ and helps you write PHP code in your HTML templates easily and cleanly.

beginner

How do you write an if statement using Blade directives?

You use @if(condition) to start, @elseif(condition) for else if, @else for else, and close with @endif.

beginner

What does the @foreach directive do in Blade?

@foreach loops over each item in a collection or array and lets you display or process each item inside the loop.

intermediate

Explain the purpose of the @csrf directive.

@csrf adds a hidden input field with a security token to your forms. This helps protect your app from cross-site request forgery attacks.

beginner

How do you include another Blade view inside a Blade template?

Use the @include('view.name') directive to insert the content of another Blade view into your current template.

Which Blade directive is used to start a loop over an array?

A @foreach

B @if

C @include

D @csrf

@foreach is used to loop over arrays or collections in Blade templates.

What does the @csrf directive do in a Blade form?

A Includes another view

B Starts a conditional statement

C Loops over data

D Adds a security token to protect against CSRF attacks

@csrf adds a hidden input with a token to protect forms from cross-site request forgery.

How do you end an if statement in Blade?

A @endif

B @end

C @stop

D @close

You close an if statement with @endif in Blade templates.

Which directive would you use to insert another Blade view inside your template?

A @section

B @yield

C @include

D @extends

@include inserts the content of another Blade view into the current template.

What symbol do all Blade directives start with?

A %

B @

C $

D #

Blade directives always start with the @ symbol.

Describe how you would use Blade directives to create a conditional message that shows 'Welcome!' only if a user is logged in.

Think about how to check a condition and show content only when true.

Explain the role of the @csrf directive in Blade templates and why it is important for forms.

Consider what security risks forms face and how Laravel helps prevent them.

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