تصميم موقع الويب الخاص بك مع PHP و MySQL


الدرس: اكتب السيناريو الأول


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

علامات PHP


حتى تعرف أن الكود المصدري لصفحة HTML يتكون من العلامات  . على سبيل المثال ، <ul>هي علامة.
يتم إدراج رمز PHP في منتصف كود HTML . سنضع تدريجياً في صفحات الويب الخاصة بنا أجزاء من كود PHP داخل HTML . ستكون أجزاء الكود PHP هذه هي الأجزاء الديناميكية للصفحة ، أي الأجزاء التي يمكن أن تتغير من تلقاء نفسها (لهذا السبب يقال إنها ديناميكية ) .
يوضح الشكل التالي هذا.
web dynamique php
إدراج كود PHP
كما ترى ، نجد كود HTML الذي نعرفه جيدًا ... ونقوم بإدخال المزيد من البيانات الديناميكية في المنتصف. هنا ، على سبيل المثال ، هو الاسم المستعار: يتغير وفقًا للزائر. وبالتالي يمكن تغيير الجزء المميز وفقًا للزائرين.
ArabClassroom يفعل نفس الشيء للأعضاء المسجلين. يتم عرض اسم الشهرة الخاص بك في الجزء العلوي من الصفحات عند تسجيل الدخول.
شكل علامة PHP
إذا قلت لك عن ذلك ، فهذا ليس بالمصادفة. لاستخدام PHP ، سيتعين علينا تقديم علامة جديدة ... وهذه العلامة مميزة قليلاً. يبدأ بـ <?php وينتهي  ?>؛ من الداخل سنضع كود PHP ، الذي سوف أعلمك اياه خلال هذه الدورة.
هنا علامة PHP فارغة:

<?php
   
?>
في الداخل ، سنكتب كود مصدر PHP :

<?php
/*  PHP code */ 
?>
يمكننا بسهولة كتابة علامة PHP على عدة أسطر. في الواقع ، إنه ضروري حتى لأن كود PHP في معظم الأوقات سوف يصنع عدة أسطر. هذا سيعطي شيئًا مثل:

<?php
/* الكود PHP يُكتب هنا 
و هنا
و هنا ايضا */
?>
وهناك علامات أخرى لاستخدام PHP، على سبيل المثال &lt;? ?&gt;، <% %>الخ لذلك لا تتفاجأ إذا رأيت بعضها. ومع ذلك ، <?php   ?>هو النموذج الأكثر صحة ، لذلك سوف تتعلم استخدام هذه العلامة وليس غيرها.
أدخل علامة PHP في منتصف كود HTML
يتم إدراج علامة PHP التي اكتشفناها للتو في منتصف كود HTML كما قلت لك سابقًا. لاستخدام المثال الذي رأيناه في الفصل السابق:

<!DOCTYPE html>
<html>
    <head>
        <title> هذه صفحة اختبار بها علامات PHP </title>
        <meta charset="utf-8" />
    </head>
    <body dir="rtl">
        <h2> صفحة الاختبار </h2>
        
        <p>
            تحتوي هذه الصفحة على كود HTML مع علامات PHP.<br />
            <?php /* هنا كود PHP  */ ?>
            فيما يلي بعض الاختبارات الصغيرة:        </p>
        
        <ul>
        <li style="color: blue;"> النص باللون الأزرق </li>
        <li style="color: red;"> النص باللون الاحمر </li>
        <li style="color: green;"> النص باللون الاخضر </li>
        </ul>
        
        <?php
        /* لا يزال PHP
        دائما PHP */
        ?>
		
    </body>
</html>
هل يمكننا وضع علامة PHP في أي مكان في الكود؟
نعم! حقا في أي مكان. ليس فقط في نص الصفحة: يمكنك وضع علامة PHP في رأس الصفحة (انظر السطر 4 من المثال أدناه).

<!DOCTYPE html>
<html>
    <head>
        <title> هذه صفحة اختبار <?php /* PHP Code */ ?></title>
        <meta charset="utf-8" />
    </head>
الأهم من ذلك ، يمكنك حتى إدراج علامة PHP في منتصف علامة HTML ، كما هو موضح في السطر 5 من المثال أدناه (حسنًا ، ليست جميلة جدًا ):

<!DOCTYPE html>
<html>
    <head>
        <title> هذه صفحة اختبار </title>
        <meta  <?php  /* Code PHP */  ?> charset="utf-8" />
    </head>
