عبدالباسط ابراهيم

المهارات التي تعلتمها لم تقم بالتطبيق عليها إلا في موقع واحد كما أنك لم تتعلم غير الأساسيات كما قلت وهذا ما يقف عنده الكثير ولا يحاول تطوير مهاراته والتطبيق عليها لإكتساب الخبرات إنما يستعجل الحصول على الوظيفة وهذا السبب هو المسئول عن كثرة المبرمجين ال frontend ولكن معظمهم ليسو بالخبرة الكافية أبداً بالطبع يمكنك الحصول على عمل في منصات العمل الحر ولكن ستواجه مشكلتين لن تكون قادر على تنفيذ المشاريع المعقدة نسبياً لذلك ستقدم عرضك على المشاريع البسيطة ستواجه عدد كبير من المتقدمين للمشروع ولذلك ستكون المنافسة عالية لدرجة كبيرة يمكنك إتباع الطريق السابق ولكن يمكنك أيضاً التطوير من مهاراتك لتحاول المنافسة في مكانة أعلى قليلاً وسيكون العائد وقتها أعلى ومنافسة أقل لذلك يجب عليك تطوير مهاراتك والتطبيق بشكل مكثف كيف يمكنك اكتساب خبرة قيّمة تساعدك في الحصول على وظيفة؟ تطوع بمهارات البرمجة الخاصة بك : يعد التطوع طريقة رائعة لاكتساب خبرة حقيقية وإضافة بعض المشاريع المثيرة للاهتمام إلى ال portfolio . العمل الحر: عندما تحاول إثبات نفسك كمطور قوي. تحقق من مواقع مثل مستقل لمشاريع مخصصة. قد يكون من المفيد أيضًا التواصل مع الشركات المحلية الصغيرة لمعرفة ما إذا كان بإمكانهم استخدام خدماتك. قد لا يكون هذا هو المسعى الأكثر ربحًا في حياتك المهنية ، لكنه يرسل رسالة واضحة إلى أصحاب العمل: لديك مهارات واقعية وأنت مستعد لاستخدامها! لا تتوقف عن البناء: عندما يتعلق الأمر بإقناع أصحاب العمل بأنك جاهز للعمل ، فإن الأمر كله يتعلق بالتدريب العملي ووضع مهاراتك موضع التنفيذ.لذلك ، من المهم حقًا الاستمرار في التعلم والبناء. كلما زاد عدد المشاريع التي تعمل عليها - سواء كانت مفتوحة المصدر أو تطوعية أو مستقلة - كلما كان عليك التحدث عنها في غرفة المقابلة.تعد مواكبة المشاريع وتجربة أشياء جديدة طريقة رائعة لتحسين مقاطع الترميز الخاصة بك. نصيحة أخيرة إذا كنت تفكر في الحصول على دورة من دورات حسوب للتطوير من مهاراتك فأنا أرشح لك بكل ثقة دورة تطوير التطبيقات باستخدام JavaScript أكثر من أي دورة أخرى حيث أن هذه الدورة مناسبة جداً لك قم بالإطلاع على المحتوى الخاص بالدورة

بما أنك ذكرت ال frontend ستكلم معك بخصوص هذا المجال سيقل الطلب في المستقبل وهذا ولكن ليس لأن مثلاً يمكن لشخص ليس له علم بالبرمجة بناء الموقع بمفرده من خلال أدوات الذكاء الإصطناعي(وذلك حالياً ولكن لا يمكن لأحد توقع ما يمكن أن يحدث في المستقبل) إنما لنفترض حالة يصبح فيها تطوير Front End Development أسهل وأسرع بفضل الذكاء الاصطناعي والإكمال التلقائي للشفرة، مما يتيح للمطور الفردي استخدام نفس القدرة التي كان يستخدمها فريق بأكمله أو حتى لشخص غير مطور أن يفعل ما كان يمكن لمطور واحد فقط القيام به. لذلك تلخيصاً سيقل الطلب في الكثير من المجالات في البرمجة أو غيرها الكثير ولكن سيبقى هناك دائماً إحتياج للمبرمجين إذا كنت تقصد تطبيقات الويب (backend) فتعد لغتا Python و JavaScript من بين اللغات الأكثر استخدامًا في برمجة التطبيقات الواجهة الخلفية (Backend)، ولكل منهما مميزاتها وعيوبها التي ينبغي مراعاتها عند اختيار اللغة المناسبة للمشروع. لغة Python تتميز بسهولة التعلم والاستخدام ويمكن للمطورين برمجة تطبيقات الواجهة الخلفية بشكل سريع باستخدام إطارات العمل الشهيرة مثل Django و Flask. كما أن Python يتميز بقدرته على التعامل مع البيانات بشكل فعال وموثوق، ويتم استخدامه بشكل شائع في مجالات الذكاء الاصطناعي والتعلم الآلي. أما لغة JavaScript فهي اللغة الأساسية لبرمجة تطبيقات الويب، ويمكن استخدامها في برمجة الواجهة الخلفية باستخدام إطارات العمل الشهيرة مثل Node.js و Express.js. تتميز JavaScript بالقدرة على التفاعل مع صفحات الويب وجعلها أكثر حيوية وديناميكية، ويتم استخدامها بشكل شائع في برمجة تطبيقات الويب والتطبيقات النشطة. ومع ذلك، يجب أن يتم اختيار اللغة المناسبة لبرمجة الواجهة الخلفية بناءً على متطلبات التطبيق والمهارات المتاحة لدى المطورين وتوافر الموارد والأدوات المتاحة.

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

