لوحة المتصدرين

احاول عمل انميشن بحيث انه عند النقر على الرابط ينتقل السكرول للديف المحدد ويقوم بعمل انميشن لهذا الديف، لا اعلم كيف استخدم الرابط لعمل انميشن على الديف؟ ، لدي معرفة بعمل هذا الشيء مع اكشن hover لنفس الديف لكني لا اريده بهذه الطريقة اريد ان انقر على رابط ، كيف نقوم بعمل ذلك؟

مارأيكم أي درس أو مثال أراه في دروس الأكاديمية بخصوص لارافال ارجع ادرسها بالتفصيل في التوثيق فرصة لقرائة التوثيق (جزء -جزء) وترسيخ المعلومة لانه عندك مثال حي للتطبيق على ما تقرأ وممكن تضيف عليه و ...

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

مثلا عوض أن أطبق حرفيا مع المدرب في هذه النقطة $table->foreign('category_id') ->references('id') ->on('categories') ->onDelete('set null'); تصفحت التوثيق وقرأت عن ربط المفتاح الأجنبي وجمعت معلومات لابأس بها وعدت للتطبيق وبشكل آخر : $table->foreignId('category_id') ->constrained() ->nullOnDelete();

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

لدي عنصر div وله كلاس main <div class="main"> </div> <div class="col"> <ul class="lis"> <li data-color="red" id="red" class="active"></li> <li data-color="blue" id="blue"></li> <li data-color="green" id="green"></li> <li data-color="black" id="black"></li> </ul> </div> <script src="BOM.js"></script> <script src="min.js"></script> </body> عندما أجلبه في ملف javaScript بالطريقة التالية وأطبعه يظهر لي العنصر لكن لا أستطيع أن أطبق عليه اي عملية مثل التنسيقات let mai =document.querySelector(".main"); console.log(mai); //mai.style. ثانيا عندما أجلبه عبر getElementByclassName وأطبعه في الكونسول يظهر لي بأنه HtmlConnectin ما الفرق بين getElementByclassName و querySelector

بعد جلب أي عنصر من الصفحة باستخدام querySelector مثلًا، يمكن التعديل على خصائص الكائن style له وسيتم تعديل التنسيقات بكل تأكيد، قد يكون الخطأ لديك في الخاصية التي تحاول تغييرها أن يكون اسمها خاطئ مثلًا

تأكد من عدم وجود عنصر آخر يحمل الصنف main، في هذه الحالات يفضل استخدام معرف id بدلًا من صنف class، وذلك لأن المقصود هو وجود عنصر واحد من هذا النوع ضمن الصفحة، والأفضل أيضًا استخدام العنصر <main> مباشرةً، يمكنك التأكد من عدم وجود عناصر مشابهة عبر عرض طول مصفوفة التي تطابق الاستعلام التالي، ويجب أن يكون طولها واحد، نفذ الأمر التالي ضمن console بعد تحميل الصفحة وذلك للتأكد أيضًا من عدم وجود شيفرات جافاسكريبت تعدل على شجرة DOM وتؤثر على ذلك : console.log(document.querySelectorAll(".main").length) بعد التأكد من ذلك يمكنك جلب العنصر والتعديل عليه كالتالي: const main =document.querySelector(".main"); main.style.color = ...; أو إضافة وإزالة أصناف على العنصر كالتالي: main.classList.add('...') // أو main.classList.remove('...') يمكنك الاستفادة من قراءة المقال التالي:

أريد برمجة موقع يخص خدمات شحن رصيد الهاتف (فليكسي كما نسميها نحن في الجزائر) وأيضا بيع بطاقات التعبئة وغيرها من خدمات التعبئة ، أكيد يحوي واجهة مسؤول وواجهة تاجر أو عميل بحيث يمكن العميل أو التاجر من شراء الرصيد من الموقع عن طريق عدة طرق مثل: حساب بريدي ccp، البطاقة الذهبية، حساب بنكي، ماستر أو فيزا كارد وغيرها من الطرق المحلية والدولية، وبيعه أيضا لعملائه بنفس الطرق عن طريق حسابه في الموقع مع إمكانية زيادة هامش الربح الذي يريده، لكن ليست لدي أي فكرة على الطرق المستعملة في هذا المجال انا مبرمج php لكن لم يسبق لي العمل على مثل هذه الأفكار ، لو تكرمتم ووضحتم لنا بعض الأمور في هذا الأمور مشكورين مأجورين .