كيف يعمل؟ ماذا يمكن أن تفعل يُقدّم لي؟
يجب أن نتذكر أن PHP يولد كود HTML . سوف نفهم كيف يعمل بشكل أفضل من خلال تعلم عرض النص في PHP .
عرض النص
حسنًا ، كل شيء جيد وجيد ، ولكن حان الوقت لبدء كتابة كود PHP ، أليس كذلك؟ نبأ عظيم: الآن سوف تتعلم التعليمات الأولى في PHP .
لا تتوقع أي شيء غير عادي ، فلن يبدأ جهاز الكمبيوتر الخاص بك في الرقص على سامبا بمفرده. ؛-)
ومع ذلك ، ستفهم كيفية عمل PHP ، أي كيفية إنشاء كود HTML . من الضروري أن نفهم هذا جيدًا ، لذا كن منتبهاً!
التعليمات ECHO
PHP هي لغة برمجة ، وهي ليست الحالة بالنسبة إلى HTML (نتحدث بدلاً من لغة الوصف لأنها تتيح وصف صفحة ويب). إذا كنت قد قمت بالفعل ببرمجة لغات أخرى مثل C أو Java ، فلن يفاجئك ذلك. ومع ذلك ، في هذه الدورة ، نبدأ من نقطة الصفر لذلك سأفترض أنك لم تقم بأي برمجة من قبل.
أي لغة برمجة تحتوي على تعليمات ما يسمى . واحد مكتوب سطرا بشكل عام ، وجميعهم ينتهي بفاصلة منقوطة. يرشد الإرشاد الكمبيوتر إلى تنفيذ إجراء محدد.
هنا ، التعليمة الأولى التي سنكتشفها تسمح بإدخال نص في صفحة الويب. هذا هو التعليم echo الأساسي والأساسي لجميع التعليمات التي تحتاج إلى معرفتها.
فيما يلي مثال لاستخدام هذا البيان:

<?php
    echo " أنت الزائر رقم :" . $nbre_visitors;
?>
كما ترون ، داخل علامة PHP نكتب التعليمات echo التي يتبعها النص ليتم عرضها في علامات اقتباس. تُستخدم علامات الاقتباس لتحديد بداية ونهاية النص ، مما يساعد الكمبيوتر على إيجاد طريقه. أخيرًا ، ينتهي البيان بفاصلة منقوطة كما قلت لك ، وهذا يعني نهاية البيان .
لاحظ أن هناك عبارة متطابقة echo تسمى print، والتي تفعل الشيء نفسه. ومع ذلك ، echo هي أكثر شيوعا.
يجب أن تعلم أن لديك أيضًا الحق في طلب عرض العلامات. على سبيل المثال ، تعمل التعليمة البرمجية التالية:

<?php
echo " هذا هو <strong> النص </strong>";
?>
سيتم عرض كلمة "النص" بخط غامق بفضل وجود العلامات <strong>و </strong> .
كيفية عرض علامة اقتباس؟
سؤال جيد. إذا وضعت علامة اقتباس ، فهذا يعني أن الكمبيوتر الذي سيتم عرض النص يتوقف عنده. أنت تخاطر في أفضل الأحوال بتحطيم كودك الجميل ولديك "خطأ تحليل" رهيب.
الحل يسبق علامة اقتباس بخط مائل عكسي \:

<?php echo "Cette ligne a été écrite \"uniquement\" en PHP."; ?>
أنت تعلم أن كود PHP مدرج في منتصف كود HTML . لذلك دعونا نأخذ صفحة HTML عادية ونضع فيها كود PHP (السطر 12 ) :

<!DOCTYPE html>
<html>
    <head>
        <title> تعليماتنا الأولى: echo</title>
        <meta charset="utf-8" />
    </head>
    <body dir="rtl">
        <h2> عرض النص مع PHP </h2>
        
        <p>
            كُتب هذا السطر بالكامل بلغة HTML.br />
            <?php echo " وقد كتب هذا تماما في PHP."; ?>
        </p>
    </body>