بعض الأدوات والمكتبات الممكن استخدامها لتطوير مثل هذا الموقع هي: React: يمكن استخدام هذه المكتبة لتطوير واجهة المستخدم الحديثة والمتطورة. تمكن React المطورين من تصميم واجهات المستخدم الديناميكية والتفاعلية بسهولة وفعالية. Node.js: يمكن استخدام Node.js لتطوير الخادم الخاص بالتطبيق والذي يمكنه التعامل مع الطلبات والاستجابات بطريقة متزامنة. MongoDB: يمكن استخدامها كقاعدة بيانات لتخزين المعلومات المتعلقة بالرحلات والحجوزات والطلبات. يتميز MongoDB بقدرته على التعامل مع البيانات غير المنظمة بطريقة فعالة. Stripe: يمكن استخدام Stripe لإدارة المدفوعات والحجوزات. تتيح Stripe إمكانية الدفع عبر الإنترنت بطريقة آمنة وسهلة. Google Maps API: يمكن استخدام Google Maps API لعرض الأماكن والمعالم السياحية وتوفير المعلومات المتعلقة بها. Firebase: يمكن استخدام Firebase لإدارة الحجوزات وإرسال الإشعارات والتحقق من الهوية والتخزين والتحليلات. هذه هي التقنيات الأساسية لمحاولة تنفيذ مشروع مثل الموجود بالسؤال ولكن هناك إختيارات أخرى لذلك من المهم التأكد من اختيار الأدوات والمكتبات المناسبة للمشروع والتأكد من تحديد الأهداف والمتطلبات بشكل جيد قبل الشروع في التطوير. الأدوات الأخرى التي ربما تحتاجها . Mapbox: يمكن استخدام Mapbox لإضافة خرائط التفاعلية والعرض المميز للخرائط. Algolia: يمكن استخدام Algolia لإضافة ميزات البحث السريع والدقيق إلى التطبيق. Auth0: يمكن استخدام Auth0 لإضافة الأمان وإدارة الهوية والوصول إلى التطبيق. Twilio: يمكن استخدام Twilio لإضافة ميزات الرسائل النصية والمكالمات الصوتية والفيديو إلى التطبيق. SendGrid: يمكن استخدام SendGrid لإضافة ميزات البريد الإلكتروني وإدارة الاتصالات مع المستخدمين. Cloudinary: يمكن استخدام Cloudinary لتحميل وتخزين الصور والفيديو وتحسينها وتسليمها بسرعة عالية.

عندما يتم وضع الصور والأيقونات والنصوص بصيغة PDF داخل مجلد `src`، قد يؤدي ذلك إلى زيادة حجم حزمة التطبيق النهائية، حيث يتم تضمين هذه الملفات في الحزمة النهائية للتطبيق. وهذا يمكن أن يؤدي إلى زيادة وقت التحميل وتأثير سرعة التحميل للصفحات. علاوة على ذلك، يمكن أن يؤدي وضع الصور والأيقونات والنصوص بصيغة PDF داخل مجلد `src` إلى صعوبة في إدارة هذه الملفات، حيث يتم إدارتها كملفات مصدرية وليس كملفات ثابتة مثل الصور والأيقونات التي تتم إدارتها في مجلد `public`. وبشكل عام، يجب الالتزام بوضع الصور والأيقونات والنصوص بصيغة PDF في مجلد `public` والاستفادة منها باستخدام المسارات النسبية في صفحات التطبيق والمكونات. ويمكن استخدام أدوات الضغط والتحسين لتقليل حجم هذه الملفات وتحسين أداء التطبيق في الوقت نفسه. ومع ذلك، قد يكون من الضروري وضع بعض الملفات داخل مجلد src في الحالات التالية: إذا تم استخدام الصور والأيقونات والنصوص بصيغة PDF كمكونات React وتم تحويلها إلى رموز مصدرية باستخدام webpack أو أدوات مماثلة. في هذه الحالة، يتم وضع الملفات داخل مجلد src ويتم إدخالها إلى التطبيق باستخدام import. إذا كانت الصور والأيقونات والنصوص بصيغة PDF جزءًا من محتوى محدد للتطبيق وتحتاج إلى إدارة وتحرير مستمر. في هذه الحالة، يمكن وضع الملفات داخل مجلد src وإدارتها كملفات مصدرية.

