Blade چیست؟ آموزش کامل Blade در Laravel از صفر تا پیشرفته

اگر با Laravel کار کرده باشید، احتمالاً نام Blade را زیاد دیده‌اید. وقتی قرار است اطلاعاتی که در Controller تولید شده‌اند در یک صفحه HTML نمایش داده شوند، معمولاً Blade یکی از مهم‌ترین ابزارهایی است که در این مسیر استفاده می‌کنیم.

Blade سیستم Template Engine لاراول است و به ما اجازه می‌دهد در کنار HTML، از قابلیت‌هایی مانند شرط‌ها، حلقه‌ها، Layoutها، Componentها و نمایش داده‌های PHP استفاده کنیم؛ بدون اینکه مجبور باشیم تمام منطق نمایش صفحات را با PHP خام بنویسیم.

برای مثال، به جای اینکه برای نمایش یک نام ساده وارد کدهای طولانی PHP شویم، می‌توانیم بنویسیم:


<h1>{{ $name }}</h1>

یا برای نمایش لیستی از محصولات:


@foreach ($products as $product)

    <h2>{{ $product->name }}</h2>

@endforeach

در این مقاله از پایه با Blade در Laravel آشنا می‌شویم و سپس سراغ مهم‌ترین قابلیت‌های آن مانند Layout، @extends، @section، @yield، @include، Componentها، شرط‌ها، حلقه‌ها، فرم‌ها و نکات امنیتی می‌رویم.

Blade در Laravel چیست؟

Blade Template Engine پیش‌فرض Laravel برای ساخت رابط کاربری و صفحات HTML است.

فایل‌های Blade معمولاً با پسوند زیر ذخیره می‌شوند:


.blade.php

برای مثال:


resources/views/home.blade.php

Blade در اصل به شما اجازه می‌دهد HTML را با Syntaxهای مخصوص Laravel ترکیب کنید.

یک نمونه ساده:


<h1>{{ $title }}</h1>



<p>{{ $description }}</p>

در اینجا:

<h1> و <p> مربوط به HTML هستند.
{{ $title }} و {{ $description }} مربوط به Blade هستند.
متغیرها معمولاً از Controller یا سایر بخش‌های برنامه به View ارسال می‌شوند.

بنابراین می‌توان گفت:

> Blade پلی بین داده‌های برنامه Laravel و HTML قابل نمایش برای کاربر است.

# Blade چه مشکلی را حل می‌کند؟

فرض کنید یک سایت فروشگاهی ساخته‌ایم و می‌خواهیم نام، قیمت و وضعیت محصولات را نمایش دهیم.

اگر بخواهیم همه چیز را با PHP خام داخل HTML انجام دهیم، کد به‌مرور شلوغ و سخت‌خوان می‌شود.

مثلاً:


<h1>

<?php echo htmlspecialchars($product->name); ?>

</h1>

اما در Blade می‌توانیم بنویسیم:


<h1>{{ $product->name }}</h1>

این Syntax ساده‌تر و خواناتر است.

Blade همچنین برای ساخت ساختارهای مشترک صفحات بسیار کاربردی است.

مثلاً می‌توانیم یک Layout اصلی داشته باشیم:


layouts/

    app.blade.php

و صفحات مختلف سایت را بر اساس آن بسازیم:


products/

    index.blade.php

    show.blade.php



users/

    profile.blade.php

در نتیجه لازم نیست Header، Footer و ساختار کلی سایت را در تمام صفحات دوباره بنویسیم.

# فایل‌های Blade کجا قرار می‌گیرند؟

فایل‌های View معمولاً داخل مسیر زیر قرار می‌گیرند:


resources/views

مثلاً:


resources/views/home.blade.php

یا:


resources/views/products/index.blade.php

در حالت دوم، ساختار پوشه به شکل زیر است:


resources

└── views

    └── products

        └── index.blade.php

برای نمایش این View می‌توانیم از نام View استفاده کنیم:


return view('products.index');

نقطه (.) در نام View نشان‌دهنده سطح پوشه است.

# پسوند blade.php چیست؟

وقتی فایلی مانند زیر می‌بینید:


home.blade.php

بخش:


.blade.php

به Laravel اعلام می‌کند که این فایل یک Template مربوط به Blade است.

مثلاً:


home.blade.php

profile.blade.php

products.blade.php

همگی فایل‌های Blade هستند.

# تفاوت Blade با PHP معمولی چیست؟

Blade جایگزین PHP نیست.

Blade در واقع یک سیستم Template است که برای نوشتن Viewهای Laravel طراحی شده است.

برای مثال در PHP معمولی ممکن است بنویسیم:


<?php if ($user): ?>

    <h1><?php echo $user->name; ?></h1>

<?php endif; ?>

در Blade می‌توانیم بنویسیم:


@if ($user)

    <h1>{{ $user->name }}</h1>

@endif

مزیت اصلی Blade این است که Syntax آن برای ساخت صفحات HTML خواناتر و مناسب‌تر است.

# نمایش متغیر در Blade

یکی از پرکاربردترین قابلیت‌های Blade، نمایش داده‌ها است.

برای نمایش یک متغیر از Syntax زیر استفاده می‌کنیم:


{{ $name }}

مثلاً:


<h1>{{ $name }}</h1>

اگر مقدار $name برابر باشد با:


Saeed

خروجی HTML چیزی شبیه این خواهد بود:


<h1>Saeed</h1>

# نمایش اطلاعات Object در Blade

فرض کنید یک محصول داریم:


$product

می‌توانیم مشخصات آن را به شکل زیر نمایش دهیم:


<h1>{{ $product->name }}</h1>



<p>{{ $product->price }}</p>

یا:


<span>{{ $product->category->name }}</span>

به این ترتیب Blade می‌تواند با داده‌هایی که از Model و Eloquent دریافت می‌کنیم کار کند.

# امنیت و Escape کردن خروجی در Blade

یکی از نکات بسیار مهم Blade مربوط به امنیت خروجی است.

وقتی از این Syntax استفاده می‌کنیم:


{{ $content }}

Blade خروجی را به صورت Escape شده نمایش می‌دهد.

این ویژگی برای جلوگیری از بسیاری از مشکلات مربوط به نمایش HTML و XSS بسیار مهم است.

برای مثال اگر مقدار متغیر شامل HTML باشد:


$content = '<script>alert("test")</script>';

استفاده از:


{{ $content }}

باعث می‌شود محتوا به شکل Escape شده نمایش داده شود، نه اینکه مستقیماً به عنوان HTML اجرا شود.

# نمایش HTML خام با {!! !!}

Blade امکان نمایش خروجی بدون Escape را نیز دارد:


{!! $content !!}

این قابلیت باید با احتیاط بسیار زیادی استفاده شود.

مثلاً اگر $content از یک کاربر ناشناس دریافت شده باشد، نمایش مستقیم آن می‌تواند خطر XSS ایجاد کند.

بنابراین:


{{ $content }}

در حالت عادی انتخاب امن‌تری است.

و:


{!! $content !!}

باید فقط زمانی استفاده شود که به منبع و محتوای داده اطمینان داشته باشیم یا داده قبل از نمایش به شکل مناسب پاک‌سازی شده باشد.

# شرط‌ها در Blade

Blade Syntax مخصوصی برای شرط‌ها دارد.

دستور @if

مثال:


@if ($user)

    <p>کاربر وارد شده است.</p>

@endif

@if و @else


@if ($user)

    <p>سلام {{ $user->name }}</p>

@else

    <p>لطفاً وارد حساب کاربری شوید.</p>

@endif

@elseif


@if ($role === 'admin')

    <p>مدیر سیستم</p>

@elseif ($role === 'editor')

    <p>ویرایشگر</p>

@else

    <p>کاربر عادی</p>

@endif

# دستور @unless

گاهی می‌خواهیم زمانی چیزی را نمایش دهیم که یک شرط برقرار نباشد.

برای این کار می‌توانیم از @unless استفاده کنیم:


@unless ($user)

    <p>لطفاً وارد حساب کاربری شوید.</p>

@endunless

