Codeمثال على إطار عمل Igniter MVC (نموذج عرض وحدة تحكم)

ما هو MVC؟

يرمز MVC إلى Model-View-Controller. وهو نمط معماري يقسم التطبيق إلى ثلاثة مكونات رئيسية:

1. يتناول النموذج منطق الأعمال وتفاعلات قواعد البيانات.
2. يقوم المتحكم بتنسيق الأنشطة بين النموذج والعرض.
3. يُعدّ العرض مسؤولاً عن عرض البيانات.

فيما يلي بعض مزايا نمط MVC المعماري:

• الترابط غير المحكم – المكونات موجودة وتعمل بشكل مستقل عن بعضها البعض.
• المرونة - يمكنك بسهولة إجراء تغييرات على المكونات الفردية.
• زيادة الإنتاجية - يمكن لأكثر من شخص العمل على المشروع في الوقت نفسه. يستطيع مطورو الواجهة الأمامية العمل على العرض والتقديم، بينما يركز مطورو الواجهة الخلفية على النماذج، ولأن النظام غير مترابط بشكل كبير، فإن جميع أجزائه تعمل معًا في النهاية.

الموديل

يتولى النموذج مسؤولية التفاعل مع مصادر البيانات، والتي عادةً ما تكون قاعدة بيانات، ولكن يمكن أن تكون أيضًا خدمة توفر البيانات المطلوبة. ومن الممارسات الشائعة أيضًا الاحتفاظ بمنطق الأعمال في النماذج بدلًا من وحدة التحكم، وتُعرف هذه الممارسة عادةً باسم "النموذج المتضخم، ووحدة التحكم البسيطة".

يقوم النموذج عادةً بكتابة البيانات في قاعدة البيانات، ويوفر آلية لتحريرها وتحديثها وحذفها. في تطبيقات الويب الحديثة، تستخدم النماذج أنماط تصميم الوصول إلى البيانات، مثل Active Record، لتسهيل التفاعل مع قاعدة البيانات.

على سبيل المثال، Codeيستخدم Igniter مكتبة Active Record مدمجة لمساعدة النماذج، بينما تستخدم أطر العمل الأخرى مثل Laravel أداة Eloquent Object Relational Mapper (ORM) للوصول إلى البيانات.

مراقب

يستمع المتحكم إلى طلبات الموارد الواردة من المستخدمين. ويعمل كوسيط بين النموذج والعرض، وينفذ أحيانًا بعض قواعد العمل أيضًا. لنفترض أن المتحكم تلقى طلبًا لتسجيل مستخدم في قاعدة البيانات.

قد يقوم المتحكم بالتحقق من صحة البيانات المُرسلة للتأكد من وجود جميع المعايير المطلوبة. في حال وجود نقص، يُعاد توجيه المستخدم إلى صفحة التسجيل مع رسالة الخطأ المناسبة. كما قد يطلب المتحكم من النموذج إجراء المزيد من عمليات التحقق، مثل التحقق من وجود عنوان البريد الإلكتروني المُرسل مسبقًا. إذا اجتازت جميع قواعد التحقق بنجاح، يُرسل المتحكم البيانات إلى النموذج للمعالجة وينتظر الرد.

بمجرد أن يقوم النموذج بمعالجة المعلومات وإرجاع استجابة إيجابية، تقوم وحدة التحكم بتحميل العرض المناسب وتمرير البيانات التي تم إرجاعها من النموذج كمعلمة.

عرض الطلب

يتعامل العرض مع البيانات المقدمة للمستخدم النهائي. في تطبيقات الويب، غالبًا ما تحتوي طرق العرض على HTML وCSS واختياريًا Javaسيناريوتحتوي طرق العرض على الحد الأدنى من التعليمات البرمجية، وعادةً ما تكفي فقط للتكرار عبر مجموعات البيانات الواردة من النموذج، أو دالة مساعدة لتنظيف البيانات أو إنشاء روابط التحرير. تستخدم معظم تطبيقات الويب الحديثة محركات القوالب ذات بنية شبه برمجية خاصة بها يمكن للمصممين فهمها. عند العمل مع Codeفي Igniter، من الممارسات الشائعة استخدام وسوم PHP قصيرة وهياكل تحكم. لعرض شيء ما في Codeباستخدام Igniter، يمكنك استخدام الكود التالي:

<?=$title?>

على عكس:

<?php
echo $title;
?>

عادةً ما تُكتب هياكل التحكم على النحو التالي:

<?php foreach ($customers as $customer): ?>
<li>
<p><?=$customer->first_name?></p>
</li>
<?php endforeach; ?>