</html>
أقترح عليك نسخ كود المصدر هذا ولصقه في محرر النصوص وحفظ الصفحة. سنحاول ذلك ونرى ما ينتج عن ذلك.
لكن بالمناسبة ، هل تتذكر كيف يجب عليك حفظ صفحة PHP الخاصة بك؟
احفظ صفحة PHP
شرحت لك كيف تفعل في الفصل السابق ولكن القليل من التذكير لا يمكن أن يضر.
احفظ الصفحة بالملحق .php، على سبيل المثال  affichertexte.php ، في المجلد testsالذي قمت بإنشائه. يجب أن يكون في  C:\wamp\www\tests ويندوز.
خلاصة القول ، بغض النظر عن نظام التشغيل الخاص بك ، هو أن الملف يتم حفظه في المجلد www (أو أحد مجلداته الفرعية) وإلا لن يتم تشغيل ملف PHP !
إذا كنت تستخدم Notepad ++ ، فحدد  PHP Hypertext Preprocessor file (*.php) في النافذة للحفظ ، كما هو موضح في الشكل التالي.
web dynamique php
النسخ الاحتياطي صفحة PHP
بمجرد حفظ الصفحة ، يجب عليك الآن اختبارها.
اختبر صفحة PHP
لاختبار صفحة PHP الخاصة بك ، يعتمد ذلك على نظام التشغيل الخاص بك ولكن المناورة هي نفسها بشكل أساسي.
على Windows ، ابدأ تشغيل WAMP إذا لم تكن قد قمت بذلك بالفعل. انتقل إلى القائمة Localhost، يتم فتح الصفحة الرئيسية. هناك ، إذا قمت بإنشاء المجلد tests في الدليل www كما هو موضح في الفصل السابق ، سترى رابطًا للمجلد tests . انقر عليها (لقد قمنا بهذا بالفعل في الفصل السابق).
يتم فتح صفحة ويب تعرض جميع الملفات الموجودة في المجلد tests . يجب أن يكون لديك الملف affichertexte.php . انقر عليها: جهاز الكمبيوتر الخاص بك يولد كود PHP ويفتح الصفحة. لديك النتيجة أمام عينيك.
يمكن الحصول على نفس النتيجة في متصفحك بالانتقال مباشرة إلى العنوان http://localhost/tests/affichertexte.php . يجب أن تكون الطريقة هي نفسها تقريبًا سواء كنت تعمل على نظام Windows أو Mac OS X أو Linux .
اذا ماذا ترى؟
أعتقد أنك فوجئت وتفاجأت بما فعلته بك: يبدو أنه لا فائدة منه ، وهذا ليس خطأً تمامًا.  كود PHP يحتوي على "خط" مكتوب على الشاشة ، بكل بساطة.
لكن ، أه ، أليس من الأسهل كتابته بتنسيق HTML؟
إذا!
لكنك سترى قريبا فائدة هذه الوظيفة. في الوقت الحالي ، نلاحظ فقط أنه يكتب النص.
في غضون ذلك ، للحصول على المتعة وفهم قوة PHP ، ما عليك سوى تجربة الكود التالي (الذي سيتم شرحه لاحقًا في الدورة):

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title>صفحة الويب الخاصة بي</title>
    </head>
    <body dir="rtl">
        <h1>صفحة الويب الخاصة بي</h1>
        <p>اليوم نحن <?php echo date('d/m/Y h:i:s'); ?>.</p>
    </body>