أفضل إختيار بالنسبة لك هو الإستفادة من هذا العرض في شراء دورة " تطوير واجهات المستخدم" حيث ستتعلم كيف تبني واجهات مواقع حقيقية، الأمر الذي سيؤهلّك للعمل كمطوّر واجهات محترف ويضعك على الطريق الصحيح في مشوارك المهني. وتصبح frontend web developer محترف وبعد الحصول على الدورة السابقة أفضل دورة مناسبة بالنسبة لك هو إختيار الدورة " تطوير التطبيقات باستخدام لغة JavaScript " ولكن لماذا أفضل هذه الدورة عن غيرها ؟ لأن هذه الدورة ستقوم بتعليمك بشكل أكثر تعمقاً ال javascript التي تحتاجها في frontend بكثرة ثم أساسيات مكتبة React.js المطلوبة في السوق حالياً ثم تعلم أساسيات بيئة Node.jsلتطوير النظم الخلفية بشرح مفصّل وعملي. والعديد من التقنيات الأخرى تعلم Full-Stack يوفر العديد من الفوائد للمطورين، بما في ذلك: اكتساب مهارات متعددة: يتيح لك تعلم Full-Stack اكتساب مهارات في مجالات متعددة من تطوير البرمجيات، بما في ذلك الواجهة الأمامية والخلفية وقواعد البيانات. هذا يسمح لك بالتحكم بكل جوانب التطبيق وتطويره بالكامل بنفسك. فهم كامل للتطبيق: عندما تعرف كيفية بناء التطبيق من الجانب الأمامي والخلفي وقواعد البيانات، فإن ذلك يساعدك على فهم كامل لكيفية عمل التطبيق والتفاعل بين مكوناته. هذا يسمح لك بتقديم تحسينات وإجراء تغييرات بسهولة وبسرعة. زيادة الفرص الوظيفية: يوفر التعلم Full-Stack فرصاً وظيفية أكبر، حيث يمكنك العمل في مجالات مختلفة والعمل في شركات صغيرة وكبيرة. كما أنه يزيد من فرص العمل كمستقل والعمل على مشاريعك الخاصة.

يمكن تنفيذ عملية تنزيل ملف Excel وحفظه على الجهاز في React Native دون استخدام مكتبات خارجية، باستخدام fetch API. يمكنك استخدام الكود التالي: // تحميل ملف الإكسل fetch('https://example.com/excel-file', { method: 'GET', }) .then((response) => response.blob()) .then((blob) => { // إنشاء رابط URL للملف المحمل const url = URL.createObjectURL(blob); // إنشاء عنصر a للتنزيل const link = document.createElement('a'); link.href = url; link.setAttribute('download', 'example.xlsx'); // إضافة العنصر a للصفحة والنقر عليه للتحميل document.body.appendChild(link); link.click(); // حذف العنصر a بعد التحميل link.parentNode.removeChild(link); }) .catch((error) => { console.error(error); }); في هذا المثال، يتم استخدام fetch API لتنفيذ طلب GET لتحميل ملف الإكسل من https://example.com/excel-file. بعد ذلك، يتم استخدام response.blob() لتحويل الملف إلى كائن Blob. يتم إنشاء رابط URL للملف المحمل باستخدام URL.createObjectURL(blob)، ثم يتم إنشاء عنصر a باستخدام document.createElement('a') ويتم تعيين خاصية href للرابط URL وخاصية download لاسم الملف. يتم إضافة العنصر a للصفحة باستخدام document.body.appendChild(link)، ويتم النقر على العنصر a لتنزيل الملف باستخدام link.click()، ثم يتم حذف العنصر a بعد التحميل باستخدام link.parentNode.removeChild(link). كما أن هناك العديد من المكتبات التي يمكن استخدامها في React Native للتعامل مع ملفات Excel. فيما يلي بعض المكتبات الشائعة التي يمكن استخدامها: react-native-xlsx: مكتبة لقراءة وكتابة ملفات Excel في React Native باستخدام OpenXML. react-native-excel: مكتبة لقراءة وكتابة ملفات Excel في React Native باستخدام OpenXML و Apache POI. exceljs: مكتبة لقراءة وكتابة ملفات Excel في JavaScript. xlsx: مكتبة لقراءة وكتابة ملفات Excel في JavaScript. تختلف المكتبات في الوظائف التي تدعمها والطريقة التي تتعامل بها مع ملفات Excel، لذلك يجب اختيار المكتبة المناسبة بناءً على متطلبات المشروع.

