Adnane Kadri

يستعمل البعض مكتبة simple_html_dom لتجريف صفحات الويب وتحليل بياناتها. في ما يلي مثال عملي عن الاستعمال: $html = file_get_html('https://www.some_website.com/'); $imgs = $html->find('img'); $hrefs = $html->find('a'); توفر هاته المكتبة الوظيفة file_get_html. التي يمكن عن طريقها استعمال محددات الـ css العادية لجلب أي عنصر أو مجموعة عناصر ضمن الصفحة. يرجى الاشارة ايضا الى ان هاته المكتبة قد لا تعمل بشكل صحيح ان كان المحتوى يتم عرضه بعد تحميل موارد الصفحة بما في ذلك ملفات جافاسكربت (مثل حالات تطبيقات الصفحة الواحدة SPA أو أي تطبيق يتم تصيير الصفحة فيه على مستوى العميل client side rendering). لا أظن أن هنالك برمجية مبنية على الـ PHP تخدم هذا الاحتمال -على أن مثل هاته التطبيقات قليلة مقارنة بالعادية- ، على عكس مكتبات من مثل scrapy أو selenium موجودة في بايثون. أظن أن بايثون أفضل في هذا الجانب. (يرجى الانتباه جيدا الى الجانب القانوني في الموضوع، قد يؤدي استعمالها الى حظرك من بعض المواقع أو حتى الى اجراءات أخرى في بعض الاحيان). فيما يلي توثيق المكتبة المشار اليها simplehtmldom.

يمكنك أيضا توظيف الحدثين onmouseover و onmouseout لخدمة نفس الغرض: <h1 onmouseover="document.body.style.backgroundColor = 'red';" onmouseout="document.body.style.backgroundColor = '';">اضغط</h1> مثال تجريبي. يمكنك الاطلاع على فهم الأحداث المتعلقة بتحريك الفأرة والتعامل معها في جافاسكربت