في الجزائر، نفتقر الى واجهة تطبيقات برمجية لتوفير مثل هاته التعاملات بالشكل المألوف، عن طريق cURL مثلا. ولذلك نلجئ الى الكثير من الطرق الأخرى التي يستعملها الموقع الذي ارفقته مثلا. فكفكرة مثلا: يمكنك بيع أكواد بطاقات التعبئة بدل بيع الرصيد نفسه. أو القيام بالتحويلات يدويا من واجهة المشرف بعد تسجيل تفاصيل هاته الطلبيات في قواعد البيانات. وبدل ان يكون الموقع آداة للقيام بالشحن والتعبئة يكون وسيطا فقط في عملية شراء الرصيد والدفع. يمكنك مثلا عرض واجهة استخدام يمكن من على المستخدم اختيار بطاقة التعبئة الموافقة ثم ملئ بياناته الخاصة. بجانب انه يطلب منه ارفاق تفاصيل عملية التحويل (المبلغ الذي يشتري به) كملف مرفق (وثيقة PDF عن تحويل عن طريق بريدي موب مثلا أو صورة عن وصل دفع عن طريق الحساب البريدي الجاري CCP). وبالطبع يكون هذا بعد تزويد المستخدم ببيانات حسابكم في بريدي موب او حساب البريد الجاري بكم. الآن بعد ان يقوم المستخدم بالتحويل وتقديم طلب الشراء، سيتلقى المشرف هذا الطلب من على لوحة التحكم. سيمكن له فحص مصداقية التحويل والقيام بشحن الرصيد يدويا بالطريقة المألوفة. ان كنت تبحث عن طريق لجعل الموقع يقوم بما ستحتاج عمله يدويا، فلا أظن انه سيمكنك ايجاده بالشكل البسيط. كخدمة مدفوعة توجد مجموعة الحزم باسم Chargily التي توفر مثل هاته الخدمات الكترونيا (مثل تقديم مفتاح API للتعاملات عبر البطاقة الذهبية وبريدي موب).

يمكن عمل التحريك الذي تطلبينه باستخدام js، وذلك بإضافة class خاص بالتحريك لل div عند النقر على الرابط : <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <!-- لاحظي كيف اضفنا الوظيفة الخاصة بإضافة الكلاس للرابط --> <a href="#mySection" onclick="doTheAnimation()">إضغط هنا للإنتقال إلى قسم الخدمات </a> <!-- اهم شئ هنا هو إضافة الايدي --> <div id="mySection" style="height: 400px; margin-top:800px ;background-color: red;"> <h2 style="font-size: xxx-large; padding:20px ;">قسم الخدمات</h2> </div> <!-- يمكنك إضافة الجافاسكربت لصفحة مستقلة أو وضعها هنا كما فعلت أنا --> <script> // الوظيفة الخاصة بإضافة الكلاس const doTheAnimation = () => { // هنا نقوم بإمساك الديف الخاص بنا const mySection = document.getElementById("mySection"); // وهنا نقوم بإضافةا لكلاس الخاص بالتحريك mySection.classList.add("animationClass"); } </script> <!-- يفضل إضافة الستايل لملف سي اس اس منفصل --> <style> /* انشاء التحريك الذي نريده */ /* هنا قمت بإنشاء تحريك للون كمثال فقط */ @keyframes example { from { background-color: red; } to { background-color: yellow; } } /* نضيف التحريك للكلاس الذي عرفناه باستخدام الجافاسكريبت */ .animationClass { animation-name: example; animation-duration: 4s; } </style> </body> </html> حيث نقوم بتنفيذ الوظيفة doTheAnimation عند النقر على الرابط والتي تقوم بإضافة الـ class المسمى animationClass للdiv خاصتنا، وفي النهاية قمنا بإضافة animation لهذا الـ class باستخدام css.