عملية التحقق من صحة البيانات (Validation) يمكن أن تتم من جهتين: Front-end: باستخدام JavaScript وقبل إرسال البيانات إلى السيرفر. هذا الخيار يوفر على السيرفر تلقي بيانات خاطئة ومعالجتها. لكن لا يمنع من إمكانية تجاوز عملية التحقق بسهولة. Back-end: باستخدام Laravel Validation وبعد إرسال البيانات إلى السيرفر. هذا الخيار يضمن تلقي السيرفر لبيانات صحيحة فقط. لكن يؤدي إلى زيادة عدد الطلبات لأن بعضها قد تحتوي على بيانات خاطئة. الحل الأمثل هو استخدام Validation من الجهتين: على مستوى الـFront-end لتوفير بعض المعالجة وعدم إرسال بيانات ظاهرة الخطأ. على مستوى الـBack-end كضمانة أخيرة ولمنع أي محاولات للتجاوز. بهذه الطريقة نضمن تلقي السيرفر لبيانات صحيحة معظم الوقت، مع الأخذ بعين الاعتبار إمكانية وجود بعض البيانات الخاطئة والتي سيتم التعامل معها على مستوى السيرفر. أمثلة على الشرح السابق على مستوى الـFront-end: نقوم بتحديد قواعد التحقق من صحة الحقل مثل: طول الحقل ونوع البيانات وما إلى ذلك. نكتب دالة JavaScript تسمى مثلا validateForm() تقوم بالتحقق من جميع الحقول عند إرسال النموذج. إذا وجدت خطأ في أحد الحقول، نعرض رسالة خطأ للمستخدم ونمنع إرسال النموذج. إذا كانت كل البيانات صحيحة، نسمح بإرسال النموذج. على مستوى الـBack-end: نستخدم طريقة validate() في Laravel لتعريف قواعد التحقق لكل حقل. مثل: $this->validate($request, [ 'name' => 'required|max:50', 'email' => 'required|email|unique:users' ]); إذا كانت البيانات المرسلة من النموذج غير صحيحة، ستقوم طريقة validate() بإظهار رسالة خطأ وإعادة توجيه المستخدم إلى الصفحة السابقة.إذا كانت البيانات صحيحة، يتم قبول النموذج ومعالجة البيانات. هذه هي عملية التحقق من صحة البيانات بشكل أساسي. يمكن لـLaravel أيضا أن تقوم بالتحقق من صحة بيانات أكثر تعقيدا مثل توافق كلمة المرور أو تحقق من صيغة البريد الإلكتروني وغيرها.

تخبرك الرسالة أنك تستخدم بعض الموارد ال deprecated، وهي navigator.userAgent navigator.appVersion navigator.platform لذلك يمكن الانتقال إلى استخدام `navigator.userAgentData` للوصول إلى معلومات المتصفح بدلاً من استخدام الخصائص المهجورة `navigator.userAgent` و `navigator.platform` و `navigator.appVersion`. يمكن استخدام هذا الأسلوب في المتصفحات الحديثة التي تدعم هذه الوظيفة مثل Chrome و Firefox و Edge. فيما يلي مثال على كيفية استخدام `navigator.userAgentData` للحصول على معلومات المتصفح: if (navigator.userAgentData) { const uaData = navigator.userAgentData; const browserName = uaData.brands.filter(brand => brand.brand === 'Google Chrome')[0].brand; const browserVersion = uaData.brands.filter(brand => brand.brand === 'Google Chrome')[0].version; console.log(`Browser: ${browserName}, Version: ${browserVersion}`); } else { const userAgent = navigator.userAgent; const browserName = userAgent.indexOf("Chrome") !== -1 ? "Google Chrome" : "Unknown"; const browserVersion = userAgent.substring(userAgent.indexOf("Chrome")).split("/")[1].split(" ")[0]; console.log(`Browser: ${browserName}, Version: ${browserVersion}`); } في هذا المثال، يتم فحص توفر `navigator.userAgentData` وإذا كانت متاحة، يتم استخدامها للحصول على اسم وإصدار المتصفح. يتم استخدام خاصية `brands` للحصول على مصفوفة من العلامات التجارية للمتصفحات وإصداراتها، ويتم استخدام `filter` للبحث عن ماركة متصفح محدد (في هذا الحالة Google Chrome)، ثم يتم عرض اسم المتصفح وإصداره. إذا لم يكن `navigator.userAgentData` متاحًا، يتم استخدام `navigator.userAgent` للحصول على اسم وإصدار المتصفح. يتم استخدام `indexOf` للبحث عن "Chrome" في سلسلة معرف المستخدم، ثم يتم استخدام `substring` و `split` لاستخراج إصدار المتصفح. يجب ملاحظة أن هذا المثال يستخدم `navigator.userAgentData` للحصول على اسم المتصفح وإصداره، ولكن يمكن استخدامه أيضًا للحصول على معلومات أخرى، مثل نوع جهاز المستخدم وهل يدعم الجهاز WebVR أو WebAR.

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

@media only screen and ( min-wigth 600px){background-color: Ex red } تشير الكلمة الأساسية screen إلى أنه جهاز كمبيوتر أو هاتف محمول أو جهاز لوحي وما إلى ذلك. هناك نوعان آخران من الوسائط ، الطباعة والكلام ، بالإضافة إلى الافتراضي الكل. لذلك عند استخدام media only screen and كما في الكود السابق يعني أنك تستهدف فقط شاشات مثل أجهزة سطح المكتب والكمبيوتر المحمول والكمبيوتر اللوحي والجوال وما إلى ذلك ، وليس أجهزة الوسائط الأخرى مثل وسائط الطباعة وقارئات الشاشة وما إلى ذلك. لذلك يمكنك حذف ال only screen and واستخدام الكود كما في التعليق السابق بدون مشاكل كما أن الأكواد التي كتبتها يجب أن تعمل أيضاً في ال Sublime text و ال visual studio code حيث أنهما محررات أكواد وليس لهما تأثير على الكود لذلك ربما كتبت الكود بشكل غير صحيح في ال visual studio code