این کد تقریباً معادل این است:


@if (!$user)

    <p>لطفاً وارد حساب کاربری شوید.</p>

@endif

# بررسی وجود متغیر با @isset

اگر بخواهیم بررسی کنیم متغیری تعریف شده است یا خیر:


@isset($user)

    <p>{{ $user->name }}</p>

@endisset

این Syntax در Viewهایی که ممکن است یک داده اختیاری دریافت کنند بسیار کاربردی است.

# بررسی خالی بودن داده با @empty

می‌توانیم بررسی کنیم مقدار خالی است یا خیر:


@empty($products)

    <p>محصولی وجود ندارد.</p>

@endempty

# حلقه‌ها در Blade

نمایش لیست داده‌ها یکی از رایج‌ترین کارهایی است که در Blade انجام می‌دهیم.

@foreach

مثلاً:


@foreach ($products as $product)

    <h2>{{ $product->name }}</h2>

    <p>{{ $product->price }}</p>

@endforeach

اگر $products شامل چند محصول باشد، Blade برای هر محصول این بخش را اجرا می‌کند.

# @forelse

یکی از Syntaxهای بسیار کاربردی Blade، @forelse است.

این دستور زمانی مفید است که بخواهیم هم لیست را نمایش دهیم و هم حالت خالی بودن آن را مدیریت کنیم.


@forelse ($products as $product)



    <h2>{{ $product->name }}</h2>



@empty



    <p>هیچ محصولی پیدا نشد.</p>



@endforelse

این کار باعث می‌شود نیازی به نوشتن یک شرط جداگانه برای بررسی خالی بودن لیست نداشته باشیم.

# @for در Blade

برای حلقه‌های عددی می‌توانیم از @for استفاده کنیم:


@for ($i = 1; $i <= 5; $i++)

    <p>شماره {{ $i }}</p>

@endfor

# @while در Blade

در صورت نیاز می‌توانیم از @while نیز استفاده کنیم:


@while ($count < 5)



    <p>{{ $count }}</p>



    @php

        $count++;

    @endphp



@endwhile

البته در Viewها معمولاً بهتر است منطق پیچیده را به Controller، Service یا بخش مناسب دیگری منتقل کنیم.

# متغیر $loop در Blade

یکی از قابلیت‌های بسیار کاربردی @foreach در Blade، متغیر $loop است.

مثلاً:


@foreach ($products as $product)



    <p>{{ $loop->iteration }} - {{ $product->name }}</p>



@endforeach

ویژگی‌های متداول $loop شامل مواردی مانند:


$loop->index

$loop->iteration

$loop->first

$loop->last

$loop->count

است.

مثلاً:


@foreach ($products as $product)



    @if ($loop->first)

        <strong>اولین محصول</strong>

    @endif



    <p>{{ $product->name }}</p>



@endforeach

# استفاده از Include در Blade

فرض کنید Header سایت در چند صفحه استفاده می‌شود.

به جای کپی کردن Header در تمام فایل‌ها می‌توانیم آن را جدا کنیم:


resources/views/partials/header.blade.php

سپس در View اصلی بنویسیم:


@include('partials.header')

همین روش برای Footer نیز قابل استفاده است:


@include('partials.footer')

# ارسال داده به Include

می‌توانیم هنگام Include کردن یک فایل، داده نیز ارسال کنیم:


@include('partials.product-card', [

    'product' => $product

])

در فایل:


product-card.blade.php

می‌توانیم بنویسیم:


<h2>{{ $product->name }}</h2>

این روش برای بخش‌های تکرارشونده صفحه بسیار مفید است.

# Layout در Blade چیست؟

در پروژه‌های واقعی، معمولاً صفحات زیادی داریم که ساختار مشترکی دارند.

مثلاً همه صفحات دارای:

Header
Navigation
محتوا
Footer

هستند.

اگر این ساختار را در تک‌تک صفحات تکرار کنیم، نگهداری پروژه سخت می‌شود.

Blade برای این مشکل مفهوم Layout را در اختیار ما قرار می‌دهد.

# @extends در Blade

ابتدا یک Layout اصلی ایجاد می‌کنیم:


resources/views/layouts/app.blade.php

مثلاً:


<!DOCTYPE html>

<html lang="fa">

<head>

    <meta charset="UTF-8">



    <title>@yield('title')</title>

</head>



<body>



    <header>

        <h1>CMS Nevis</h1>

    </header>



    <main>

        @yield('content')

    </main>



    <footer>

        <p>تمام حقوق محفوظ است.</p>

    </footer>



</body>

</html>

حالا یک صفحه می‌تواند از این Layout استفاده کند:


@extends('layouts.app')



@section('title', 'صفحه اصلی')



@section('content')



    <h2>به سایت خوش آمدید</h2>



@endsection

# @yield در Blade

در Layout، از @yield برای مشخص کردن محل قرارگیری محتوای صفحات استفاده می‌کنیم:


@yield('content')

یعنی صفحه فرزند می‌تواند بخشی با نام content تعریف کند:


@section('content')



    <h1>محتوای صفحه</h1>



@endsection

Laravel محتوای این بخش را در محل @yield('content') قرار می‌دهد.

# @section در Blade

برای تعریف محتوای یک Section از @section استفاده می‌کنیم:


@section('content')



    <h1>محصولات</h1>



@endsection

می‌توانیم مقدار کوتاه را نیز به صورت یک‌خطی تعریف کنیم:


@section('title', 'محصولات')

# @parent در Blade

گاهی می‌خواهیم محتوای Section مربوط به Layout اصلی را حفظ کنیم و چیزی نیز به آن اضافه کنیم.

در چنین شرایطی می‌توان از:


@parent

استفاده کرد.

مثلاً:


@section('content')



    @parent



    <p>محتوای اضافی صفحه</p>



@endsection

# تفاوت @include و @extends

این دو دستور ممکن است در ابتدا شبیه به هم به نظر برسند، اما کاربرد متفاوتی دارند.

دستور	کاربرد
`@extends`	استفاده از یک Layout اصلی
`@include`	وارد کردن یک View یا بخش کوچک‌تر
`@section`	تعریف محتوای یک بخش
`@yield`	مشخص کردن محل نمایش Section

مثلاً:


@extends('layouts.app')

یعنی صفحه از Layout اصلی استفاده می‌کند.

اما:


@include('partials.header')

یعنی یک View کوچک‌تر را در همین صفحه وارد کن.

# Blade Component چیست؟

در پروژه‌های بزرگ، @include همیشه بهترین راه برای ساخت اجزای قابل استفاده مجدد نیست.

Blade امکان استفاده از Component را نیز فراهم می‌کند.

مثلاً می‌توانیم یک Component برای دکمه ایجاد کنیم:


<x-button>

    ذخیره

</x-button>

یا یک Component برای کارت محصول داشته باشیم:


<x-product-card :product="$product" />

Componentها باعث می‌شوند اجزای رابط کاربری قابل استفاده مجدد، منظم‌تر و قابل نگهداری‌تر باشند.

# Component در Blade چه زمانی مفید است؟

فرض کنید در یک فروشگاه اینترنتی صدها بار کارت محصول داریم.

به جای تکرار HTML کارت در صفحات مختلف می‌توانیم یک Component داشته باشیم:


resources/views/components/product-card.blade.php

و در صفحات مختلف استفاده کنیم:


<x-product-card :product="$product" />

این کار از تکرار کد جلوگیری می‌کند.

# ارسال داده به Component

می‌توانیم داده را به Component ارسال کنیم:


<x-product-card :product="$product" />

در Component می‌توانیم آن داده را دریافت کرده و نمایش دهیم.

برای Componentهای مختلف می‌توان از روش‌های مختلف تعریف Props استفاده کرد؛ نکته مهم این است که Component مسئول نمایش یک بخش مشخص و قابل استفاده مجدد از رابط کاربری باشد.

# Slot در Blade

Componentها می‌توانند محتوای داخلی نیز دریافت کنند.

مثلاً:


<x-card>

    <h2>عنوان کارت</h2>



    <p>متن کارت</p>

