أول صفحة PHP
من التثبيت إلى أول صفحة يبنيها الخادم. ⏱ نحو 30 دقيقة.
- تجهّز
XAMPPوتشغّل ملفPHPعبرhttp://localhost. - تكتب كود
PHPبين وسميه وتطبع بـecho. - تعرّف المتغيرات وتميّز أنواعها الأساسية، وتدمج النصوص بالنقطة.
- تدمج
PHPمعHTMLوتقرأ رسائل الأخطاء.
١جهّز بيئة العمل: XAMPP
لتشغيل PHP على جهازك تحتاج ثلاثة أشياء: خادم ويب يستقبل الطلبات، ومفسّر PHP يشغّل الكود، وقاعدة بيانات. حزمة XAMPP المجانية تجمعها كلها: Apache و PHP و MySQL (اسمها الحديث MariaDB).
- نزّل XAMPP من موقعه الرسمي
apachefriends.orgوثبّته في المسار المقترحC:\xampp. - افتح XAMPP Control Panel واضغط Start بجانب Apache. حين يصير لونه أخضر فالخادم يعمل.
- افتح المجلد
C:\xampp\htdocs: هذا جذر موقعك. أنشئ فيه مجلدًا باسم132. - أنشئ في VS Code ملفًا باسم
hello.phpداخل المجلد132. - افتح المتصفح على
http://localhost/132/hello.php.
| تفتح الملف… | ماذا يحدث؟ |
|---|---|
بالنقر المزدوج: file:///C:/xampp/htdocs/132/hello.php | ✗ يعرض المتصفح الكود نفسه أو ينزّله؛ لأنه لم يمر على الخادم. |
عبر الخادم: http://localhost/132/hello.php | ✓ يستقبل Apache الطلب، ويشغّل PHP، ويرسل الناتج. |
localhost اسم يعني «هذا الجهاز نفسه». فجهازك يلعب الدورين: المتصفح عميل، و XAMPP خادم. وفي هذا المقرر تستطيع أيضًا التجربة مباشرة في مختبر الخادم داخل الصفحة.
٢وسم PHP و echo
كود PHP يُكتب بين الوسمين <?php و ?>. والأمر echo يطبع نصًّا في الاستجابة، أي يضيفه إلى الصفحة التي ستصل للمتصفح:
<?phpecho "<h1>مرحبًا بك في مقرر الواجهات الخلفية</h1>";echo "<p>هذه أول صفحة يبنيها الخادم.</p>";// هذا تعليق لا يُرسل للمتصفح# وهذا تعليق أيضًا
- كل أمر ينتهي بفاصلة منقوطة
;. نسيانها أشهر خطأ عند المبتدئين. - التعليق:
//أو#لسطر واحد، و/* … */لعدة أسطر. - إن كان الملف كله
PHPفلا تكتب?>في آخره؛ هذا أسلم ويمنع إرسال مسافات زائدة بالخطأ.
لاحظ في الناتج أعلاه: 🖥 الصفحة هي ما يعرضه المتصفح، و📄 المصدر هو النص الذي أرسله الخادم فعلًا. كل echo أضاف قطعة إلى المصدر.
٣المتغيرات
المتغير في PHP يبدأ دائمًا بعلامة الدولار $، ولا تحتاج إعلان نوعه؛ يُحدَّد من القيمة:
<?php$name = "سعود"; // نص string$age = 20; // عدد صحيح int$gpa = 4.75; // عدد عشري float$active = true; // منطقي bool var_dump($name, $age, $gpa, $active);
الدالة var_dump تطبع نوع القيمة وقيمتها، وهي أداة ممتازة لاكتشاف الأخطاء. لاحظ أن string(8) تعني 8 بايتات، لأن الحرف العربي يأخذ بايتين.
بايثون (111) | PHP | |
|---|---|---|
| تعريف متغير | name = "سعود" | $name = "سعود"; |
| نهاية السطر | سطر جديد | فاصلة منقوطة ; |
| الطباعة | print(name) | echo $name; |
| القيم المنطقية | True / False | true / false |
| اللاشيء | None | null |
٤دمج النصوص: النقطة لا علامة الجمع
في JavaScript وبايثون تدمج النصوص بعلامة +. أما في PHP فالدمج بـالنقطة . ، وعلامة + للأعداد فقط:
<?php$n = 5;echo "عدد الطلبات: " + $n;
<?php$n = 5;echo "عدد الطلبات: " . $n;
الخطأ قاتل Fatal error: توقف البرنامج ورد الخادم بالرمز 500. لاحظ أن المختبر يشرح لك الخطأ بالعربية تحت الاستجابة.
وللإضافة إلى نص موجود استخدم .= ، وهي مفيدة لبناء صفحة على مراحل:
<?php$html = "<ul>";$html .= "<li>قهوة</li>";$html .= "<li>شاي</li>";$html .= "</ul>";echo $html;
٥علامة التنصيص المزدوجة والمفردة
داخل علامتي التنصيص المزدوجتين "…" يستبدل PHP المتغيرات بقيمها. أما المفردتان '…' فتطبعان النص حرفيًّا:
<?php$city = "المدينة المنورة";echo "أسكن في $city\n";echo 'أسكن في $city\n';echo "\n";echo "حيّاكم يا أهل {$city}، مرحبًا بكم\n";
- في المفردتين لا تُستبدل المتغيرات، ولا يعمل
\n(سطر جديد). - إن جاء بعد المتغير مباشرة حرف عربي أو فاصلة عربية «،» فسيظنّه
PHPجزءًا من اسم المتغير! ضع المتغير بين قوسين معقوفين:"{{$city}}،". - السطر الجديد
\nيظهر في المصدر فقط. المتصفح يتجاهله فيHTML، فاستخدم<br>أو<p>لتنزل سطرًا في الصفحة.
<?php$city = "جدة";echo "حيّاكم يا أهل $city، مرحبًا";
<?php$city = "جدة";echo "حيّاكم يا أهل {$city}، مرحبًا";
في الخطأ ظن PHP أن اسم المتغير $city، (مع الفاصلة العربية)، فلم يجده. هذا فخ خاص بمن يكتب بالعربية!
٦PHP داخل صفحة HTML
قوة PHP أنه يندمج مع HTML: تكتب الصفحة كعادتك، وتفتح وسم PHP فقط حيث تريد قيمة متغيرة. والاختصار <?= $x ?> يعني <?php echo $x; ?>:
<?php$title = "دورة تطوير الويب";$trainer = "م. سعود الحربي";$seats = 12;?><!DOCTYPE html><html lang="ar" dir="rtl"><head><meta charset="UTF-8"><title><?= $title ?></title></head><body style="font-family:Tahoma"> <h1><?= $title ?></h1> <p>المدرّب: <b><?= $trainer ?></b></p> <p>المقاعد المتبقية: <?= $seats ?></p></body></html>
الجزء الأول يجهّز البيانات، والجزء الثاني قالب HTML يعرضها. هذا الفصل بين «البيانات» و«العرض» عادة ممتازة؛ ولاحقًا ستأتي البيانات من قاعدة البيانات بدل أن نكتبها بأيدينا.
٧حين يخطئ الكود
في بيئة التطوير نجعل PHP يعرض أخطاءه في الصفحة نفسها (الإعداد display_errors)، فتعرف السطر ونوع الخطأ. جرّب هذا الكود الذي نسي فاصلة منقوطة:
<?php$name = "نورة"echo "مرحبًا يا $name";
رسالة PHP تقول إن الخطأ في السطر 3، بينما الفاصلة الناقصة في نهاية السطر 2. هذا طبيعي: PHP لا يكتشف النقص إلا حين يصل إلى ما بعده. فإن ظهر لك خطأ صياغة، راجع السطر المذكور والسطر الذي قبله.
| النوع | هل يتوقف البرنامج؟ | مثال |
|---|---|---|
| Parse error خطأ صياغة | لا يعمل أصلًا | فاصلة منقوطة أو قوس ناقص |
| Fatal error خطأ قاتل | يتوقف عند السطر | دالة غير موجودة، أو دمج نص بـ + |
| Warning تحذير | يكمل، لكن النتيجة غالبًا خاطئة | متغير غير معرَّف، أو حقل لم يُرسل |
توقّع وتحقّق
أي سطر يطبع قيمة المتغير name؟
عامل دمج النصوص في PHP:
"أ" . "ب"ماذا يعني <?= $x ?> ؟
php echo $x; ?>Parse error في السطر 5 يعني غالبًا أن الخطأ في:
PHP يكتشف النقص عند ما بعده.الخلاصة
XAMPP = Apache + PHP + MySQL. ملفاتك فيhtdocs، وتفتحها عبرhttp://localhost/…- الكود بين <?
phpو ?> ، وكل أمر ينتهي بـ ; وechoتطبع في الاستجابة. - المتغير يبدأ بـ $ ، ونوعه من قيمته:
stringوintوfloatوbool. - الدمج بالنقطة . ، والمزدوجتان تستبدلان المتغيرات والمفردتان لا.
- <?= $
x?> تطبع قيمة داخلHTML. وأخطاء الصياغة: راجع السطر المذكور والذي قبله.
تحدٍّ برمجي: بطاقة متدرب
سهلاصنع صفحة تعرض بطاقة متدرب. البيانات تُحفظ في متغيرات أعلى الملف، ثم يعرضها قالب HTML بالأسفل.
- عرّف أربعة متغيرات:
$nameبالقيمة «ريم الشهري»، و$majorبالقيمة «تقنية البرمجة وتطوير الويب»، و$hoursبالعدد 15، و$gpaبالعدد 4.6 - اعرض الاسم في
<h1>، ثم ثلاث فقرات بالشكل: «التخصص: …» و«الساعات المسجلة: 15 ساعة» و«المعدل: 4.6 من 5». - اطبع القيم من المتغيرات بـ
<?= ?>أو echo، ولا تكتبها مباشرة في HTML.
👀 اعرض الاستجابة المطلوبة
GET /card.php
- الكود يعمل بلا أخطاء أو تحذيرات
- العنوان: <h1>ريم الشهري</h1>
- فيها: التخصص: تقنية البرمجة وتطوير الويب
- فيها: الساعات المسجلة: 15 ساعة · المعدل: 4.6 من 5
- الأعداد محفوظة أعدادًا (بلا علامات تنصيص): $
hours = 15و $gpa = 4.6 - الاسم يُطبع من المتغير $name داخل h1
💡 تلميح 1
💡 تلميح 2
<h1><?= $title ?></h1>حاول بنفسك أولًا؛ للمسألة أكثر من حلّ صحيح.
<?php$name = "ريم الشهري";$major = "تقنية البرمجة وتطوير الويب";$hours = 15;$gpa = 4.6;?><h1><?= $name ?></h1><p>التخصص: <?= $major ?></p><p>الساعات المسجلة: <?= $hours ?> ساعة</p><p>المعدل: <?= $gpa ?> من 5</p>