يتحقق البرنامج النصي flutter من وجود دليل .git في دليل العمل. إذا لم يكن هذا الدليل في مكانه ، فسيتم اعتبار الرسالة كما تم الإبلاغ عنها. لذلك حاول تنفيذ الأمر git clone -b beta https://github.com/flutter/flutter.git أو git init لحل المشكلة

عند تحريك عنصر مسار (path) في SVG يفضل استخدام JavaScript بدلاً من CSS. يمكن استخدام مكتبة JavaScript مثل GreenSock (GSAP) أو anime.js لتحقيق ذلك بسهولة. فيما يلي مثال يوضح كيفية تحريك عنصر مسار (path) في SVG باستخدام GreenSock: HTML: <svg width="200" height="200"> <path id="myPath" d="M10 10 H 90 V 90 H 10 L 10 10" stroke="black" stroke-width="2" fill="none" /> </svg> JavaScript: // تحديد العنصر path الذي يراد تحريكه const myPath = document.querySelector('#myPath'); // تحديد مسار الحركة الذي يراد تطبيقه على العنصر path const motionPath = MorphSVGPlugin.pathDataToBezier(myPath.getAttribute('d'), {align: myPath}); // تحديد مدة وتأخير الحركة const tl = gsap.timeline({repeat: -1, yoyo: true, delay: 1}); tl.to('#myCircle', { duration: 2, motionPath: { path: motionPath, align: myPath, autoRotate: true } }); تتضمن هذه الحركة تحريك دائرة (circle) على طول مسار الـ path. يتم استخدام `MorphSVGPlugin` من GSAP لتحويل مسار الـ path المحدد إلى مسار منحنى يمكن استخدامه في تحريك الدائرة. يتم تطبيق الحركة باستخدام `motionPath` من GSAP، حيث يتم تحديد المسار الذي يجب على الدائرة اتباعه. يمكن تعديل قيم `duration` و `delay` و `repeat` و `yoyo` و `autoRotate` حسب الحركة التي تريدها. إذا كنت تريد استخدام العديد من ال animation يفضل استخدام مكتبة GSAP حيث توفر هذه المكتبة العديد من مميزات الرائعة وتسهل عليك تنفيذ ال animation بشكل كبير

هناك العديد من خدمات API المجانية المتاحة لقواعد بيانات الأفلام، ومن بينها: The Movie Database (TMDb) API: يوفر هذا الAPI مجموعة كبيرة من البيانات المتعلقة بالأفلام، بما في ذلك أسماء الأفلام والممثلين والإخراج والتقييمات والملصقات الخاصة بها. OMDB API: يتيح هذا الAPI الوصول إلى بيانات الأفلام من مصادر متعددة، بما في ذلك IMDB وRotten Tomatoes وغيرها. The Open Movie Database (TOMDB) API: يوفر هذا الAPI بيانات مفصلة حول الأفلام، مثل الأسماء والممثلين والإخراج والتقييمات والملصقات الخاصة بها. MovieLens API: يوفر هذا الAPI بيانات مفصلة حول الأفلام، بما في ذلك التقييمات والتصنيفات والمزيد. IMDB API: يتيح هذا الAPI الوصول إلى بيانات IMDB، بما في ذلك الأسماء والممثلين والإخراج والتقييمات والملصقات الخاصة بالأفلام. ولكن الأفضل API The Movie Database (TMDb) و The Open Movie Database (TOMDB) كليهما يوفران بيانات شاملة حول تقييمات الأفلام. يستخدم TMDb نظام تقييم يعتمد على تصويت المستخدمين، حيث تتراوح النتائج بين 0 و 10. بالمقابل، يوفر TOMDB تقييمات من مصادر متعددة، بما في ذلك Rotten Tomatoes و IMDB و Metacritic. كلا الAPI يوفران مجموعة واسعة من البيانات حول تقييمات الأفلام، بما في ذلك المعدلات المتوسطة وتقييمات المستخدمين وتقييمات النقاد. يوفر TMDb أيضًا بيانات إضافية حول شعبية الأفلام والأفلام الموصى بها والأفلام الرائجة. في النهاية، تعتمد الخيار بين هذين الAPI على الاحتياجات الخاصة بك والميزات التي تحتاجها لتطبيقك. من الجيد مراجعة الوثائق لكل API لتحديد أيهما يلبي احتياجاتك بشكل أفضل.