</x-card>

محتوای بین تگ‌های Component را می‌توان به عنوان Slot در Component دریافت و نمایش داد.

این قابلیت برای ساخت Componentهای عمومی بسیار مفید است.

# Directive در Blade چیست؟

دستورهایی که با @ در Blade نوشته می‌شوند، معمولاً با نام Blade Directive شناخته می‌شوند.

مثلاً:


@if

@foreach

@include

@extends

@section

@auth

@guest

همه نمونه‌هایی از Directiveهای Blade هستند.

Blade تعداد زیادی Directive آماده در اختیار توسعه‌دهنده قرار می‌دهد.

# نمایش فرم‌ها در Blade

Blade برای ساخت فرم‌های Laravel نیز Syntaxهای مفیدی دارد.

مثلاً برای جلوگیری از مشکلات CSRF، در فرم‌های POST معمولاً از:


<form method="POST" action="{{ route('products.store') }}">



    @csrf



    <input type="text" name="name">



    <button type="submit">

        ذخیره

    </button>



</form>

استفاده می‌کنیم.

دستور:


@csrf

توکن CSRF مورد نیاز فرم را تولید می‌کند.

# استفاده از @method در فرم

HTML به صورت مستقیم تمام متدهای HTTP مورد استفاده در Laravel مانند PUT یا DELETE را در فرم‌های معمولی پشتیبانی نمی‌کند.

Blade امکان استفاده از Method Spoofing را فراهم می‌کند.

مثلاً:


<form method="POST" action="{{ route('products.update', $product) }}">



    @csrf

    @method('PUT')



    <input type="text" name="name" value="{{ $product->name }}">



    <button type="submit">

        ویرایش

    </button>



</form>

# نمایش خطاهای Validation در Blade

پس از Validation، معمولاً لازم است خطاها را به کاربر نمایش دهیم.

Blade برای این کار Directiveهایی مانند @error دارد:


@error('name')

    <div class="error">

        {{ $message }}

    </div>

@enderror

این Syntax باعث می‌شود اگر برای فیلد name خطایی وجود داشته باشد، پیام خطا نمایش داده شود.

# استفاده از old در فرم‌ها

فرض کنید فرم ارسال شده اما Validation با خطا مواجه شده است.

برای حفظ مقدار قبلی یک فیلد می‌توان از old() استفاده کرد:


<input

    type="text"

    name="name"

    value="{{ old('name') }}"

>

در نتیجه کاربر مجبور نیست بعد از هر خطای Validation تمام اطلاعات فرم را دوباره وارد کند.

# Directiveهای مربوط به Authentication

Blade همچنین برای نمایش بخش‌هایی بر اساس وضعیت ورود کاربر Directive دارد.

مثلاً:


@auth

    <p>شما وارد حساب کاربری شده‌اید.</p>

@endauth

برای کاربران مهمان:


@guest

    <a href="{{ route('login') }}">

        ورود

    </a>

@endguest

این قابلیت برای ساخت Navigationهای مختلف بر اساس وضعیت کاربر بسیار کاربردی است.

# Authorization در Blade

در پروژه‌هایی که سیستم دسترسی دارند، می‌توان نمایش بخش‌های خاص را بر اساس Permission یا Ability کنترل کرد.

برای مثال:


@can('update', $product)



    <a href="{{ route('products.edit', $product) }}">

        ویرایش

    </a>



@endcan

البته باید توجه داشت که مخفی کردن یک دکمه در Blade به تنهایی جایگزین Authorization سمت سرور نیست.

کاربر نباید صرفاً به این دلیل که یک دکمه در View دیده نمی‌شود، از دسترسی به عملیات محافظت‌شده برخوردار باشد.

# استفاده از route در Blade

یکی از موارد بسیار رایج در Viewهای Laravel ساخت URL برای Routeها است.

مثلاً:


<a href="{{ route('products.index') }}">

    محصولات

</a>

برای Route دارای پارامتر:


<a href="{{ route('products.show', $product) }}">

    مشاهده محصول

</a>

این روش معمولاً بهتر از نوشتن URLهای ثابت در قسمت‌های مختلف پروژه است.

# استفاده از Assetها در Blade

در پروژه‌های Laravel معمولاً فایل‌های CSS و JavaScript نیز باید به View متصل شوند.

در پروژه‌هایی که از Vite استفاده می‌کنند، می‌توان از Directive مربوط به Vite استفاده کرد:


@vite(['resources/css/app.css', 'resources/js/app.js'])

این کار اتصال Assetهای پروژه به صفحه را مدیریت می‌کند.

# Stackها در Blade

گاهی Layout اصلی باید اجازه دهد صفحات فرزند فایل CSS یا JavaScript مخصوص خودشان را اضافه کنند.

برای این کار می‌توان از:


@stack('scripts')

در Layout استفاده کرد.

سپس در صفحه فرزند:


@push('scripts')



<script>

    console.log('Product page');

</script>



@endpush

محتوای Push شده در محل @stack('scripts') قرار می‌گیرد.

این روش برای Scriptهای اختصاصی صفحات بسیار کاربردی است.

# @once در Blade

گاهی می‌خواهیم بخشی از View فقط یک بار اجرا یا درج شود، حتی اگر آن بخش در چند مسیر رندر شود.

برای چنین مواردی می‌توان از:


@once



    <script>

        // code

    </script>



@endonce

استفاده کرد.

# آیا می‌توان داخل Blade کد PHP نوشت؟

Blade امکان استفاده از @php را نیز فراهم می‌کند:


@php

    $total = 100;

@endphp

اما این قابلیت به معنی آن نیست که باید منطق اصلی برنامه را داخل View قرار دهیم.

مثلاً چنین کاری مناسب نیست:


@php



    // محاسبات پیچیده

    // Query دیتابیس

    // منطق تجاری

    // پردازش سفارش



@endphp

بهتر است منطق برنامه در بخش‌های مناسب مانند Controller، Service، Model یا سایر لایه‌های معماری قرار بگیرد و Blade عمدتاً مسئول نمایش باشد.

# یک مثال واقعی؛ ساخت صفحه محصولات با Blade

فرض کنید Controller ما محصولات را به View ارسال می‌کند:


public function index()

{

    $products = Product::latest()->get();



    return view('products.index', compact('products'));

}

حالا فایل زیر را داریم:


resources/views/products/index.blade.php

می‌توانیم بنویسیم:


@extends('layouts.app')



@section('title', 'محصولات')



@section('content')



    <h1>محصولات</h1>



    @forelse ($products as $product)



        <article>



            <h2>

                {{ $product->name }}

            </h2>



            <p>

                قیمت:

                {{ $product->price }}

            </p>



            <a href="{{ route('products.show', $product) }}">

                مشاهده محصول

            </a>



        </article>



    @empty



        <p>

            هنوز محصولی ثبت نشده است.

        </p>



    @endforelse



@endsection

در این مثال چند مفهوم مهم Blade را همزمان استفاده کردیم:

@extends
@section
@forelse
@empty
{{ }}
route()

# ساختار پیشنهادی Viewها در یک پروژه واقعی

وقتی پروژه بزرگ‌تر می‌شود، بهتر است Viewها را نیز منظم کنیم.

مثلاً:


resources/views/

│

├── layouts/

│   └── app.blade.php

│

├── components/

│   ├── button.blade.php

│   └── product-card.blade.php

│

├── partials/

│   ├── header.blade.php

│   ├── footer.blade.php

│   └── navigation.blade.php

│

├── products/

│   ├── index.blade.php

│   ├── create.blade.php

│   ├── edit.blade.php

│   └── show.blade.php

│

└── users/

    ├── profile.blade.php

    └── settings.blade.php

البته ساختار دقیق پوشه‌ها به اندازه و معماری پروژه بستگی دارد.

# تفاوت View و Blade چیست؟

این دو اصطلاح را نباید کاملاً یکی بدانیم.

View به صفحه یا لایه نمایش برنامه اشاره دارد.

Blade ابزاری است که Laravel برای ساخت این Viewها در اختیار ما قرار می‌دهد.