</html>
اختبار هذا الكود والاعجاب
web dynamique php
عرض ديناميكي للتاريخ والوقت في PHP
يتم عرض التاريخ والوقت تلقائيا على الصفحة!
الآن تحديث الصفحة: تم تحديث الوقت في حد ذاته!
انظر إلى الكود المصدري للصفحة التي تم إنشاؤها في المتصفح: سترى أنه لا يوجد كود PHP . تم إرسال الوقت مباشرة إلى كود HTML . لماذا؟ 
كيف يولد PHP كود HTML
يطلب PHP التعليمات  Echo لإدراج النص الذي نطلبه هنا. إذا قمنا بترجمة التعليمات التي قدمتها إليك مسبقًا باللغة العربية ، فستعطى: أدخل النص: "هذا النص مكتوب بالكامل بلغة PHP . ".
لا تنسى أبدا فاصلة منقوطة في نهاية التعليمات. إذا حدث ذلك ، فستتلقى رسالة الخطأ: "خطأ في التحليل".
لاحظ أنه يتعطل فقط إذا كان كود PHP الخاص بك أكثر من سطر واحد (سيكون ذلك طوال الوقت). حتى تأخذ عادة وضع دائما " ;" في نهاية التعليمات.
شرحت لك في الفصل الأول أن PHP يولد كود HTML ويعود للزائر كود HTML فقط (ربما مصحوبًا بورقة أنماط CSS الخاصة به ) ، كما هو موضح في الشكل التالي.
web dynamique php
إنشاء HTML بواسطة PHP
في الشكل التالي ، يمكنك معرفة ما يحدث مع الكود المصدري لدينا بشكل ملموس.
يتم تنفيذ كود PHP أولاً والكمبيوتر يقوم بما هو مطلوب منه. قيل له هنا: "أظهر هذا النص هنا".
بمجرد تنفيذ جميع تعليمات PHP (هنا كانت بسيطة ، كانت هناك واحدة فقط!) ، الصفحة التي خرجت هي صفحة تحتوي على HTML فقط! يتم إرسال صفحة "النتيجة" هذه إلى الزائر لأنه لا يمكنه قراءة HTML .
web dynamique php
انتاج HTML مع echo
تذكر أن الخادم وحده الذي يمكنه تشغيل PHP . لا يتم  إرسال PHP  إلى الزائر. لكي نتمكن من تشغيل PHP على جهاز الكمبيوتر الخاص بنا (من أجل إجراء اختباراتنا) ، كان علينا تحويله إلى خادم صغير عن طريق تثبيت برنامج مثل WAMP .

التعليقات


حسنًا ، لقد علمت للتو الكثير من الأشياء في وقت واحد ، يجب أن تكون صدمة لك. حسنًا ، لم يكن ذلك رائعًا ، ولكنك ستفهم قريبًا دقة الأشياء.
قبل الانتهاء من هذا الفصل ، أريد أن أتحدث إليكم حول شيء أعتقد أنه مهم للغاية في PHP ، كما هو الحال في أي لغة برمجة: التعليقات.
التعليق هو النص الذي تضعه لنفسك في كود PHP . يتم تجاهل هذا النص ، أي أنه يختفي تمامًا عند إنشاء الصفحة. فقط أنت ترى هذا النص.
ولكن بعد ذلك ، ما الهدف من التعليق؟
إنه لك أنت  .يتيح لك هذا العثور عليه في كود PHP الخاص بك ، لأنه إذا لم تلمس الكود لأسابيع وعدت ، فقد تضيع قليلاً.
يمكنك كتابة أي شيء وكل شيء ، كل شيء هو استخدامه بحكمة.
هناك نوعان من التعليقات:
  • التعليقات أحادية الاسطر ؛
  • تعليقات متعددة الأسطر.
كل هذا يتوقف على طول تعليقك. سوف أقدم لكما كلاهما.
تعليقات سطر واحد
للإشارة إلى أنك تكتب تعليقًا على سطر واحد ، يجب عليك كتابة خطين مائلين: " //". ثم اكتب تعليقك.
مثال ؟

<?php
echo " أنا أعيش في الصين."; // يشير هذا السطر إلى المكان الذي أعيش فيه

// السطر التالي يشير إلى عمري
echo " 92 سنة.";
?>
أضع تعليقين في أماكن مختلفة:
  • الأول في نهاية السطر ؛
  • والثاني على خط كامل.
الأمر متروك لك لمعرفة المكان الذي تضع فيه تعليقاتك: إذا كنت تعلق على سطر معين ، فمن الأفضل وضع التعليق في نهاية هذا السطر.
تعليقات متعددة الخطوط
هذه هي الأكثر عملية إذا كنت تخطط لكتابة تعليق على عدة أسطر ، ولكن يمكننا أيضًا استخدامه لكتابة تعليقات سطر واحد. يجب أن نبدأ بالكتابة /*ثم نغلق بـ */:

<?php
/* السطر التالي يشير إلى عمري
إذا كنت لا تصدقني ...
... أنت على حق); */
echo " 92 سنة.";
?>
التعليقات هنا ليست مفيدة للغاية ، لكنك سترى كيف يمكنني استخدامها في الفصول التالية لوصف كود PHP .

في الخلاصة


  • صفحات الويب التي تحتوي على PHP لها الامتداد .php .
  • صفحة PHP هي في الواقع صفحة HTML بسيطة تحتوي على إرشادات في PHP .
  • توضع تعليمات PHP في علامة افتتاح واختتام:   .
  • لعرض النص في PHP ، نستخدم التعليمات echo .