يجب أن تعرف أولاً الفرق بين المتغيرات والمعاملات حتى تستطيع الإجابة بنفسك المتغيرات هي عبارة عن مساحات في الذاكرة يتم تخصيصها لتخزين القيم والبيانات التي يمكن استخدامها في البرنامج. يمكن تعريف المتغيرات باستخدام var أو let أو const، ويمكن تخزين قيم مختلفة في المتغيرات خلال تشغيل البرنامج. ويمكن الوصول إلى المتغيرات في أي مكان في نطاق البرنامج، حيث يمكن تغييرها أو استخدامها في العمليات الحسابية أو أي عملية أخرى. مثال: let x = 5; let y = 10; let z = x + y; console.log(z); // سيظهر في النتيجة القيمة 15 في هذا المثال، تم تعريف المتغيرات "x" و "y" و "z" باستخدام let، وتم تخزين القيم 5 و 10 في المتغيرات "x" و "y" على التوالي. ثم تم إجراء عملية الجمع بين "x" و "y" وتخزين النتيجة في المتغير "z". وأخيراً تم استخدام دالة console.log() لإظهار قيمة المتغير "z" في النتيجة. أما المعاملات، فهي قيم تمرر إلى دالة أثناء استدعائها، ولا يمكن تغييرها داخل الدالة. يتم تعريف المعاملات بوضعها بين قوسين في تعريف الدالة، ويتم استخدامها داخل الدالة لإجراء العمليات الحسابية أو الإجراءات الأخرى التي تحتاج إلى تلك القيم. عند استدعاء الدالة، يتم تمرير المعاملات اللازمة لتلك الدالة بين القوسين. مثال: function multiply(num1, num2) { return num1 * num2; } let result = multiply(5, 10); console.log(result); // سيظهر في النتيجة القيمة 50 في هذا المثال، تم تعريف الدالة "multiply" التي تأخذ معاملين "num1" و "num2" وتقوم بإجراء عملية الضرب بينهما وإرجاع النتيجة. ثم تم استدعاء الدالة "multiply" وتمرير القيم 5 و 10 كمعاملات لها، وتم تخزين النتيجة في المتغير "result". وأخيراً تم استخدام دالة console.log() لإظهار قيمة المتغير "result" في النتيجة. في النهاية، تستخدم المتغيرات لتخزين القيم والبيانات التي يمكن تغييرها أثناء تشغيل البرنامج، بينما تستخدم المعاملات لتمرير القيم للدوال أثناء استدعائها، ولا يمكن تغييرها داخل الدالة.

يمكنك الإعلان في دول أخرى بالطبع و:ثر من ذلك حيث أن سناب شات توفر خيارات متعددة للاستهداف المستندة إلى البيانات الديموغرافية والسلوكية والموقعية والاهتمامات والسلوك الشرائي والعديد من العوامل الأخرى. فيما يلي بعض الخيارات المتاحة للاستهداف على سناب شات: الاستهداف الديموغرافي: يمكنك استهداف الفئات العمرية والجنسية والموقعية واللغوية والتعليمية والاجتماعية والاقتصادية والعديد من العوامل الأخرى الديموغرافية. الاستهداف السلوكي: يمكنك استخدام البيانات السلوكية مثل الاهتمامات والعادات الشرائية والسلوك الاستهلاكي والتصفح على الإنترنت والعديد من العوامل الأخرى لاستهداف الجمهور المناسب. الاستهداف الموقعي: يمكنك استخدام البيانات الموقعية لاستهداف الجمهور في مناطق معينة أو دول معينة أو حتى حول متاجرك أو مواقعك أو مكاتبك. الاستهداف بناءً على الجمهور المشابه: يمكنك استخدام البيانات الخاصة بالجمهور المشابه لجمهورك الحالي لاستهداف المستخدمين الذين يتمتعون بصفات مماثلة لجمهورك الحالي. الاستهداف بناءً على العلاقات الاجتماعية: يمكنك الاستهداف بناءً على العلاقات الاجتماعية، مثل الأصدقاء المشتركين أو المتابعين لحسابات معينة أو الأشخاص الذين تتفاعل معهم في التطبيق. علاوة على ذلك، يمكنك استخدام أدوات الإعلان على سناب شات مثل Snap Pixel وLookalike Audiences و Snapchat Measurement لتحسين استهداف الجمهور وقياس أداء حملتك الإعلانية. يمكنك الإطلاع على المزيد من المعلومات من خلال موقع snapchat من هذا الرابط

يمكن استخدام الصور في React بطريقة مختلفة عن الأسلوب المذكور في السؤال. يمكن استخدام import لاستيراد الصورة وإضافتها كعنصر img . مثال: import MyImage from '../images/image.png'; function App() { return ( <div> <img src={MyImage} /> </div> ); } إذا واجهت مشكلة "the request of a dependency is an expression" عند استخدام require يمكن حل المشكلة عن طريق استخدام require خارج JSX وتخزين النتيجة في متغير واستخدامه في العنصر img. مثال: import MyImage from '../images/image.png'; function App() { const imagePath = require('../images/image.png').default; return ( <div> <img src={imagePath} /> </div> ); } ملاحظة: يجب استخدام .default مع require لاستخراج المسار الصحيح للصورة.