مثلاً:


resources/views/products/index.blade.php

یک View است که با استفاده از Blade نوشته شده است.

پس می‌توان گفت:

> View مفهوم کلی لایه نمایش است و Blade یکی از ابزارهای اصلی Laravel برای ساخت آن است.

# Blade و Controller چگونه با هم کار می‌کنند؟

فرآیند ساده یک درخواست می‌تواند تقریباً به این شکل باشد:


Browser

   ↓

Route

   ↓

Controller

   ↓

Model / Service

   ↓

Data

   ↓

View

   ↓

Blade

   ↓

HTML

   ↓

Browser

مثلاً کاربر وارد این URL می‌شود:


/products

Route درخواست را به Controller می‌فرستد:


Route::get('/products', [ProductController::class, 'index']);

Controller داده را دریافت می‌کند:


public function index()

{

    $products = Product::all();



    return view('products.index', compact('products'));

}

و Blade داده را نمایش می‌دهد:


@foreach ($products as $product)



    <h2>{{ $product->name }}</h2>



@endforeach

این یکی از مهم‌ترین جریان‌هایی است که باید هنگام یادگیری Laravel درک کنید.

# بهترین روش‌های استفاده از Blade

برای اینکه Viewهای پروژه در آینده قابل نگهداری باشند، چند نکته مهم را رعایت کنید.

۱. منطق تجاری را داخل Blade قرار ندهید

Blade باید تا حد امکان روی نمایش تمرکز کند.

کدهایی مانند:


@php

    // business logic

@endphp

اگر زیاد شوند، نشانه مناسبی نیستند.

۲. Query دیتابیس را داخل View انجام ندهید

مثلاً بهتر است چنین چیزی نداشته باشیم:


@php

    $products = Product::all();

@endphp

بهتر است Controller یا Service داده مورد نیاز View را آماده کند.

۳. از Componentها برای اجزای تکراری استفاده کنید

اگر یک کارت محصول یا دکمه در قسمت‌های زیادی استفاده می‌شود، Component می‌تواند انتخاب مناسبی باشد.

۴. خروجی کاربران را به صورت پیش‌فرض Escape کنید

تا زمانی که دلیل مشخصی ندارید، ترجیحاً از:


{{ $content }}

استفاده کنید و در استفاده از:


{!! $content !!}

احتیاط کنید.

۵. Layout مشترک داشته باشید

Header، Footer و ساختار کلی سایت را در یک Layout قرار دهید تا از تکرار کد جلوگیری شود.

۶. Viewها را دسته‌بندی کنید

در پروژه‌های متوسط و بزرگ، Viewهای مربوط به بخش‌های مختلف را در پوشه‌های جدا قرار دهید.

# اشتباهات رایج هنگام کار با Blade

اشتباه اول: استفاده نادرست از @ و Syntax Blade

مثلاً:


@if ($user)

    ...

باید با:


@endif

بسته شود.

همین موضوع درباره Directiveهای دیگر نیز صدق می‌کند.

اشتباه دوم: استفاده از متغیر تعریف‌نشده

اگر Controller متغیری ارسال نکرده باشد و View مستقیماً از آن استفاده کند، ممکن است با خطا مواجه شوید.

مثلاً:


{{ $products }}

در حالی که Controller اصلاً $products را ارسال نکرده است.

اشتباه سوم: قرار دادن منطق سنگین در View

اگر یک فایل Blade صدها خط منطق PHP داشته باشد، بهتر است معماری آن بخش بررسی شود.

اشتباه چهارم: استفاده بدون احتیاط از {!! !!}

این Syntax می‌تواند HTML خام را نمایش دهد.

بنابراین برای داده‌های غیرقابل اعتماد نباید بدون بررسی استفاده شود.

اشتباه پنجم: تکرار بیش از حد HTML

اگر یک بخش بارها تکرار می‌شود، بررسی کنید آیا @include یا Component می‌تواند آن را به یک بخش قابل استفاده مجدد تبدیل کند یا خیر.

# Blade برای چه پروژه‌هایی مناسب است؟

Blade برای بسیاری از پروژه‌های Laravel که رابط کاربری آن‌ها سمت سرور رندر می‌شود، انتخاب بسیار مناسبی است.

برای مثال:

وب‌سایت‌های شرکتی
فروشگاه‌های اینترنتی
CMSها
پنل‌های مدیریت
سیستم‌های مالی
سیستم‌های آموزشی
سیستم‌های تیکتینگ
داشبوردها
سیستم‌های SaaS
وب‌اپلیکیشن‌های Laravel

البته Laravel می‌تواند در کنار تکنولوژی‌های Frontend مختلف نیز استفاده شود و انتخاب Blade به معماری و نیاز پروژه بستگی دارد.

# آیا برای یادگیری Laravel باید Blade را یاد بگیریم؟

اگر قصد دارید Laravel را به شکل کامل یاد بگیرید، آشنایی با Blade بسیار مهم است؛ مخصوصاً اگر قرار است با Viewهای Laravel و رابط کاربری سمت سرور کار کنید.

ترتیب مفهومی مناسبی که تا اینجا طی کرده‌ایم تقریباً چنین است:


Laravel

   ↓

Project Structure

   ↓

Route

   ↓

Controller

   ↓

View

   ↓

Blade

در ادامه نیز باید مفاهیمی مانند Middleware، Request، Validation، Session، Migration، Eloquent و سایر بخش‌های Laravel را یاد بگیریم.

# جمع‌بندی

Blade در Laravel یک Template Engine قدرتمند و خوانا برای ساخت Viewهای Laravel است.

با Blade می‌توانیم:

داده‌ها را در HTML نمایش دهیم.
شرط‌ها را مدیریت کنیم.
حلقه‌ها را اجرا کنیم.
Layoutهای مشترک بسازیم.
Viewهای مختلف را با @include ترکیب کنیم.
Componentهای قابل استفاده مجدد ایجاد کنیم.
فرم‌های Laravel را مدیریت کنیم.
خطاهای Validation را نمایش دهیم.
وضعیت Authentication و Authorization را در رابط کاربری مدیریت کنیم.
CSS و JavaScript مورد نیاز صفحات را مدیریت کنیم.

مهم‌ترین نکته این است که Blade را صرفاً مجموعه‌ای از Syntaxها نبینیم. Blade بخشی از معماری لایه نمایش Laravel است و باید مسئولیت اصلی آن نمایش داده‌ها و ساخت رابط کاربری باشد، نه اجرای منطق پیچیده تجاری برنامه.

در مقاله بعدی سراغ یکی از مفاهیم بسیار مهم Laravel می‌رویم:

Middleware در Laravel

Middleware بین درخواست ورودی و بخش‌های مختلف برنامه قرار می‌گیرد و برای کارهایی مانند احراز هویت، بررسی دسترسی، فیلتر کردن درخواست‌ها و کنترل جریان Request کاربرد بسیار زیادی دارد.

سوالات متداول Blade در Laravel

Blade چیست؟

Blade سیستم Template Engine لاراول است که برای ساخت Viewهای Laravel استفاده می‌شود و امکان ترکیب HTML با Syntaxهای مخصوص Laravel را فراهم می‌کند.

فایل Blade چه پسوندی دارد؟

فایل‌های Blade معمولاً با پسوند زیر ساخته می‌شوند:


.blade.php

مثلاً:


home.blade.php

Blade با PHP چه تفاوتی دارد؟

Blade جایگزین PHP نیست؛ بلکه یک Template Engine است که Syntax مناسب‌تری برای ساخت Viewهای Laravel در اختیار توسعه‌دهنده قرار می‌دهد.

تفاوت @extends و @include چیست؟

@extends برای استفاده از یک Layout اصلی است، در حالی که @include برای وارد کردن یک View یا بخش قابل استفاده مجدد در View دیگر استفاده می‌شود.

تفاوت {{ }} و {!! !!} چیست؟

{{ }} خروجی را Escape می‌کند، در حالی که {!! !!} خروجی را به صورت HTML خام نمایش می‌دهد. به همین دلیل استفاده از {!! !!} برای داده‌های غیرقابل اعتماد می‌تواند خطر امنیتی داشته باشد.