كما ترون في المثال أعلاه، يستخدم العرض مزيجًا من PHP وHTML بدلاً من تضمين كل شيء في كود PHP خالص.

كيف تعمل أطر عمل MVC

توضح الصورة التالية كيفية عمل إطار عمل MVC.

يستقبل المتحكم الطلب من المستخدم، ويتفاعل مع نموذج قاعدة البيانات إذا لزم الأمر، ثم يعيد النتيجة إلى المتصفح في شكل كود HTML، والذي يفسره المتصفح إلى تنسيق قابل للقراءة البشرية ويعرضه للمستخدم.

Codeوحدة تحكم الإشعال

دعونا الآن نحلل ما حدث عندما قمنا بتحميل URL افتح متصفح الويب. افتح ملف وحدة التحكم Welcome.php الموجود في مجلد application/controllers. يجب أن ترى الكود التالي:

<?php
defined('BASEPATH') OR exit('No direct script access allowed');
class Welcome extends CI_Controller {
public function index()
{
$this->load->view('welcome_message');
}
}

هنا:

• يمنع تعريف ('BASEPATH') أو الخروج ('لا يُسمح بالوصول المباشر إلى البرنامج النصي')؛ الوصول المباشر إلى وحدة التحكم إذا لم يأتِ الطلب عبر index.php. هذا لأغراض أمنية.
• class Welcome extends CI_Controller {…} يحدد فئة وحدة التحكم Welcome ويمتد من الفئة الأصلية CI_Controller.
• الدالة العامة index(){…} تُعرّف طريقة الفهرسة التي تستجيب لـ URL http://localhost:3000.
• $this->load->view('welcome_message'); يقوم بتحميل العرض welcome_message الموجود في دليل application/views.

سنقوم الآن بتحديث طريقة الفهرسة على النحو التالي:

public function index()
{
$this->load->model('customers_model');
$data['customer'] = $this->customers_model->get_customer(3);
$this->load->view('welcome_message',$data);
}

هنا:

• $this->load->model('customers_model'); تحميل نموذج العملاء.
• $data['customer'] = $this->customers_model->get_customer(3); يستدعي هذا الأمر دالة get_customer الخاصة بـ customers_model ويمرر إليها المعامل 3. ​​في هذا المثال، قمنا بتضمين القيمة بشكل ثابت، ولكن في التطبيقات الحقيقية، سيكون هذا المعامل من عنوان URI.
• يقوم $this->load->view('welcome_message',$data); بتحميل عرض welcome_message وتمرير متغير $data.

Codeنموذج الإشعال

لنقم الآن بإنشاء النموذج المشار إليه في الكود أعلاه. ولتبسيط الأمر، لن يتفاعل نموذجنا مع قاعدة بيانات لكنها ستُعيد سجل عميل ثابت. سنتناول قواعد البيانات في الدروس القادمة. أنشئ ملفًا باسم Customers_model.php في مجلد application/models وأضف الكود التالي:

<?php
class Customers_model extends CI_Model {
public function get_customer($id) {
$data['id'] = 3;
$data['first_name'] = 'John';
$data['last_name'] = 'Doe';
$data['address'] = 'Kingstone';
return $data;
}
}

هنا:

• فئة Customers_model يمتد CI_Model {...} يحدد النموذج Customers_model الذي يمتد CI_Model.
• الدالة العامة get_customer($id) {…} تحدد طريقة get_customer بناءً على معرف العميل.
• يُعرّف المتغير $data[…] القيم الثابتة لعميلنا الوهمي. يجب أن يكون هذا صفًا مُسترجعًا من قاعدة البيانات.
• إرجاع بيانات $؛ إرجاع بيانات العميل.

هذا كل ما يتعلق بنموذجنا. لنقم الآن بتعديل عرض رسالة الترحيب. افتح ملف welcome_message.php الموجود في:

application/views/welcome_message.php

استبدل الكود بما يلي:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>CodeIgniter MVC Basics</title>
</head>
<body>
<h1>Customer Details Card</h1>
<p>Customer ID : <strong><?=$customer['id']?></strong></p>
<p>First Name : <strong><?=$customer['first_name']?></strong></p>
<p>Last Name : <strong><?=$customer['last_name']?></strong></p>
<p>Address : <strong><?=$customer['address']?></strong></p>
</body>
</html>

احفظ التغييرات وقم بتحميل ما يلي URL في متصفح الويب: http://localhost:3000/يجب أن ترى بطاقة العميل كما هو موضح في الصورة أدناه.

الأسئلة الشائعة