التعديلات التي يجب تنفيذها نتيجة الإصدار الأحدث react-router-dom v6.10 هي كالتالي استخدام العنصر element بدلاً من component في Route: في react-router-dom v6، استخدمت العناصر element بدلاً من component في Route. لذلك، يجب تعديل الكود ليستخدم العنصر element على النحو التالي: <Route path="/" element={<App />} /> <Route path="/btn_test" element={<BtnTest />} /> يفضل تعديل اسم الملف: تم استخدام اسم ملف btn_test لمكون BtnTest. ومن المفترض أن يتبع معايير تسمية الملفات في React والتي تفرض أن يتم استخدام CamelCase لتسمية الملفات. لذلك، يجب تغيير اسم الملف إلى BtnTest. استخدام Navigate بدلاً من Redirect: في react-router-dom v6، يجب استخدام Navigate بدلاً من Redirect. لذلك، يجب تعديل الكود ليستخدم Navigate على النحو التالي: <Route path="*" element={<Navigate to="/" replace />} /> في react-router-dom v6، تم إلغاء Switch واستبداله بـ Routes، والذي يعمل بطريقة مشابهة لكنه يستخدم بنية أكثر تركيزًا على العناصر الفرعية والتحكم في المسارات.

يمكنك تنفيذ المطلوب بالعديد من الوسائل والطرق ولكن الأسهل والأفضل هو استخدام إطار عمل لل javascript مثلاً react والتالي هو مثال عند الضغط على زر "Add Item"، يجب أن تقوم بقراءة القيم الحالية لحقول الإدخال (اسم المنتج، الكمية، السعر) وإضافتها إلى قائمة العناصر items باستخدام دالة setItems. بعد ذلك، يمكنك استدعاء دالة handleTotal لإعادة حساب المجموع الإجمالي بناءً على العناصر الجديدة التي تمت إضافتها. لتحقيق ذلك، يمكنك استخدام الدالة handleAddItem كما يلي: const handleAddItem = () => { const itemName = document.getElementById('new-item').value; const quantity = document.getElementById('quantity').value; const price = document.getElementById('price').value; const newItem = { name: itemName, quantity: parseInt(quantity), price: parseFloat(price) }; setItems([...items, newItem]); handleTotal(); }; بالتأكيد لا تنسى تعريف المتغيرات اللازمة للتطبيق كما أن الدالة handleTotal ستكون مثل تلك الأكواد const handleTotal = () => { let sum = 0; for (let i = 0; i < items.length; i++) { sum += parseFloat(items[i].price) * items[i].quantity; } setTotal(sum); }; ثانياً إضافة حقول الإدخال والزر الخاص بإضافة المنتج، كما يلي: <div> <label htmlFor="new-item">New Item: </label> <input type="text" id="new-item" /> <label htmlFor="quantity">Quantity: </label> <input type="number" id="quantity" /> <label htmlFor="price">Price: </label> <input type="number" id="price" step="0.01" /> <button onClick={handleAddItem}>Add Item</button> </div> تقوم هذه الأكواد بإنشاء حقول الإدخال لإضافة اسم المنتج والكمية والسعر، وزر "Add Item" الذي يقوم بتشغيل الدالة handleAddItem عند النقر عليه. المثال السابق يوضح الخطوات ولكن سيتم التعديل على الأكواد حتى تتناسب مع التطبيق الخاص بك كما أن يفضل الإطلاع على المشاريع الموجودة ب github ويمكن البحث عن invoice generator + اللغة المناسبة كما في هذا المشروع

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

لربط نموذج تسجيل الدخول في Angular بقاعدة البيانات في Laravel: إنشاء API في Laravel: يمكن استخدام Laravel Passport لإنشاء API موثوق بها في Laravel. يجب تثبيته باستخدام Composer وتكوينه وفقًا للتوثيق الرسمي. بعد ذلك، يمكن إنشاء وظيفة في Laravel لإرجاع بيانات تسجيل الدخول باستخدام Passport. إنشاء ملف خدمة (service) في Angular: يمكن استخدام مكتبة HttpClient من Angular لإجراء مكالمات API. يمكن إنشاء ملف خدمة في Angular للاتصال بـ API الخاص بـ Laravel باستخدام HttpClient. استخدام نموذج تسجيل الدخول في Angular:يمكن استخدام نموذج تسجيل الدخول في Angular للحصول على بيانات تسجيل الدخول من المستخدم باستخدام توجيه وظيفة إرسال النموذج. إنشاء وظيفة في Angular لإرسال بيانات تسجيل الدخول إلى API الخاص بـ Laravel: باستخدام HttpClient. يجب تضمين بيانات تسجيل الدخول بشكل صحيح في الجسم الذي يتم إرساله إلى API. كتابة وظيفة في Laravel للتحقق من صحة بيانات تسجيل الدخول: المرسلة من Angular. يجب التحقق من صحة اسم المستخدم وكلمة المرور باستخدام وظيفة التحقق المدمجة في Laravel. استخدام البيانات المسترجعة من API الخاص بـ Laravel: بعد التحقق من صحة بيانات تسجيل الدخول في Laravel، يمكن استخدام البيانات المسترجعة من API لتسجيل الدخول في التطبيق الخاص بك. هذه الخطوات الرئيسية لتنفيذ المطلوب يمكنك الإطلاع على المصادر التالية للمزيد من المعلومات 1 و 2 و 3

