محمد أبو عواد

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

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

سبب المشكلة انك تحاول استخدام الدالة diffForHumans على نوع بيانات نص وليس على من نوع carbon, سوف نقوم بتغيير نوع البيانات الى carbon من خلال استخدام الدالة parse كالتالي
Carbon::parse($item->duration)->diffForHumans() أو يمكنك تغيير نوع الحقل ليكون من نوع timestamps وليس time كالتالي
$table->timestamps('duration')

يمكنك اعطاء العنصر header في الصفحة الرئيسية خاصية id وتحديد قيمة لها, على سبيل المثال 
<div id="main-header"> وفي ملف css يمكنك اعطاء التنسيقات من خلال تحديد العنصر باستخدام ال id كالتالي
#main-header{ border-bottom: 1px solid red; } القوة التحديدية لل id اقوى من الصنف او class وبالتالي لن تواجه مشكلة في تضارب التنسيقات

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

في الحقيقة العنصر الثاني لا يختفي ولكن يرتفع للأعلى ويصبح أسفل العنصر الأول تماما بحيث لا يظهر وللتاكد من هذا الامر يمكنك اعطاء العنصر الاول الخاصية display وقيمتها none وسوف يظهر العنصر الثاني , عند استخدام القيمة fixed نحتاج الى ضبط تموضع العنصر من خلال الخاصيات top , right , left , bottom كالتالي
.div1{ background-color: #ff0; position: fixed; top: 0; left: 0; } يمكنك التحكم في القيم فبدلا من 0 يمكنك وضع أي رقم , وهذا الرقم يدل على بعد العنصر عن الشاشة من الاتجاه المحدد , فمثلا لو وضعت قيمة top ب 0 فذلك يعني ان العنصر سوف يبتعد عن اعلى الشاشة بمقدار 0 وهذا يعني أنه سوف يلتصق بأعلى الشاشة , ثم يمكننا اعطاء العنصر الثاني خاصية margin كالتالي
.div2{ margin-top: 100px; } وبهذا سو يظهر العنصر الثاني أسفل العنصر الاول 
يمكنك التحكم في المسافات والقيم حسب التصميم الخاص بك

يمكنك ذلك من خلال استخدام التابع Object.getOwnPropertyNames ثم نستطيع عمل ترشيح أو فلتر للناتج من خلال استخدام التابع filter لفلترة الدالة البانية الكونستركتر كالتالي
const instances = Object.getOwnPropertyNames(Foo.prototype) .filter(prop => prop != "constructor"); console.log(instanceOnly);  

من المفترض أن المنصة توفر جزء له علاقة بالمطورين وهو الجزء المتعلق بال Api الخاص بالمنصة والذي يمكننا من خلاله ربط تطبيقنا بالمنصة ,وأيضا توفير شرح مفصل عنه لكيفية استخدامه وأنواع الاستجابات التي يقوم بها الخادم , اذا لم توفر المنصة هذا الامر فيمكنك التواصل معهم والاستفسار منهم هل يوفرون Api لذلك واذا كانوا يوفرون عليك الاستفسار عن ال api وطريقة التعامل معها

المشكلة لديك أنك لا تحدد العنصر بشكل مباشر بل تكتفي بتحديد الكلاس active , وبالتالي سوف يتم تجاهل التنسيقات الخاصة بالكلاس active , الحل أن نستخدم الخاصية !important كالتالي
.active{ transform: scaleY(1) !important; ^^^^^^^^^^ transform-origin: bottom; } في هذه الحالة سوف يتم تجاهل جميع التنسيقات الاخرى لنفس العنصر ويتم تطبيق الخاصية التي لديها important , 
الحل الآخر يمكنك من خلال تحديد العنصر بشكل مباشر وصحيح كالتالي
.form-section form.active{ ^^^^^^^^^^^^^^^^^^^^^^^ transform: scaleY(1); transform-origin: bottom; }  

المشكلة ليست في العنصر footer بل المشكلة في العصنر الذي لديه الصنف about-us-section , العنصر footer من المفترض أن يعرض بشكل طبيعي ولكن ما يؤثر عليه بهذا الشكل هو القسم about-us-section , بداية ليس من الجيد دائما استخدام الخاصية position لضبط تموضع العناصر فذلك يصعب الأمور في مختلف الشاشات , اذن لا داعي لهذا الكود الخاص بالعنصر footer في الشاشات التي عرضها 500 بكسل أو اقل
footer { position: absolute; bottom: 0; top: 540vh; background-color: #1a222a; color: white; text-align: center; display: block; } يمكنك ازالته , أما مسبب المشكلة الاساسي هو أنك تحدد طول العنصر about-us-section بشكل محدد وباستخدام اداة القياس vh في مختلف الشاشات, لاحظ
.about-us-section { height: 120vh; } .about-us-section { height: 150vh; } أرجو منك استخدام الطول الطول الطبيعي للقسم على أن تكون الخاصية height قيمتها auto كالتالي
hight:auto اذا اردت مزيدا من الارتفاع يمكنك استخدام الحواشي الداخلية والهوامش الخارجية باستخدام padding او margin 
 

اذا كانت مهارتك جيدة في لارافيل وواجهتك مشكلة في فهم احد المواضيع فيمكنك الرجوع الى الموضوع من توثيق لارافيل الرسمي , اما اذا كنت مبتدئ ولغتك الاجليزية جيدة فيمكنك اللجوء الى التوثيق وقراءته من البداية والبدء بشكل تدريجي مع المواضيع لكي تفهم كيف يتم العمل به وتستسطيع استخدامه , بشكل عام حتى لو قرأته كاملا فسوف تحتاج الى الرجوع اليه دائما ومراجعة الملعلومات منه , بالنسبة لقواعد البيانات يجب أن تكون لديك معرفة جيدة بقواعد البيانات بشكل منفصل عن لارافيل , فيجب أن تكون مهاراتك في استخدام mysql جيدة جدا لأنه في بعض الأحيان نحتاج أن نكتب اكواد mysql للاستعلام عن البيانات لذلك نعم عليك دراستها بشكل منفصل

يمكنك استخدام التابع except لتحديد الدالة التي تقوم بعرض الزوار , على فرض ان اسم الدالة هو index فيكون شكل الكود كالتالي
$this->middleware('auth')->except('index'); سوف يتم تطبيق الميديل وير auth على جميع دوال المتحكم ما عدا الدالة index

السبب أنك تقارن العنصر price ولا تقارن قيمته, لاحظ
if(price != ""){ ^^^^^ price تعبر عن العنصر الذي لديه المعرف price, لاحظ
let price = document.getElementById("price"); ولكن نحن نريد أن نقارن قيمة الحقل ويمكننا الحصول عليها من خلال التابع value كالتالي
if(price.value != ""){ ^^^^^^^  

لا يوجد طريقة لإخفاء الاكواد ولكن يمكنك القيام بإعادة ضبط حجم الواجهة كالتالي

يمكنك تصغير الواجهة من الخط الفاصل بين واجهة أكواد html وواجهة أكواد css , بعد التصغير يصبح الشكل كالتالي

أو يمكنك عرض الواجهة بشكل طولي وتقوم بإعادة ضبط حجم الواجهات بنفس الطريقة

لو لاحظت الواجهة الرئيسية لموقع بوتستراب الاصدار الخامس سوف تجد في الجزء الأيسر من الموقع قائمة, لاحظ

هذه القائمة تحتوي على جميع المواضيع , كل موضوع يتم شرح وتوضيح جميع الكلاسات الخاصة به , يتم تقسيم المواضيع الى عدة مجموعات , فهناك مجموعة المكونات أو components , سوف تجد فيها عناصر جاهزة مثل السلايدر والموديل والكارد وغيرها , تقوم بنسخ الكود جاهز ولصقه في المشروع , هناك مجموعة layout التي تقوم بشرح جميع مواضيع المتلعقة بتقسيم العناصر والاصناف التي تبدأ ب col , مجموعة utilities التي تحتوي على مواضيع مثل المسافات والحواشي والهوامش , سوف تجد بداخل مجموعة utilities موضوع اسمه spacing الذي يشرح جميع كلاسات الهوامش الخارجية والحواشي الداخلية , بشكل عام , كل موضوع يقوم بشرح الكلاسات الخاصة به , اذا فهمت فكرة التقسيمة يمكنك التعامل مع الموقع بسهولة , يمكنك الاستفادة من حقل البحث الموجود في الموقع للبحث عن أي خاصية او أي صنف تحتاجه

الصحيح والضروري هو أن تكون لديك خلفية جيدة عن أساسيات Html و css والقليل من جافاسكربت ,ليس مطلوب منك أنك تكون محترف في هذه التقنيات فليس من ضمن عملك أن تقوم بكتابة أكواد html و css بشكل كبير , ولكن أحيانا تحتاج الى استخدام بعض العناصر مثل ما حدث معك عند حاجتك لاستخدام الجدول,فلو لم يكن لديك أي معرفة ب Html فلن تعرف بوجود عنصر table ,لذلك يمكنك فقط خلال ساعات قليلة جدا مراجعة عناصر html واساسيات css ومن ثم الرجوع الى Flask, ولكن اذا أردت استخدام Flask لبناء API فلست بحاجة أن يكون لديك خلفية عن التقنيات Html و css

لاحظ انك تحدد العنصر بطريقة خاطئة , لاحظ
data-bs-target="mainmenu"> ^^^^^^^^ أرجو منك وضع اشارة # قبل معرف العنصر كالتالي
data-bs-target="#mainmenu"> ثم أخبرنا بالنتيجة

عند تحديد الحقل سوف يتم ارسال قيمة الحقل الى الخادم وبالتالي يمكننا فحص اذا كانت قيمة الحقل موجودة أم لا كالتالي
if (isset($_POST['agree_mail'])) { // Checkbox is selected } else { // Checkbox is not selected } اذا كان الحقل محدد فإن الشرط سوف يتحقق, أما اذا كان غير محدد فلن يتحقق الشرط

نعم يمكنك ذلك باستخدام الدالة microtime , على فرض أننا سوف نقوم بعمل حلقة تكرار تتكون من 100 حلقة كالتالي
$val=1; for($i = 0; $i <=100; $i++) { $val++; } ونحتاج أن نقوم بحساب الوقت المستغرق في اتمام عمل الحلقة , نقوم باستخدام الدالة microtime قبل بدء تنفيذ الحلقة للحصول على وقت الساعة كالتالي
$start_time = microtime(true); $val=1; for($i = 0; $i <=100; $i++) { $val++; } ثم نقوم بالحصول على وقت الساعة بعد تنفيذ الحلقة كالتالي
$start_time = microtime(true); $val=1; for($i = 0; $i <=100; $i++) { $val++; } $end_time = microtime(true); ثم نقوم بطرح وقت البداية من وقت النهاية كالتالي
$execution_time = ($end_time - $start_time); هكذا نحصل على الوقت المستغرق بدقة

بعد تحديد طريقة Basic Download سوف تجد زر اسمه download كما هو موضح في الصورة التالية

أرجو منك الضغط عليه ثم تقوم بتحميل الصورة بصيعة svg او png 

لاحظ الخطأ يخبرك أنه لا يستطيع معالجة الملف bootstrap/ , وهذا هو الخطأ بالتحديد
ERROR in ./resources/js/app.js Module not found: Error: Can't resolve './bootstrap/' in 'C:\laragon\www\bookstore\resources\js' @ ./resources/js/app.js 1:0-23 الخطا كما هو ظاهر في اول سطر من ملف app.js الموجود في المسار التالي
resources\js\app.js أرجو منك التأكد من كتابة اسم الملف bootstrap.js كالتالي
require('./bootstrap'); ثم قم بتنفيذ الأمر npm run watch

يمكنك استخدام base64_encode كالتالي
$image = file_get_contents("path/to/my/image.png"); $data = base64_encode($image); echo $data;  

يعتمد ذلك على الكود الذي كتبته , وعلى شكل ترتيبك لعناصر html ولكن بشكل عام كلما قل عدد الأسطر المكتوبة كان أفضل , ومن الواضح أن عدد الأسطر في الطريقة الاولى أقل, وطالما أنه يعمل بشكل جيد فيمكنك الاستمرار عليها 

كلاهما خاصيتان خاصتان بالصندوق المرن او ما يعرف ب flex box , اي لا يتم تطبيقهما الا اذا كانت الحاوية لديها الخاصية display:flex , أما بالنسبة للخاصية justify-content فهي تحدد كيفية توزيع المساحة بين عناصر الحاوية وحولها بشكل أفقي ,تأخذ العديد من القيم مثل start و center و end وغيرها,مثلا لو كان لدينا الكود التالي
<div id="main"> <div style="background-color:green;">1</div> <div style="background-color:red;">2</div> <div style="background-color:blue;">3</div> </div> css #main { width: 400px; height: 100px; border: 1px solid #c3c3c3; display: flex; justify-content: start; } #main div { width: 50px; height: 50px; } سوف تكون النتيجة كالتالي

نلاحظ أن العناصر عرضت في بداية الحاوية , ماذا لو قمنا بتغيير القيمة الى center كالتالي
justify-content: center; سوف تكون النتيجة كالتالي

نلاحظ أن العناصر جاءت في منتصف الحاوية , ربما قد فهمت ما وظيفة الخاصية , وبالفعل لو كانت القيمة end فسوف تعرض في نهاية الحاوية كالتالي

لاحظ يتغير موضع العناصر بشكل أفقي , ولكن ماذا اذا أردنا تغييره بشكل عمودي؟ نستخدم الخاصية الأخرى وهي align-content فهي تحدد طريقة عرض العناصر بشكل عمودي , ولكن يجب أن نستخدم خاصية flex-wrap: wrap; معها للسماح للعناصر بالالتفاف والنزول الى اسفل , لها نفس القيم أيضا فمثلا لو كانت center 

يمكنك تجربة الأمر مع القيم الأخرى
شكرا لك

ما يتم طباعته هي عناصر المصفوفة المسترجعة من الدالة s , اذا بالفعل لدينا مصفوفة , ولكن لا يمكن طباعة المصفوفة الا بالمرور على جميع عناصرها باستخدام حلقات التكرار , استخدمنا حلقة التكرار foreach وقمنا بطباعة عناصر المصفوفة , اذا كنتي تريدين أن يكون الناتج يأخذ شكل المصفوفة فيمكنك فعل ذلك كالتالي
<?php function s(...$numbers) { foreach ($numbers as $n) { $m[] = $n**2; } return $m; } $result='[';// قمنا بإنشاء متغير واسندنا اليه قيمة نصية قيمتها فقط القوس الواضح أمامك foreach(s(3, 5) as $square) { $result.= $square . ','; // نقوم بإلحاق قيمة العناصر بالمتغير الذي انشأناه } $result.=']';// بعد انتهاء حلقة التكرار نقوم بإغلاق القوس echo $result;// نقوم بطباعة قيمة المتغير الذي أنشأناه ?>