آیا می‌توان در Blade کد PHP نوشت؟

بله، Blade امکان استفاده از @php را دارد؛ اما بهتر است منطق پیچیده برنامه داخل View قرار نگیرد و مسئولیت Blade عمدتاً به نمایش اطلاعات محدود شود.

Blade Component چیست؟

Component یک بخش قابل استفاده مجدد از رابط کاربری است که می‌توان آن را در Viewهای مختلف استفاده کرد؛ برای مثال کارت محصول، دکمه، Alert یا Modal.

برای مثال، به جای اینکه برای نمایش یک نام ساده وارد کدهای طولانی PHP شویم، می‌توانیم بنویسیم:


<h1>{{ $name }}</h1>

یا برای نمایش لیستی از محصولات:


@foreach ($products as $product)

    <h2>{{ $product->name }}</h2>

@endforeach

Blade در Laravel چیست؟

Blade Template Engine پیش‌فرض Laravel برای ساخت رابط کاربری و صفحات HTML است.

فایل‌های Blade معمولاً با پسوند زیر ذخیره می‌شوند:


.blade.php

برای مثال:


resources/views/home.blade.php

Blade در اصل به شما اجازه می‌دهد HTML را با Syntaxهای مخصوص Laravel ترکیب کنید.

یک نمونه ساده:


<h1>{{ $title }}</h1>



<p>{{ $description }}</p>

در اینجا:

<h1> و <p> مربوط به HTML هستند.
{{ $title }} و {{ $description }} مربوط به Blade هستند.
متغیرها معمولاً از Controller یا سایر بخش‌های برنامه به View ارسال می‌شوند.

بنابراین می‌توان گفت:

> Blade پلی بین داده‌های برنامه Laravel و HTML قابل نمایش برای کاربر است.

# Blade چه مشکلی را حل می‌کند؟

فرض کنید یک سایت فروشگاهی ساخته‌ایم و می‌خواهیم نام، قیمت و وضعیت محصولات را نمایش دهیم.

اگر بخواهیم همه چیز را با PHP خام داخل HTML انجام دهیم، کد به‌مرور شلوغ و سخت‌خوان می‌شود.

مثلاً:


<h1>

<?php echo htmlspecialchars($product->name); ?>

</h1>

اما در Blade می‌توانیم بنویسیم:


<h1>{{ $product->name }}</h1>

این Syntax ساده‌تر و خواناتر است.

Blade همچنین برای ساخت ساختارهای مشترک صفحات بسیار کاربردی است.

مثلاً می‌توانیم یک Layout اصلی داشته باشیم:


layouts/

    app.blade.php

و صفحات مختلف سایت را بر اساس آن بسازیم:


products/

    index.blade.php

    show.blade.php



users/

    profile.blade.php

در نتیجه لازم نیست Header، Footer و ساختار کلی سایت را در تمام صفحات دوباره بنویسیم.

# فایل‌های Blade کجا قرار می‌گیرند؟

فایل‌های View معمولاً داخل مسیر زیر قرار می‌گیرند:


resources/views

مثلاً:


resources/views/home.blade.php

یا:


resources/views/products/index.blade.php

در حالت دوم، ساختار پوشه به شکل زیر است:


resources

└── views

    └── products

        └── index.blade.php

برای نمایش این View می‌توانیم از نام View استفاده کنیم:


return view('products.index');

نقطه (.) در نام View نشان‌دهنده سطح پوشه است.

# پسوند blade.php چیست؟

وقتی فایلی مانند زیر می‌بینید:


home.blade.php

بخش:


.blade.php

به Laravel اعلام می‌کند که این فایل یک Template مربوط به Blade است.

مثلاً:


home.blade.php

profile.blade.php

products.blade.php

همگی فایل‌های Blade هستند.

# تفاوت Blade با PHP معمولی چیست؟

Blade جایگزین PHP نیست.

Blade در واقع یک سیستم Template است که برای نوشتن Viewهای Laravel طراحی شده است.

برای مثال در PHP معمولی ممکن است بنویسیم:


<?php if ($user): ?>

    <h1><?php echo $user->name; ?></h1>

<?php endif; ?>

در Blade می‌توانیم بنویسیم:


@if ($user)

    <h1>{{ $user->name }}</h1>

@endif

مزیت اصلی Blade این است که Syntax آن برای ساخت صفحات HTML خواناتر و مناسب‌تر است.

# نمایش متغیر در Blade

یکی از پرکاربردترین قابلیت‌های Blade، نمایش داده‌ها است.

برای نمایش یک متغیر از Syntax زیر استفاده می‌کنیم:


{{ $name }}

مثلاً:


<h1>{{ $name }}</h1>

اگر مقدار $name برابر باشد با:


Saeed

خروجی HTML چیزی شبیه این خواهد بود:


<h1>Saeed</h1>

# نمایش اطلاعات Object در Blade

فرض کنید یک محصول داریم:


$product

می‌توانیم مشخصات آن را به شکل زیر نمایش دهیم:


<h1>{{ $product->name }}</h1>



<p>{{ $product->price }}</p>

یا:


<span>{{ $product->category->name }}</span>

به این ترتیب Blade می‌تواند با داده‌هایی که از Model و Eloquent دریافت می‌کنیم کار کند.

# امنیت و Escape کردن خروجی در Blade

یکی از نکات بسیار مهم Blade مربوط به امنیت خروجی است.

وقتی از این Syntax استفاده می‌کنیم:


{{ $content }}

Blade خروجی را به صورت Escape شده نمایش می‌دهد.

این ویژگی برای جلوگیری از بسیاری از مشکلات مربوط به نمایش HTML و XSS بسیار مهم است.

برای مثال اگر مقدار متغیر شامل HTML باشد:


$content = '<script>alert("test")</script>';

استفاده از:


{{ $content }}

باعث می‌شود محتوا به شکل Escape شده نمایش داده شود، نه اینکه مستقیماً به عنوان HTML اجرا شود.

# نمایش HTML خام با {!! !!}

Blade امکان نمایش خروجی بدون Escape را نیز دارد:


{!! $content !!}

این قابلیت باید با احتیاط بسیار زیادی استفاده شود.

مثلاً اگر $content از یک کاربر ناشناس دریافت شده باشد، نمایش مستقیم آن می‌تواند خطر XSS ایجاد کند.

بنابراین:


{{ $content }}

در حالت عادی انتخاب امن‌تری است.

و:


{!! $content !!}

# شرط‌ها در Blade

Blade Syntax مخصوصی برای شرط‌ها دارد.

دستور @if

مثال:


@if ($user)

    <p>کاربر وارد شده است.</p>

@endif

@if و @else


@if ($user)

    <p>سلام {{ $user->name }}</p>

@else

    <p>لطفاً وارد حساب کاربری شوید.</p>

@endif

@elseif


@if ($role === 'admin')

    <p>مدیر سیستم</p>

@elseif ($role === 'editor')

    <p>ویرایشگر</p>

@else

    <p>کاربر عادی</p>

@endif

# دستور @unless

گاهی می‌خواهیم زمانی چیزی را نمایش دهیم که یک شرط برقرار نباشد.

برای این کار می‌توانیم از @unless استفاده کنیم:


@unless ($user)

    <p>لطفاً وارد حساب کاربری شوید.</p>

@endunless

این کد تقریباً معادل این است:


@if (!$user)

    <p>لطفاً وارد حساب کاربری شوید.</p>

@endif

# بررسی وجود متغیر با @isset

اگر بخواهیم بررسی کنیم متغیری تعریف شده است یا خیر:


@isset($user)

    <p>{{ $user->name }}</p>

@endisset

این Syntax در Viewهایی که ممکن است یک داده اختیاری دریافت کنند بسیار کاربردی است.

# بررسی خالی بودن داده با @empty

می‌توانیم بررسی کنیم مقدار خالی است یا خیر:


@empty($products)

    <p>محصولی وجود ندارد.</p>

@endempty

# حلقه‌ها در Blade

