صدور معاينة مطور Fusion: اكتب PHP داخل مكونات Vue و React الخاصة بك

Fusion هي أبسط طريقة لدمج واجهة المستخدم الأمامية (Front end) الحديثة الخاصة بك بلغة JavaScript مع الواجهة الخلفية (back end) الخاصة بك بلغة لارافل

أرسل الحالة من الخلفية إلى الواجهة الأمامية (front end ) ، وحدد الطرق في الواجهة الخلفية (backend) التي يمكن استدعاؤها بدون نقاط نهاية API من الواجهة الأمامية.

يبسط Fusion عملية العمل مع JavaScript في Laravel، مع تزويدك بالتحكم الكامل وقوة الـ backend كاملة الميزات.

إليك مقدمة إلى Fusion:

مقدمة إلى Fusion

يقدم آرون أيضًا فيديوًا يغطي أساسيات Fusion وبعض الميزات: تشمل النقاط البارزة: * اكتب PHP و JavaScript في الملف نفسه. * استدعاء وظائف الخلفية مباشرةً من الواجهة الأمامية. * مزامنة الحالة تلقائيًا بين الخلفية والواجهة الأمامية. **ملاحظة:** Fusion في مرحلة معاينة تطوير مبكرة جدًا. من فضلك لا تستخدمها في الإنتاج حتى الآن! لا تزال هناك الكثير من الأخطاء (ربما).

مفاهيم Fusion

بقراءة ملف readme أنه من المهم ملاحظة ما لا يفعله Fusion مسبقًا:

* Fusion لا يقوم بتحويل PHP إلى WASM.

* Fusion لا يحول JavaScript إلى PHP/Blade.

* Fusion لا يستخدم "PHP للنماذج" (PHP for templating).

* Fusion لا يقوم بمزامنة الحالة الأمامية/الخلفية *تلقائيًا*.

أما ما يفعله Fusion:

* يستخدم Fusion Vite لاستخراج كتل PHP من ملفات JavaScript الخاصة بك وكتابة PHP على القرص.

* يستخدم Fusion Vite لحقن بعض المعلومات في ملف JavaScript أثناء تحويله.

* يقوم Fusion بتشغيل PHP الخاص بك في الخلفية و JavaScript الخاص بك في الواجهة الأمامية.

* يحول Fusion كتلة PHP الخاصة بك إلى نوع من وحدات التحكم.

* يستخدم Fusion دورة حياة الطلب/الاستجابة القياسية لـ Laravel ، router, auth, middleware، وما إلى ذلك.

* يسمح Fusion لك بمزامنة حالة الواجهة الأمامية/الخلفية. يمكنك التفكير في كتلة `<php>` في ملفك ك وحدة تحكم، مع تطبيق القليل من الربط التلقائي لحقن الحالة واستدعاء الطرق.

مثال Fusion أساسي

<php>
// Define a prop in PHP
$name = prop(Auth::user()->name);
</php>
 
<template>
<!-- Use it in Vue! -->
Hello {{ name }}!
</template>
هذا يعرض متغير `$name` إلى نموذج Vue باسم `name`. سيتم تمريره إلى الواجهة الأمامية عند التحميل الأول. لست بحاجة إلى تعريف أي خصائص على جانب Vue، فنحن نهتم بذلك نيابةً عنك. يمكنك أيضًا استخدام النمط القائم على الفئات:
<php>
new class {
public string $name;
 
public function mount()
{
$this->name = Auth::user()->name;
}
}
</php>
 
<template>
Hello {{ name }}!
</template>
للحصول على تفاصيل كاملة، راجع المشروع على Github.

جميع الحقوق محفوظة © 2025 Laravel | عربي