يمكنك التحقق من ما ان كان العنوان المدخل رابطا نسبيا يحوي داخله أحد النطاقات المقبولة، بهاته الطريقة سيمكنك قبول الروابط المتفرعة عن هذا الاصل: <?php /** * التحقق من ما ان كان رابط ما * نطاقا فرعيا عن احد النطاقات * المقبولة * @param string $target_url * @return boolean */ function is_valid_url($target_url) { $White_List = array("https://drive.google.com/", "https://1drv.ms/"); //Add Allowed Website list Here foreach($White_List as $url) { if(str_contains($target_url ,$url)) { return true; } } return false; } $user_url = "https://drive.google.com/path/to/target/drive"; echo is_valid_url($user_url); لاحظ ان الوظيفة str_contains موجودة فقط في PHP8، ان كنت تستخدم نسخا دون هاته النسخة. يمكنك عمل ذات الفكرة عن طريق strpos مثلا: if(strpos($target_url ,$url) !== false) { return true; } أو stripos ايضا: if(stripos($target_url ,$url) !== false) { return true; } الدالة strpos()‎ في PHP الدالة stripos()‎ في PHP

ماهي العلاقات مُتعددة الأشكال ( Polymorphic Relationships) في لارافيل و كيف يمكن الإستفادة منها.

إن العلاقات متعددة الأشكال هي أن يكون لديك نماذج يمكن أن تنتمي إلى أكثر من كيان واحد. يحتفظ هذا النوع من النماذج بالبنية نفسها التي لا تتغير بغض النظر عن النموذج الآخر المرتبط به. من الأمثلة الشائعة على هذا النوع من السيناريوهات هي (التعليقات). في مدونة على سبيل المثال ، يمكن أن توضع التعليقات على منشور محدد أو على صفحة مستقلة مع الحفاظ على الهيكل نفسه بغض النظر عما إذا كان منشور أو صفحة. أي بمعنى آخر ستبقى جميع الخصائص للتعليق ثابتة مثل (الاسم، تاريخ التعليق، محتوى التعليق،...). مع أخذ المثال المذكور أعلاه في الاعتبار ، لدينا كيانان: Post و Page. للحصول على تعليقات على كل منها ، يمكننا أن نقرر إنشاء قاعدة بياناتنا على النحو التالي: posts: id الرقم المعرف للمقال title عنوان المقال content محتوى المقال posts_comments: id رقم معرف فريد post_id الرقم المعرف للمقال comment التعليق date تاريخ التعليق pages: id الرقم المعرف للصفحة body محتوى الصفحة pages_comments: id رقم معرف فريد page_id الرقم المعرف للصفحة comment التعليق date تاريخ التعليق ولكن نلاحظ أنه باعتماد النهج السابق، وجب علينا إنشاء جدولين للتعليقات، جدول للتعليقات الخاص بالصفحة، وجدول آخر للتعليقات الخاصة بالمنشور أو المقال. وكليهما يقومان بنفس الدور تماماً ويحتويان نفص الخصائص، إنما الاختلاف الوحيد هو بالمكان الذي يتواجدان فيه (مرة بالمنشور ومرة أخرى بالصفحة). مع استخدام العلاقات المتعددة، يمكننا تبسيط البينة السابقة ومنع التكرار الذي حصل، فتصبح لدينا بنية الجداول كالتالي: posts: id الرقم المعرف للمنشور title عنوان المنشور content محتوى المنشور pages: id الرقم المعرف للصفحة body محتوى الصفحة comments: id الرقم المعرف للتعليق commentable_id الرقم المعرف للمكان الذي يوجد فيه التعليق (أي رقم معرف للصفحة أو رقم معرف للمنشور) commentable_type نوع المكان الهدف (صفحة أو منشور) date تاريخ التعليق body محتوى التعليق وبذلك نلاحظ لدينا عمودين جديدين مهمين يجب الانتباه إليهما: commentable_id و commentable_type. وبدورهما قاما باختصار تكرار جدول التعليق مرتين وتكرار البيانات. وهذا ببساطة هو مفهوم العلاقات المتعددة الأشكال. الآن لنأخذ المثال السابق ونقوم بتضمينه ضمن لارافيل: عند إنشاء الجداول للتهجير نقوم بالتالي: Schema::create('posts', function (Blueprint $table) { $table->increments('id'); $table->string('title'); $table->text('content'); }); Schema::create('pages', function (Blueprint $table) { $table->increments('id'); $table->text('body'); }); Schema::create('comments', function (Blueprint $table) { $table->increments('id'); $table->morphs(‘comment’); //-> ستنشئ تلقائيًا عمودين باستخدام النص الذي تم تمريره إليه $table->text('body'); $table->date('date'); }); بوضع morphs سيقوم تلقائياً بإنشاء العمودين commentable_id و commentable_type. ثم عند إنشاء جدول التعليقات يمكننا تعريف دالة تساعدنا بالحصول على أي مودل آخر يملك تعليق (أي يمكننا مباشرة الحصول على تعليقات المنشور و تعليقات الصفحة) بدالة واحدة بدلاً من اللجوء لآليات أخرى أكثر تعقيداً، كالتالي: <?php namespace App; use Illuminate\Database\Eloquent\Model; class Comment extends Model { //باستخدام هذا التابع نستطيع الآن أن نحصل على أي مودل يملك تعليق أي مودل الصفحة ومودل المنشور public function commentable() { return $this->morphTo(); } } وعند إنشاء الجدول الهدف (الكيان الذي سيحوي التعليقات) على سبيل المثال جدول المنشور: namespace App; use Illuminate\Database\Eloquent\Model; class Post extends Model { //هذه الدالة ستقوم باستعادة جميع التعليقات الموجودة على منشور محدد public function comments() { return $this->morphMany('App\Comment', 'commentable'); } } نلاحظ قمنا باستخدام morphMany للدلالة بأن المنشور قد يحوي عدة تعليقات، وبذلك نستطيع الحصول على كافة التعليقات الموجودة على هذا المنشور. وكذلك الأمر طبعاً بالنسبة (للصفحة) نكرر الخطوة السابقة morphMany. يمكنك أيضاً الاطلاع على باقي أشكال العلاقات وأنواع العلاقات متعددة الأشكال الأخرى من التوثيق الرسمي في لارافيل.