نمایش لیست داده‌ها یکی از رایج‌ترین کارهایی است که در Blade انجام می‌دهیم.

@foreach

مثلاً:


@foreach ($products as $product)

    <h2>{{ $product->name }}</h2>

    <p>{{ $product->price }}</p>

@endforeach

اگر $products شامل چند محصول باشد، Blade برای هر محصول این بخش را اجرا می‌کند.

# @forelse

یکی از Syntaxهای بسیار کاربردی Blade، @forelse است.

این دستور زمانی مفید است که بخواهیم هم لیست را نمایش دهیم و هم حالت خالی بودن آن را مدیریت کنیم.


@forelse ($products as $product)



    <h2>{{ $product->name }}</h2>



@empty



    <p>هیچ محصولی پیدا نشد.</p>



@endforelse

این کار باعث می‌شود نیازی به نوشتن یک شرط جداگانه برای بررسی خالی بودن لیست نداشته باشیم.

# @for در Blade

برای حلقه‌های عددی می‌توانیم از @for استفاده کنیم:


@for ($i = 1; $i <= 5; $i++)

    <p>شماره {{ $i }}</p>

@endfor

# @while در Blade

در صورت نیاز می‌توانیم از @while نیز استفاده کنیم:


@while ($count < 5)



    <p>{{ $count }}</p>



    @php

        $count++;

    @endphp



@endwhile

البته در Viewها معمولاً بهتر است منطق پیچیده را به Controller، Service یا بخش مناسب دیگری منتقل کنیم.

# متغیر $loop در Blade

یکی از قابلیت‌های بسیار کاربردی @foreach در Blade، متغیر $loop است.

مثلاً:


@foreach ($products as $product)



    <p>{{ $loop->iteration }} - {{ $product->name }}</p>



@endforeach

ویژگی‌های متداول $loop شامل مواردی مانند:


$loop->index

$loop->iteration

$loop->first

$loop->last

$loop->count

است.

مثلاً:


@foreach ($products as $product)



    @if ($loop->first)

        <strong>اولین محصول</strong>

    @endif



    <p>{{ $product->name }}</p>



@endforeach

# استفاده از Include در Blade

فرض کنید Header سایت در چند صفحه استفاده می‌شود.

به جای کپی کردن Header در تمام فایل‌ها می‌توانیم آن را جدا کنیم:


resources/views/partials/header.blade.php

سپس در View اصلی بنویسیم:


@include('partials.header')

همین روش برای Footer نیز قابل استفاده است:


@include('partials.footer')

# ارسال داده به Include

می‌توانیم هنگام Include کردن یک فایل، داده نیز ارسال کنیم:


@include('partials.product-card', [

    'product' => $product

])

در فایل:


product-card.blade.php

می‌توانیم بنویسیم:


<h2>{{ $product->name }}</h2>

این روش برای بخش‌های تکرارشونده صفحه بسیار مفید است.

# Layout در Blade چیست؟

در پروژه‌های واقعی، معمولاً صفحات زیادی داریم که ساختار مشترکی دارند.

مثلاً همه صفحات دارای:

Header
Navigation
محتوا
Footer

هستند.

اگر این ساختار را در تک‌تک صفحات تکرار کنیم، نگهداری پروژه سخت می‌شود.

Blade برای این مشکل مفهوم Layout را در اختیار ما قرار می‌دهد.

# @extends در Blade

ابتدا یک Layout اصلی ایجاد می‌کنیم:


resources/views/layouts/app.blade.php

مثلاً:


<!DOCTYPE html>

<html lang="fa">

<head>

    <meta charset="UTF-8">



    <title>@yield('title')</title>

</head>



<body>



    <header>

        <h1>CMS Nevis</h1>

    </header>



    <main>

        @yield('content')

    </main>



    <footer>

        <p>تمام حقوق محفوظ است.</p>

    </footer>



</body>

</html>

حالا یک صفحه می‌تواند از این Layout استفاده کند:


@extends('layouts.app')



@section('title', 'صفحه اصلی')



@section('content')



    <h2>به سایت خوش آمدید</h2>



@endsection

# @yield در Blade

در Layout، از @yield برای مشخص کردن محل قرارگیری محتوای صفحات استفاده می‌کنیم:


@yield('content')

یعنی صفحه فرزند می‌تواند بخشی با نام content تعریف کند:


@section('content')



    <h1>محتوای صفحه</h1>



@endsection

Laravel محتوای این بخش را در محل @yield('content') قرار می‌دهد.

# @section در Blade

برای تعریف محتوای یک Section از @section استفاده می‌کنیم:


@section('content')



    <h1>محصولات</h1>



@endsection

می‌توانیم مقدار کوتاه را نیز به صورت یک‌خطی تعریف کنیم:


@section('title', 'محصولات')

# @parent در Blade

گاهی می‌خواهیم محتوای Section مربوط به Layout اصلی را حفظ کنیم و چیزی نیز به آن اضافه کنیم.

در چنین شرایطی می‌توان از:


@parent

استفاده کرد.

مثلاً:


@section('content')



    @parent



    <p>محتوای اضافی صفحه</p>



@endsection

# تفاوت @include و @extends

این دو دستور ممکن است در ابتدا شبیه به هم به نظر برسند، اما کاربرد متفاوتی دارند.

دستور	کاربرد
`@extends`	استفاده از یک Layout اصلی
`@include`	وارد کردن یک View یا بخش کوچک‌تر
`@section`	تعریف محتوای یک بخش
`@yield`	مشخص کردن محل نمایش Section

مثلاً:


@extends('layouts.app')

یعنی صفحه از Layout اصلی استفاده می‌کند.

اما:


@include('partials.header')

یعنی یک View کوچک‌تر را در همین صفحه وارد کن.

# Blade Component چیست؟

در پروژه‌های بزرگ، @include همیشه بهترین راه برای ساخت اجزای قابل استفاده مجدد نیست.

Blade امکان استفاده از Component را نیز فراهم می‌کند.

مثلاً می‌توانیم یک Component برای دکمه ایجاد کنیم:


<x-button>

    ذخیره

</x-button>

یا یک Component برای کارت محصول داشته باشیم:


<x-product-card :product="$product" />

Componentها باعث می‌شوند اجزای رابط کاربری قابل استفاده مجدد، منظم‌تر و قابل نگهداری‌تر باشند.

# Component در Blade چه زمانی مفید است؟

فرض کنید در یک فروشگاه اینترنتی صدها بار کارت محصول داریم.

به جای تکرار HTML کارت در صفحات مختلف می‌توانیم یک Component داشته باشیم:


resources/views/components/product-card.blade.php

و در صفحات مختلف استفاده کنیم:


<x-product-card :product="$product" />

این کار از تکرار کد جلوگیری می‌کند.

# ارسال داده به Component

می‌توانیم داده را به Component ارسال کنیم:


<x-product-card :product="$product" />

در Component می‌توانیم آن داده را دریافت کرده و نمایش دهیم.

# Slot در Blade

Componentها می‌توانند محتوای داخلی نیز دریافت کنند.

مثلاً:


<x-card>

    <h2>عنوان کارت</h2>



    <p>متن کارت</p>

</x-card>

محتوای بین تگ‌های Component را می‌توان به عنوان Slot در Component دریافت و نمایش داد.

این قابلیت برای ساخت Componentهای عمومی بسیار مفید است.

# Directive در Blade چیست؟

دستورهایی که با @ در Blade نوشته می‌شوند، معمولاً با نام Blade Directive شناخته می‌شوند.

مثلاً:


@if

@foreach

@include

@extends

@section

@auth

@guest

همه نمونه‌هایی از Directiveهای Blade هستند.

Blade تعداد زیادی Directive آماده در اختیار توسعه‌دهنده قرار می‌دهد.

# نمایش فرم‌ها در Blade

Blade برای ساخت فرم‌های Laravel نیز Syntaxهای مفیدی دارد.

مثلاً برای جلوگیری از مشکلات CSRF، در فرم‌های POST معمولاً از:


<form method="POST" action="{{ route('products.store') }}">



    @csrf



    <input type="text" name="name">



    <button type="submit">

        ذخیره

    </button>



</form>

استفاده می‌کنیم.

دستور:


@csrf

توکن CSRF مورد نیاز فرم را تولید می‌کند.

# استفاده از @method در فرم

HTML به صورت مستقیم تمام متدهای HTTP مورد استفاده در Laravel مانند PUT یا DELETE را در فرم‌های معمولی پشتیبانی نمی‌کند.

Blade امکان استفاده از Method Spoofing را فراهم می‌کند.

مثلاً:


<form method="POST" action="{{ route('products.update', $product) }}">



    @csrf

    @method('PUT')



    <input type="text" name="name" value="{{ $product->name }}">



    <button type="submit">

        ویرایش

    </button>



</form>

# نمایش خطاهای Validation در Blade

پس از Validation، معمولاً لازم است خطاها را به کاربر نمایش دهیم.

Blade برای این کار Directiveهایی مانند @error دارد:


@error('name')

    <div class="error">

        {{ $message }}

    </div>

@enderror

این Syntax باعث می‌شود اگر برای فیلد name خطایی وجود داشته باشد، پیام خطا نمایش داده شود.

# استفاده از old در فرم‌ها

فرض کنید فرم ارسال شده اما Validation با خطا مواجه شده است.

برای حفظ مقدار قبلی یک فیلد می‌توان از old() استفاده کرد:


<input

    type="text"

    name="name"

    value="{{ old('name') }}"

>

در نتیجه کاربر مجبور نیست بعد از هر خطای Validation تمام اطلاعات فرم را دوباره وارد کند.

# Directiveهای مربوط به Authentication

Blade همچنین برای نمایش بخش‌هایی بر اساس وضعیت ورود کاربر Directive دارد.

مثلاً:


@auth

    <p>شما وارد حساب کاربری شده‌اید.</p>

@endauth

برای کاربران مهمان:


@guest

    <a href="{{ route('login') }}">

        ورود

    </a>

@endguest

این قابلیت برای ساخت Navigationهای مختلف بر اساس وضعیت کاربر بسیار کاربردی است.

# Authorization در Blade

در پروژه‌هایی که سیستم دسترسی دارند، می‌توان نمایش بخش‌های خاص را بر اساس Permission یا Ability کنترل کرد.

برای مثال:


@can('update', $product)



    <a href="{{ route('products.edit', $product) }}">

        ویرایش

    </a>



@endcan

البته باید توجه داشت که مخفی کردن یک دکمه در Blade به تنهایی جایگزین Authorization سمت سرور نیست.

کاربر نباید صرفاً به این دلیل که یک دکمه در View دیده نمی‌شود، از دسترسی به عملیات محافظت‌شده برخوردار باشد.

# استفاده از route در Blade

یکی از موارد بسیار رایج در Viewهای Laravel ساخت URL برای Routeها است.

مثلاً:


<a href="{{ route('products.index') }}">

    محصولات

</a>

برای Route دارای پارامتر:


<a href="{{ route('products.show', $product) }}">

    مشاهده محصول

</a>

این روش معمولاً بهتر از نوشتن URLهای ثابت در قسمت‌های مختلف پروژه است.

# استفاده از Assetها در Blade

در پروژه‌های Laravel معمولاً فایل‌های CSS و JavaScript نیز باید به View متصل شوند.

در پروژه‌هایی که از Vite استفاده می‌کنند، می‌توان از Directive مربوط به Vite استفاده کرد:


@vite(['resources/css/app.css', 'resources/js/app.js'])

این کار اتصال Assetهای پروژه به صفحه را مدیریت می‌کند.

# Stackها در Blade

گاهی Layout اصلی باید اجازه دهد صفحات فرزند فایل CSS یا JavaScript مخصوص خودشان را اضافه کنند.

برای این کار می‌توان از:


@stack('scripts')

در Layout استفاده کرد.

سپس در صفحه فرزند:


@push('scripts')



<script>

    console.log('Product page');

</script>



@endpush

محتوای Push شده در محل @stack('scripts') قرار می‌گیرد.

این روش برای Scriptهای اختصاصی صفحات بسیار کاربردی است.

# @once در Blade

گاهی می‌خواهیم بخشی از View فقط یک بار اجرا یا درج شود، حتی اگر آن بخش در چند مسیر رندر شود.

برای چنین مواردی می‌توان از:


@once



    <script>

        // code

    </script>



@endonce

استفاده کرد.

# آیا می‌توان داخل Blade کد PHP نوشت؟

Blade امکان استفاده از @php را نیز فراهم می‌کند:


@php

    $total = 100;

@endphp

اما این قابلیت به معنی آن نیست که باید منطق اصلی برنامه را داخل View قرار دهیم.

مثلاً چنین کاری مناسب نیست:


@php



    // محاسبات پیچیده

    // Query دیتابیس

    // منطق تجاری

    // پردازش سفارش



@endphp

# یک مثال واقعی؛ ساخت صفحه محصولات با Blade

فرض کنید Controller ما محصولات را به View ارسال می‌کند:


public function index()

{

    $products = Product::latest()->get();



    return view('products.index', compact('products'));

}

حالا فایل زیر را داریم:


resources/views/products/index.blade.php

می‌توانیم بنویسیم:


@extends('layouts.app')



@section('title', 'محصولات')



@section('content')



    <h1>محصولات</h1>



    @forelse ($products as $product)



        <article>



            <h2>

                {{ $product->name }}

            </h2>



            <p>

                قیمت:

                {{ $product->price }}

            </p>



            <a href="{{ route('products.show', $product) }}">

                مشاهده محصول

            </a>



        </article>



    @empty



        <p>

            هنوز محصولی ثبت نشده است.

        </p>



    @endforelse



@endsection

در این مثال چند مفهوم مهم Blade را همزمان استفاده کردیم:

@extends
@section
@forelse
@empty
{{ }}
route()

# ساختار پیشنهادی Viewها در یک پروژه واقعی

وقتی پروژه بزرگ‌تر می‌شود، بهتر است Viewها را نیز منظم کنیم.

مثلاً:


resources/views/

│

├── layouts/

│   └── app.blade.php

│

├── components/

│   ├── button.blade.php

│   └── product-card.blade.php

│

├── partials/

│   ├── header.blade.php

│   ├── footer.blade.php

│   └── navigation.blade.php

│

├── products/

│   ├── index.blade.php

│   ├── create.blade.php

│   ├── edit.blade.php

│   └── show.blade.php

│

└── users/

    ├── profile.blade.php

    └── settings.blade.php

البته ساختار دقیق پوشه‌ها به اندازه و معماری پروژه بستگی دارد.

# تفاوت View و Blade چیست؟

این دو اصطلاح را نباید کاملاً یکی بدانیم.

View به صفحه یا لایه نمایش برنامه اشاره دارد.

Blade ابزاری است که Laravel برای ساخت این Viewها در اختیار ما قرار می‌دهد.

مثلاً:


resources/views/products/index.blade.php

یک View است که با استفاده از Blade نوشته شده است.

پس می‌توان گفت:

> View مفهوم کلی لایه نمایش است و Blade یکی از ابزارهای اصلی Laravel برای ساخت آن است.

# Blade و Controller چگونه با هم کار می‌کنند؟

فرآیند ساده یک درخواست می‌تواند تقریباً به این شکل باشد:


Browser

   ↓

Route

   ↓

Controller

   ↓

Model / Service

   ↓

Data

   ↓

View

   ↓

Blade

   ↓

HTML

   ↓

Browser

مثلاً کاربر وارد این URL می‌شود:


/products

Route درخواست را به Controller می‌فرستد:


Route::get('/products', [ProductController::class, 'index']);

Controller داده را دریافت می‌کند:


public function index()

{

    $products = Product::all();



    return view('products.index', compact('products'));

}

و Blade داده را نمایش می‌دهد:


@foreach ($products as $product)



    <h2>{{ $product->name }}</h2>



@endforeach

این یکی از مهم‌ترین جریان‌هایی است که باید هنگام یادگیری Laravel درک کنید.

