العمل مع Templates Blade في Laravel
المقدمة
Blade هو محرك قوالب مدمج في Laravel يُستخدم لتصميم واجهات مستخدم للتطبيقات. يوفر Blade طريقة سهلة ومبسطة لدمج كود PHP مع HTML لإنشاء قوالب ديناميكية وقابلة للتخصيص. في هذا الدليل، سنغطي كيفية العمل مع قوالب Blade، بدءًا من إنشاء قوالب جديدة إلى استخدام التوجيه والشروط والحلقات داخل القوالب.
ما هو Blade في Laravel؟
Blade هو محرك قوالب بسيط لكنه قوي يُمكّنك من استخدام كود PHP داخل ملفات القوالب بسهولة. يتم حفظ قوالب Blade بامتداد .blade.php
في مجلد resources/views
. باستخدام Blade، يمكنك إنشاء قوالب مكررة وقابلة لإعادة الاستخدام لتطوير واجهات مستخدم جذابة وديناميكية.
الخطوة 1: إنشاء قالب Blade جديد
لإنشاء قالب Blade جديد، افتح مجلد resources/views
في مشروع Laravel الخاص بك، وأنشئ ملفًا جديدًا باسم welcome.blade.php
. يمكنك البدء بإضافة HTML أساسي إلى هذا الملف:
<!DOCTYPE html>
<html lang="ar">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>مرحباً بك في Laravel</title>
</head>
<body>
<h1>مرحباً بك في Laravel!</h1>
</body>
</html>
هذا هو أبسط شكل من قوالب Blade، وهو يظهر كيف يمكنك استخدام HTML داخل قالب Blade.
الخطوة 2: عرض قالب Blade
لعرض قالب Blade في متصفحك، تحتاج إلى ربطه بمسار في ملف routes/web.php
:
Route::get('/welcome', function () {
return view('welcome');
});
سيعرض هذا المسار القالب welcome.blade.php
عند زيارة http://your-app-url/welcome
في المتصفح.
الخطوة 3: استخدام توجيهات Blade
Blade يوفر العديد من التوجيهات (Directives) المفيدة، مثل @if
، @foreach
، و@include
لتنفيذ العمليات الشرطية والحلقات وإدراج القوالب الفرعية. لنقم بإضافة بعض التوجيهات إلى قالب Blade:
<body>
<h1>مرحباً بك في Laravel!</h1>
@if ($user)
<p>مرحباً، {{ $user }}!</p>
@else
<p>مرحباً، ضيف!</p>
@endif
<ul>
@foreach ($items as $item)
<li>{{ $item }}</li>
@endforeach
</ul>
</body>
في هذا المثال، نحن نستخدم التوجيه @if
للتحقق من وجود متغير $user
، ونستخدم التوجيه @foreach
للتكرار عبر العناصر وعرضها في قائمة.
الخطوة 4: تضمين القوالب باستخدام @include
يمكنك تضمين قوالب فرعية داخل قوالب Blade باستخدام التوجيه @include
. لنفترض أنك تريد تضمين تذييل (Footer) في قالبك:
<body>
<h1>مرحباً بك في Laravel!</h1>
<!-- محتوى الصفحة -->
@include('footer')
</body>
سيقوم هذا بتضمين محتوى الملف footer.blade.php
الموجود في مجلد resources/views
.
الخطوة 5: استخدام تخطيطات Blade (Blade Layouts)
تخطيطات Blade تُستخدم لتحديد تصميم الصفحة الرئيسي وإعادة استخدامه عبر صفحات متعددة. لنقم بإنشاء تخطيط رئيسي في ملف resources/views/layouts/app.blade.php
:
<!DOCTYPE html>
<html lang="ar">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>@yield('title')</title>
</head>
<body>
<header>
<h1>Laravel Application</h1>
</header>
<div class="content">
@yield('content')
</div>
<footer>
<p>© 2024 Laravel Application</p>
</footer>
</body>
</html>
ثم يمكنك استخدام هذا التخطيط في صفحات أخرى عن طريق توسيعه باستخدام @extends
وتحديد الأقسام باستخدام @section
:
<!-- resources/views/welcome.blade.php -->
@extends('layouts.app')
@section('title', 'مرحباً بك')
@section('content')
<p>مرحباً بك في صفحة Laravel الرئيسية!</p>
@endsection
الخاتمة
يوفر Blade في Laravel طريقة قوية ومرنة لإنشاء قوالب ديناميكية لتطبيقات الويب. من خلال التعرف على أساسيات Blade واستخدام التوجيهات المتقدمة، يمكنك بناء واجهات مستخدم قابلة للتخصيص وإعادة الاستخدام بسهولة. استمر في استكشاف المزيد من ميزات Blade لتحسين تجربة تطوير تطبيقاتك.
لمزيد من المعلومات، يمكنك زيارة المستندات الرسمية للارافيل.
اترك تعليقاً