يظهر الخطأ لأن هنالك مشكلة بإنشاء واستدعاء كائن JSON. فقبل اسناد قيمة الكائن ستحتاج أولا تحويله الى سلسلة نصية اولا كـ: window.localStorage.user = JSON.stringify({ // لاحظ name : 'mohammed', age : 14 }); ثم سيمكنك استدعاءه او طباعته بشكل عادي: console.log(typeof JSON.parse(localStorage.user)); الناتج: object كيف تستخدم JSON في JavaScript.

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

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

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

supervisor هو أحد برامج مراقبة الاجراءات أو الـ proccess monitors. وهي برامج تتيح لمستخدميها مراقبة عدد من العمليات والتحكم فيها على أنظمة تشغيل شبيهة بـ UNIX أو Unix like OS. يقترن هذا المفهوم احيانا بلارافيل عندما نحاول تشغيل طوابير الانتظار Queues أو الـويب سوكيتس او حتى عند العمل على جدولة المهام Task Sheduling أحيانا ويكون هذا في بيئة انتاجية. أي لن يتاح لنا تشغيل أوامر اعتيادية من مثل queue:work أو shedule:run أو websocket:serve عن طريق الطرفية بشكل دائم. فبمجرد اغلاقك للطرفية Terminal سيتوقف الاجراء الذي تقوم به. وهو بالطبع ما لا تريده. supervisor هو ما يجنبنا هذا الشيء. ولتثبيت supervisor كمراقب اجراءي proccess monitor في استضافتك ستحتاج بداية وصولا كـ root وهو الامر الذي لا يكون متاحا في استضافات الويب المشتركة، وانما في استضافات VPS فقط. عدى ذلك، تثبيته واعداده يعدان أمرين سهلين. إذ ان تثبيته يكون عن طريق أوامر من مثل: sudo apt-get install supervisor ثم ان ملفات اعداه لن تكون الا كـ: [program:websocket-start] process_name=%(program_name)s_%(process_num)02d command=php /var/www/laravel-example/artisan websockets:serve --port=6006 autostart=true autorestart=true user=forge numprocs=2 redirect_stderr=true stdout_logfile=/var/www/laravel-example//storage/logs/supervisord.log يمكن الوصول الى هذا الملف عن طريق المسار ( /etc/supervisor/conf.d) في انظمة لينكس. رغم هذا إلا ان هذا يتعذر في حالة استضافات الويب المشتركة، ولذلك فإننا نلجئ أحيانا إلى افكار أخرى قد توفي أو تخدمنا في حاجات معينة. عن نفسي، استعمل وانصح باستعمال أحد هاته الطرق حسب الحاجة، تشغيل الأمر يدويا عن طريق الواجهة Artisan في مسار ما من مثل: Artisan::call('queue:work --once') ولكن هذا لا يعد عمليا كثيرا، لأن تشغيل الأمر لن يكون متاحا لأي كان، وإنما لمشرفي الموقع او بعض من يمتلكون صلاحية الوصول الى المتحكم الذي يشغل هذا الامر. تعد هاته الطريقة عملية في حالة عدم الحاجة الى تشغيل الامر بشكل دائم أين يكون مقيدا بعملية ما. على سبيل المثال: بعد أن ينتهي مشرف الموقع من القيام بتعديلات على المكتب الخلفي يصل بطريقة ما الى المسار الذي يمكنه من تشغيل يتم فيه ارسال رسائل تنبيهات الى المستهدفين من محررين او موظفين آخرين بالموقع. تشغيل الأمر دوريا عن طريق جدولته كـ Cron job: وهو الأمر الآخر الذي يمكننا من تشغيل الأمر بشكل دوري دون الحاجة الى ان يكون الامر مقيدا بعملية ما، على سبيل المثال: يتم تجميع جديد مقالات الموقع كل نهاية اسبوع وارسالها الى المشتركين بالقائمة البريدية. هاته الفكرة أيضا قد لا تكون متاحة في أغلب خطط الاستضافة المشتركة إلا أن بعضها يتوفر على عدد لا بأس به من المهمات التي يمكن جدولتها (هوستنجر مثلا يتيح امكانية جدولة 100 مهمة). وهو الأمر الآخر السهل التعامل معه (نرفق فقط الامر الذي نريد جدولته بجانب المدة في استمارات تقدمها خطة الاستضافة). تشغيل الأمر من على الطرفية عن طريق ما يعرف بمتغيرات تقييد الوصول POSIX أين يمكنك اضافة السابقة nohup الى الامر الذي تود تشغيله من على الطرفية Terminal، ويشير هذا الى عدم ايقاف تشغيل البرنامج حتى بعد اغلاق الطرفية (بالطبع فإن هذا لا يشمل اعادة تشغيل الامر حتى بعد تعطله مثل ما تتيحه برامج مراقبة الاجراءات مثل supervisor ولذلك فإنك ستكون مسؤولا عن اعادة تشغيل الامر في حالة تعطله). فبدل طباعة الأمر: php artisan websockets:serve --port=6006 ستحتاج فقط اضافة السابقة nohup: nohup php artisan websockets:serve --port=6006 وسيمكنك اغلاق الطرفية بشكل عادي. (جرب تشغيل الامر واختبر ما ان كان استعمالها متاحا). يمكنك للاستزادة بالتعمق في هاته المفاهيم من خلال الاطلاع على فصول كتاب أنظمة التشغيل للمبرمجين ترجمة عن Think OS المنشورة ككتاب وكسلسلة مقالات في أكاديمية حسوب. وهو كتاب غني عن التعريف في المجال يتناول مثل هاته المفاهيم على مستوى عميق.

في الحقيقة، توجد طريقتان لتخزين هاته البيانات واعادة التقاطها لاحقا وعرضها في الصفحة كل مرة يتم تحديث هاته الصفحة: الطبيعي والأصل هو: قواعد البيانات. وفي هذا ستحتاج معرفة بتطوير الواجهة الخلفية. الطريقة الأخرى هي في استعمال التخزين المحلي للمتصفح، وهاته الطريقة غالبا لا تستعمل لمثل هاته التطبيقات التي تحوي بيانات كبيرة لأنها محدودة وتضع حدا لحجم البيانات التي يمكن تخزينه عليها. عموما سيمكنك تخزين البيانات كالتالي: localeStorage.setItem('data' ,your_data); على أن data هو مفتاح يتم به التعرف على هاته البيانات، وyour_data هو مرجع المتغير الذي يحمل البيانات المراد الحفاظ عليها. ثم سيمكنك جلبها كـ: localeStorage.getItem('data'); وذلك عن طريق المفتاح الذي تستعمله. للاستزادة يمكنك التعرف على تخزين البيانات محليا في متصفح الويب عبر جافاسكربت

يحدث التجاوز على المحور الأفقي بسبب أن الصورة التي تستعملها (الحواسيب والأجهزة في البانر) تمتلك عرضا تلقائيا، ولهذا ستحتاج اعطاءها عرضا ثابتا او نسبيا لكي تتجنب هاته المشكلة. <img class="w-100" src="images/hero.svg" alt=""> ان كانت الصورة تبدو كبيرة في الشاشات الكبيرة والمتوسطة يمكنك ضبط العرض عن طريق وضع الصورة ضمن حاو نحدد عرضه عن طريق قواعد نظام الشبكة في إطار العمل Bootstrap: <div class="row"> <div class="col-12 text-center"> <div class="text-box"> <h1>Designer, Front-end Developer & Mentor</h1> <p>I design and code beautifully simple things, and I love what I do.</p> <img src="images/mf-avatar.svg" alt=""> </div> </div> <div class="col-lg-6 col-sm-12 m-auto"> <img class="w-100 m-auto" src="images/hero.svg" alt=""> </div> </div> فيما يلي توثيق نظام الشبكة في إطار العمل Bootstrap.

هل يمكنك ارفاق ملفات المشروع بشكل مضغوط؟ لا يبدوا ان التنسيقات المرفقة تعمل بشكل صحيح لدي.

لتفادي المشكلة قد قمت بتزويد ارتفاع كل من العناصر: .navbar a{ color: #fff; margin: 20px 50px; font-weight: bold; text-align: center; font-size: 20px; word-wrap: break-word; width: 20px; letter-spacing: 3px; padding: 5px; transition-duration: 0.5s; /*++++++++++++++++*/ height: 250px; } قمت ايضا بازالة تأثيري الهوفر background-colo و height، يمكنك استبدالهما بأي تأثير آخر لأنهما لن يخدما الفكرة التي لديك: .navbar a:hover{ width: 120px; border-radius: 8px; text-align: center; letter-spacing: normal; transition-duration: 2.5s; }

بما أنك تقوم بإعطاء عرض 1% لحاوي كل كلمة، لما لا تقوم فقط بإعطاءه عرضا كاملا عند تمرير مؤشر الفأرة عليه؟ وبالتالي فإنه لن يتم النزول سطرا لتظهر بشكلها الافتراضي. مثال: .navbar a:hover{ width: auto; } مثال عملي.

هلا قمت فضلا بالتقاط صورة كاملة لنص الخطأ، يحتمل ان يتضمن ذلك بعض التفاصيل المهمة.

هل يمكنك اختبار الامر من متصفح آخر؟ لأن المشكلة لا تظهر لدي

يبدوا ان هنالك مشكلة في تطبيق التنسيقات على الملف. يحتمل انك تستعمل نسخة اقدم من HTML ولذلك سنتأكد من تعريف نوع ملف التنسيقات عن طريق اضافة الخاصية type مرفقة بالقيمة text/css الى وسم تضمين ملف style.css كالتالي: <link type="text/css" rel="stylesheet" href="style.css"> يجب الاشارة الى ان هذا التعريف كان اجباريا في نسخ اقدم من HTML، ومع ظهور HTML5 قد تم التخلي عليه. تأكد ايضا من تعريف باقي الانواع كـ: <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script> <script type="text/javascript" src="script.js"></script> يرجى الاشارة في حالة الاستمرار المشكلة.

لا تظهر اي رسائل اخطاء لدي، ما هي المشكلة لديك بالضبط؟ هل يمكنك نسخ نص رسالة الخطأ او التقاط صورة لها؟

الخطأ بالـ console يخبرك ان ملف السكربت script.js غير موجود، يرجى ارفاق مسار صحيح لهذا الملف. ان كانت رسالة الخطأ التي تظهر لديك غير هاته: Failed to load resource: the server responded with a status of 404 (Not Found) script.js يرجى ارفاق ملف script.js ايضا

هلا قمت بارفاق شيفرة HTML أيضا؟

في هاته الحالة ستكون ساعات العمل نموذجا منفصلا عن المنتج نفسه، لن تحتاج ربط الجدولين وسيكون كلاهما جدولا منفصلا دون أي مفاتيح في أحدهما تميز الآخر. ان كنت تنوي تعطيل اظهار المنتجات او اظهارها بشكل ما في الحالات التي يكون فيها المتجر متوقفا عن العمل فأنت في الغالب ستحتاج اضافة شرط ما كالتالي مثلا: <?php if(store_is_available()){ // اظهار المنتجات } ?> على ان الوظيفة store_is_available هي وظيفة مخصصة تقوم بالتحقق من ما ان كان المتجر متوقفا عن العمل في اللحظة التي يتم استدعاء الوظيفة فيها أو لا. وهذا بشكل عام، يمكنك تخصيصها لتخضع لأشياء أخرى. ملاحظة: المثال بلغة PHP كلغة للواجهة الخلفية، يمكنك تخصيصه وفق اي نموذج او اي لغة تستعملها.

مشكلتك غير واضحة، هلا قمت فضلا بوصفها على نحو أفضل

لا أعلم ما الذي تقصده تماما بساعات العمل، هل يمكنك التوضيح أكثر؟ هل تقصد انها ساعات العمل على المنتج؟

التصميم جيد عموما ولكن أظنه يحتاج بعض الضبط قليلا، فيما يلي بعض الملاحظات حول ذلك: يظهر انزلاق بسبب تجاوز للعناصر على مستوى المحور الأفقي، تأكد من اضافة overflow-x:hidden الى عنصر body للتخلص من المشكلة. نفس ملاحظة المدرب أسامة، أظنك تحتاج اظهار قائمة التصفح. بالوضعية الحالية لقائمة التصفح، لا يوجد ضرورة لاضافة الأيقونة التي تقوم بإظهار وإخفاء القائمة. فهكذا أنت تضطر المستخدمين الصعود الى أعلى الصفحة ثم الضغط من أجل إظهار القائمة لمجرد التصفح الى عنصر آخر. وهو بلا شك ما سيعكس تجربة تصفح سيئة. الحل: قم بإعطاء القائمة وضعية ثابتة position:fixed بالإضافة إلى إبقاء زر الإخفاء. بالنسبة للقسم الأول، قسم عارض الشرائح.يوجد الكثير من المساحات الفارغة التي تحتاج الإهتمام بها أكثر. يمكنك مثلا ضبط حجم الصور ليحتل مساحة أكبر. يمكنك أيضا اضافة أسهم أو دوائر لإعطاء عارض الشرائح مرونة أكثر. أظنك تحتاج اعادة اختيار الصور بعناية، لا تظهر الصور بخلفيات شفافة بشكل جيد، كما أنك تقوم بتبديد جودة الصور عن طريق اعطاء صور من مقاسات مختلفة نفس المقاسات (يمكنك لتفادي هذا المشكل اعطاء الصور عرضا واحدا مع ارتفاع تلقائي، ستلاحظ فرقا كبيرا بهذا). بالقسم الثاني، قسم Popular items حاول المحافظة على ما يسمى النظرة المتناظرة symmetric look. فوجود 5 بطاقات في الصف الأول و 1 في الصف الثاني لا يعطي انطباعا جيدا. أضف 4 أخرى الى الصف الثاني أو قم بالغاء الصف الثاني تماما. بقسم المعرض، تأكد من التخلص من الفراغات السلبية negative spaces. وهي بشكل بسيط الفراغات غير المتساوية بين عناصر نفس الجنس. لاحظ: يعطي هذا انطباعا عن أن الأقسام منفصلة وغير منظمة. درجات الألوان بحدود البطاقات في قسم المعرض حادة جدا وتقليدية، أظنك تحتاج تخفيفها والاهتمام بها أكثر. وتبقى مجرد ملاحظات يمكن أن يختلف فيها مصممو واجهات الاستخدام، فالمجال بدرجة أولى مجال ابداعي، وأشياء مثل الفن والجمال لا يمكن تحديدها وضبطها بسهولة.

لا، لا يعني عدم القدرة على الدفع الى مستودع git انه لا يمكنك الاعتماد على حسابين. ستحتاج في هذا اول الامر التحقق من المشكلة، ما رسالة الخطأ التي تظهر؟ هل يمتلك كل من الحسابات امكانية للوصول الى مختلف هاته المستودعات؟ بعد هذا، ستحتاج تنظيم عملية الدفع الى المستودع أكثر. لأنه لا يفترض من كامل هاته الحسابات الدفع الى مشروع واحد، بل سيحتاج كل منها فرعا منفصلا يدفع اليه. فعلى سبيل المثال: المستخدم أحمد يدفع الى الفرع ahmed-brunch المستخدم علي يدفع الى الفرع ali-branch يقوم المستخدم محمود بعمل merge لكل التعديلات من الأفرع ودفعها الى الفرع الرئيسي main هل يمكنك اضافة تفاصيل اكثر عن المشكلة التي تواجهها؟

هل تستعمل وردبرس؟

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