# بهترین روش‌های استفاده از Blade

برای اینکه Viewهای پروژه در آینده قابل نگهداری باشند، چند نکته مهم را رعایت کنید.

۱. منطق تجاری را داخل Blade قرار ندهید

Blade باید تا حد امکان روی نمایش تمرکز کند.

کدهایی مانند:


@php

    // business logic

@endphp

اگر زیاد شوند، نشانه مناسبی نیستند.

۲. Query دیتابیس را داخل View انجام ندهید

مثلاً بهتر است چنین چیزی نداشته باشیم:


@php

    $products = Product::all();

@endphp

بهتر است Controller یا Service داده مورد نیاز View را آماده کند.

۳. از Componentها برای اجزای تکراری استفاده کنید

اگر یک کارت محصول یا دکمه در قسمت‌های زیادی استفاده می‌شود، Component می‌تواند انتخاب مناسبی باشد.

۴. خروجی کاربران را به صورت پیش‌فرض Escape کنید

تا زمانی که دلیل مشخصی ندارید، ترجیحاً از:


{{ $content }}

استفاده کنید و در استفاده از:


{!! $content !!}

احتیاط کنید.

۵. Layout مشترک داشته باشید

Header، Footer و ساختار کلی سایت را در یک Layout قرار دهید تا از تکرار کد جلوگیری شود.

۶. Viewها را دسته‌بندی کنید

در پروژه‌های متوسط و بزرگ، Viewهای مربوط به بخش‌های مختلف را در پوشه‌های جدا قرار دهید.

# اشتباهات رایج هنگام کار با Blade

اشتباه اول: استفاده نادرست از @ و Syntax Blade

مثلاً:


@if ($user)

    ...

باید با:


@endif

بسته شود.

همین موضوع درباره Directiveهای دیگر نیز صدق می‌کند.

اشتباه دوم: استفاده از متغیر تعریف‌نشده

اگر Controller متغیری ارسال نکرده باشد و View مستقیماً از آن استفاده کند، ممکن است با خطا مواجه شوید.

مثلاً:


{{ $products }}

در حالی که Controller اصلاً $products را ارسال نکرده است.

اشتباه سوم: قرار دادن منطق سنگین در View

اگر یک فایل Blade صدها خط منطق PHP داشته باشد، بهتر است معماری آن بخش بررسی شود.

اشتباه چهارم: استفاده بدون احتیاط از {!! !!}

این Syntax می‌تواند HTML خام را نمایش دهد.

بنابراین برای داده‌های غیرقابل اعتماد نباید بدون بررسی استفاده شود.

اشتباه پنجم: تکرار بیش از حد HTML

# Blade برای چه پروژه‌هایی مناسب است؟

Blade برای بسیاری از پروژه‌های Laravel که رابط کاربری آن‌ها سمت سرور رندر می‌شود، انتخاب بسیار مناسبی است.

برای مثال:

وب‌سایت‌های شرکتی
فروشگاه‌های اینترنتی
CMSها
پنل‌های مدیریت
سیستم‌های مالی
سیستم‌های آموزشی
سیستم‌های تیکتینگ
داشبوردها
سیستم‌های SaaS
وب‌اپلیکیشن‌های Laravel

# آیا برای یادگیری Laravel باید Blade را یاد بگیریم؟

ترتیب مفهومی مناسبی که تا اینجا طی کرده‌ایم تقریباً چنین است:


Laravel

   ↓

Project Structure

   ↓

Route

   ↓

Controller

   ↓

View

   ↓

Blade

در ادامه نیز باید مفاهیمی مانند Middleware، Request، Validation، Session، Migration، Eloquent و سایر بخش‌های Laravel را یاد بگیریم.

# جمع‌بندی

Blade در Laravel یک Template Engine قدرتمند و خوانا برای ساخت Viewهای Laravel است.

با Blade می‌توانیم:

داده‌ها را در HTML نمایش دهیم.
شرط‌ها را مدیریت کنیم.
حلقه‌ها را اجرا کنیم.
Layoutهای مشترک بسازیم.
Viewهای مختلف را با @include ترکیب کنیم.
Componentهای قابل استفاده مجدد ایجاد کنیم.
فرم‌های Laravel را مدیریت کنیم.
خطاهای Validation را نمایش دهیم.
وضعیت Authentication و Authorization را در رابط کاربری مدیریت کنیم.
CSS و JavaScript مورد نیاز صفحات را مدیریت کنیم.

در مقاله بعدی سراغ یکی از مفاهیم بسیار مهم Laravel می‌رویم:

Middleware در Laravel

سوالات متداول Blade در Laravel

Blade چیست؟

فایل Blade چه پسوندی دارد؟

فایل‌های Blade معمولاً با پسوند زیر ساخته می‌شوند:


.blade.php

مثلاً:


home.blade.php

Blade در Laravel چیست؟

دستور @if

@if و @else

@elseif

@foreach

۱. منطق تجاری را داخل Blade قرار ندهید

۲. Query دیتابیس را داخل View انجام ندهید

۳. از Componentها برای اجزای تکراری استفاده کنید

۴. خروجی کاربران را به صورت پیش‌فرض Escape کنید

۵. Layout مشترک داشته باشید

۶. Viewها را دسته‌بندی کنید

اشتباه اول: استفاده نادرست از @ و Syntax Blade

اشتباه دوم: استفاده از متغیر تعریف‌نشده

اشتباه سوم: قرار دادن منطق سنگین در View

اشتباه چهارم: استفاده بدون احتیاط از {!! !!}

اشتباه پنجم: تکرار بیش از حد HTML

سوالات متداول Blade در Laravel

Blade چیست؟

فایل Blade چه پسوندی دارد؟

Blade با PHP چه تفاوتی دارد؟

تفاوت @extends و @include چیست؟

تفاوت {{ }} و {!! !!} چیست؟

آیا می‌توان در Blade کد PHP نوشت؟

Blade Component چیست؟

نظرات (0)

مقالات مرتبط

ساخت CMS با Laravel 12؛ آموزش ساخت سیستم مدیریت محتوا از صفر

ساخت فروشگاه اینترنتی با Laravel 12؛ آموزش پروژه‌محور از صفر تا طراحی هسته فروشگاه

ساخت Marketplace با Laravel؛ آموزش طراحی فروشگاه چندفروشندگی

مدیریت Queueهای سنگین در Laravel؛ آموزش پردازش کارهای طولانی

Blade در Laravel چیست؟

دستور @if

@if و @else

@elseif

@foreach

۱. منطق تجاری را داخل Blade قرار ندهید

۲. Query دیتابیس را داخل View انجام ندهید

۳. از Componentها برای اجزای تکراری استفاده کنید

۴. خروجی کاربران را به صورت پیش‌فرض Escape کنید

۵. Layout مشترک داشته باشید

۶. Viewها را دسته‌بندی کنید

اشتباه اول: استفاده نادرست از @ و Syntax Blade

اشتباه دوم: استفاده از متغیر تعریف‌نشده

اشتباه سوم: قرار دادن منطق سنگین در View

اشتباه چهارم: استفاده بدون احتیاط از {!! !!}

اشتباه پنجم: تکرار بیش از حد HTML

سوالات متداول Blade در Laravel

Blade چیست؟

فایل Blade چه پسوندی دارد؟

Blade با PHP چه تفاوتی دارد؟

تفاوت @extends و @include چیست؟

تفاوت {{ }} و {!! !!} چیست؟

آیا می‌توان در Blade کد PHP نوشت؟

Blade Component چیست؟

نظرات (0)

مقالات مرتبط

ساخت CMS با Laravel 12؛ آموزش ساخت سیستم مدیریت محتوا از صفر

ساخت فروشگاه اینترنتی با Laravel 12؛ آموزش پروژه‌محور از صفر تا طراحی هسته فروشگاه

ساخت Marketplace با Laravel؛ آموزش طراحی فروشگاه چندفروشندگی

مدیریت Queueهای سنگین در Laravel؛ آموزش پردازش کارهای طولانی