بالإضافة للشرح السابق يمكنك ل f-strings في Python توفر عدة مزايا أخرى، من بينها: الدعم الكامل للتعابير الرياضية والتعابير الشرطية والدوال الرياضية وغيرها من التعابير المعقدة. إمكانية استخدام f-strings في أي سياق في Python، بما في ذلك دوال الطباعة (print) ورسائل التنبيه (assert) والأوامر الشرطية (if-else) وغيرها. إمكانية استخدام f-strings لتكوين أسماء المتغيرات والدوال والكائنات الأخرى باستخدام تعابير Python. إمكانية استخدام f-strings لإنشاء نصوص ديناميكية ومتغيرة تعتمد على البيانات التي تم إدخالها في الوقت الحالي. وللمزيد من التفاصيل يمكنك قراءة إجابة هذا السؤال حيث يوضح الشرح بالأمثلة

سأقدم لك حلاً بإزالة الجزء المتعلق بـ @foreach؛ سنستخدم طريقة أخرى للتبديل بين اللغتين. إنشاء دالة JavaScript للتحكم في تبديل اللغة وإعادة توجيه المستخدم إلى الرابط المقابل للغة المطلوبة. الكود الجديد: //head @if (App::getLocale() == 'en') <link href="{{ asset('css1/rtl.css') }}" rel="stylesheet"> @else <link href="{{ asset('css1/ltr.css') }}" rel="stylesheet"> @endif //body <a id="toggleLanguage" href="#" class="language_icon"> <i class="fa fa-language" style="font-size: 48px"></i> </a> <script> document.getElementById('toggleLanguage').addEventListener('click', function(e) { e.preventDefault(); let currentLocale = '{{ App::getLocale() }}'; let newLocale = currentLocale === 'en' ? 'ar' : 'en'; let newUrl = '{{ LaravelLocalization::getLocalizedURL(newLocale, null, [], true) }}'; window.location.href = newUrl; }); </script> في هذا الكود، قمنا بإضافة معرف id للرابط الخاص بالأيقونة وإزالة السمة hreflang والسمة href، حيث سنقوم بتعيين الرابط من دالة JavaScript. ثم قمنا بإنشاء دالة تستمع لحدث النقر على الرابط. عند النقر، تقوم بتحديد اللغة الجديدة التي نريد التبديل إليها بناءً على اللغة الحالية، وتعيين الرابط المقابل للغة الجديدة، وأخيراً إعادة توجيه المستخدم إلى هذا الرابط. بهذا الحل، يمكن للمستخدمين تبديل اللغة بالضغط على الأيقونة نفسها.

هناك العديد من الدوال المتاحة في لغة C التي يمكن استخدامها لتحقيق نفس الغرض. هناك أيضًا طرق مختلفة لتنفيذ نفس الحلقة، الأمر يتوقف على الأسلوب الذي يفضله المبرمج. طريقة أخرى وهي تنفيذ المطلوب بدون استخدام الدالة strlen() والدالة isupper() كما يلي تبدأ الطريقة بتعريف مصفوفة sentence من نوع char بحيث تكون الحجم يساوي 51، وذلك لتمكين إدخال جملة تصل إلى 50 حرفًا، بالإضافة إلى الحرف النهائي الذي يعرف بـ null character والذي يتم إضافته تلقائيًا في نهاية الجملة. ثم يتم تعريف متغير capital_count من نوع int ويتم تعيينه إلى القيمة الصفرية بدايةً. ثم يقوم البرنامج بطباعة رسالة إلى المستخدم تطلب منه إدخال جملة للفحص، وذلك باستخدام الدالة printf(). ثم يتم تحديد المدخلات التي يقوم المستخدم بإدخالها باستخدام الدالة scanf()، والتي تقوم بقراءة المدخلات من المستخدم حتى يصل إلى حرف السطر الجديد \n أو الحد الأقصى للطول الذي يساوي 50 باستخدام التحكم في النسق %50[^\n]، وتخزين الجملة المدخلة في المصفوفة sentence. ثم يتم تكرار جميع الحروف في الجملة باستخدام حلقة for، والتي تستمر حتى يتم الوصول إلى الحرف النهائي null character. وفي كل تكرار للحلقة، يتم فحص الحرف الحالي إذا كان حرفًا كبيرًا أم لا باستخدام المقارنة بين الحرف وحروف الأبجدية الكبيرة، وذلك باستخدام العبارة if(sentence[i] >= 'A' && sentence[i] <= 'Z')، وفي حال كان الحرف كبيرًا يتم زيادة قيمة متغير capital_count بمقدار 1. وفي النهاية، يتم طباعة عدد الأحرف الكبيرة الموجودة في الجملة باستخدام الدالة printf() والتي تقوم بعرض قيمة متغير capital_count باستخدام النسق %d، وذلك باستخدام العبارة printf("Number of capital letters: %d\n", capital_count);، ويتم إرجاع القيمة 0 في نهاية البرنامج باستخدام العبارة return 0;.

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