اذهب إلى المحتوى

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

الأعضاء
  • المساهمات

    4901
  • تاريخ الانضمام

  • تاريخ آخر زيارة

  • عدد الأيام التي تصدر بها

    11

إجابات الأسئلة

  1. إجابة عبدالباسط ابراهيم سؤال في هل من الممكن أن أجد عمل حر بعد إتمام دورة الذكاء الاصطناعي ؟ كانت الإجابة المقبولة   
    بالتأكيد عند إكمال هذه الدورة، ستمتلك المهارات التي تؤهلك للعمل في مجال الذكاء الاصطناعي، لكن نجاحك يعتمد أيضًا على التزامك بتطبيق ما تعلمته من خلال بناء المشاريع التي تشملها الدورة، والبحث عن وظيفة بجدية واحترافية.
    ولا تترك الأكاديمية المهمة عند تعليمك فقط إنما ستحصل على دعم من مركز المساعدة، الذي يساعدك في إعداد سيرة ذاتية متميزة.
    أما في حال لم تتمكن من العثور على وظيفة بعد الدورة، يمكنك استرداد المبلغ المدفوع بالكامل دون أي تعقيد.
     
  2. إجابة عبدالباسط ابراهيم سؤال في العودة وتعلم البرمجة بالشكل الصحيح. كانت الإجابة المقبولة   
    استرجاع ما قمت بتعلمه ليس كتعلم البرمجة من البداية حيث أنه هناك بعض الخطوات التي يفضل القيام بها لإسترجاع أكبر قدر ممكن مما تعلمته وهي كما بالتعليق التالي
    أما بالنسبة لافضل طريقة لتعلم البرمجة فلا يوجد إجابة مباشرة لمثل هذا السؤال حيث لكل شخص الطريقة الأفضل للتعلم وما يناسبك لا يناسب غيرك ولكن هناك عدة نصائح يمكن اتباعها لتحقيق أقصى استفادة من دروسك كما بالإجابات التالية
     
  3. إجابة عبدالباسط ابراهيم سؤال في مشكلة تضارب اكواد بين css و java script كانت الإجابة المقبولة   
    إذا كان هذا السؤال خاصة بأحد دروس الأكاديمية،  ستجد أسفل فيديو الدرس في نهاية الصفحة صندوق تعليقات كما هنا، أرجو طرح الأسئلة أسفل الدرس وليس هنا في قسم الأسئلة البرمجة حيث نطرح الأسئلة العامة الغير متعلقة بمحتوى الدورة أو الدرس، وذلك لمساعدتك بشكل أفضل.
    ولكن سأحاول توضيح ل المشكلة لك أو بسبب  أن العنصر filter-options تأخذ الخاصية position:absolute فإنها لا تعمل مع ال z-index لذلك لحل المشكلة احذف ال z-index للعنصر .add-to-fav
    وبالنسبة للمشكلة الثانية فهي سلوك طبيعي للكود الموجود حيث أن الكود التالي 
    filterContent.addEventListener('click', function (event) { const filterGroup = event.target.closest('.filter-group'); if (filterGroup) { filterGroup.remove(); const filterTab = Array.from(filterTabs).find(tab => tab.dataset.target === filterGroup.id.replace('active-', '')); if (filterTab) { filterTab.classList.remove('selected'); } } }); مسؤل عن حذف ال filterGroup عن الضغط عليها ولكن حاول التعديل على هذا الكود ليجعل حذف ال filterGroup عند تغيير قيمة ال select مثلاً كالتالي
    filterContent.addEventListener('change', function (event) { // التحقق من أن العنصر الذي تم التفاعل معه هو select if (event.target.matches('select')) { const filterGroup = event.target.closest('.filter-group'); if (filterGroup) { filterGroup.remove(); // العثور على التبويب المرتبط بمجموعة الفلترة هذه const filterTab = Array.from(filterTabs).find(tab => tab.dataset.target === filterGroup.id.replace('active-', '')); if (filterTab) { filterTab.classList.remove('selected'); } } } });
  4. إجابة عبدالباسط ابراهيم سؤال في نسيان كود كانت الإجابة المقبولة   
    المقصود أنه لا يجب عليك تذكر جميع الدوال أو الخصائص الموجودة بلغة البرمجة إنما المقصود أنه يجب فهم تذكر المفاهيم الأساسية في البرمجة مثلاً بلغة بايثون
    فهم مفهوم المتغيرات وأنواع البيانات المختلفة  وكيفية التعامل معها. إتقان بنية التحكم (Control Structures) مثل الشروط (If/Else) والحلقات (Loops). معرفة كيفية تعريف الدوال (Functions) واستدعائها، وفهم مفاهيم مثل المعاملات (Parameters) والقيم المُرجعة (Return Values). فهم مفهوم البيانات المنظمة (Data Structures) مثل القوائم (Lists) والمجموعات (Sets) والقواميس (Dictionaries) وكيفية استخدامها. والعديد من المفاهيم الأساسية التي يجب عليك فهمها أولاً بشكل جيد ثم تذكر طريقة قواعد اللغة لتنفيذ هذه المفاهيم ومن خلال التطبيق العملي ستتذكر الدوال والخصائص مثل shuffle وغيرها إذا استخدمتها مرة تلو الأخرى 
  5. إجابة عبدالباسط ابراهيم سؤال في عرض علي مستقل كانت الإجابة المقبولة   
    بالإضافة أيضاً للنصائح الجميلة بواسطة ياسر إليك بعض النصائح التالية لتصبح لديك فرصة كبيرة في الحصول على المشروع 
    أهم خطوة هي بناء موقع شخصي و معرض أعمال جذاب حيث يعتبر ال portfolio هو الذي يجعل العميل يثق في المستقل وجودة الأعمال لديه .
    وثانياً حاول  اختيار المشروع الذى يناسب مهاراتك وتثق أنك تستطيع تنفيذه شكل جيد حيث أنكمن خلال الخبرة في بناء موقع مماثل تستطيع تقديم عرض يطمئن العميل ويثق بك
    أخيراً  من الأخطاء التي يقع فيها البعض هو كتابة المهارات التي تجيدها لكن العميل لا يهتم بما تجيد بل يهتم بما تستطيع أن تقدم له مثال على ذلك 
    بدلاً من تقديم قائمة بالتقنيات التي تجيدها حاول التركيز القيمة التي يمكنك تقديمها للعميل .
    فبدلاً من ذكر التقنيات  مثل React.js و CSS Grid أ و Flexbox يمكنك التوضيح أنه يمكنك تنفيذ واجهة متجاوبة وتعمل على الأجهزة المختلفة بشكل ممتاز وحاول توضيح تأثير ذلك على النشاط الخاص بالعميل 
     
  6. إجابة عبدالباسط ابراهيم سؤال في مشكلة في vite كانت الإجابة المقبولة   
    هذه المشكلة تحدث بسبب إصدار nodejs وهو 20.6.1 غالباً لذلك حاول تحديث إصدار nodejs ويفضل إلى أحدث إصدار LTS من  خلال الرابط التالي 
    https://nodejs.org/en/download/ 
  7. إجابة عبدالباسط ابراهيم سؤال في هل توجد طريقة لجعل حجم الخط متجاوب بحسب طول النص في CSS ؟ كانت الإجابة المقبولة   
    حسب ما فهمت فإنه يمكنك تحقيق هذا السلوك بواسطة تكوين الخط بناءً على طول النص.
    في React JS مع Material UI، يمكنك تحقيق ذلك باستخدام Typography . 
    import React from 'react'; import Typography from '@material-ui/core/Typography'; const DynamicFontSizeText = ({ text }) => { // تحديد حجم الخط بناءً على طول النص const fontSize = text.length > 10 ? '16px' : '24px'; return ( <Typography variant="body1" style={{ fontSize }}> {text} </Typography> ); }; export default DynamicFontSizeText; في هذا المثال، إذا كانت النصوص قصيرة (10 حروف أو أقل)، سيتم تعيين حجم الخط إلى 24px، وإلا سيتم تعيينه إلى 16px، يمكنك ضبط هذه القيم وفقًا لاحتياجات التصميم الخاصة بك.
    يمكنك استخدام هذا المكون في مكان أي مكون Typography في تطبيقك وتمرير النص كخاصية text:
    <DynamicFontSizeText text="هنا يكون النص" />
  8. إجابة عبدالباسط ابراهيم سؤال في كيف تتأكد من عمل اكواد css و js على متصفح سفاري وانت تعمل على ويندوز كانت الإجابة المقبولة   
    هناك طريقتان رئيسيتان للتأكد من عمل أكواد CSS و JS على متصفح Safari وأنت تعمل على Windows:
    الطريقة الأولى: استخدام برنامج محاكي متصفح.
    يمكنك استخدام أحد هذه البرامج لتشغيل موقع الويب أو التطبيق الخاص بك على محاكي Safari، مما سيسمح لك برؤية كيفية ظهوره وعمل أكواده. أحد البرامج الشائعة للمحاكاة هو BrowserStack.
    الطريقة الثانية: استخدام أداة اختبار عبر المتصفحات.
    تسمح لك هذه الأدوات باختبار موقع الويب أو التطبيق الخاص بك على مجموعة متنوعة من المتصفحات المختلفة، بما في ذلك Safari.أحد الأدوات الشائعة لاختبار عبر المتصفحات هو CrossBrowserTesting. 
    في حالتك، حيث أنك تعمل على تنسيقات لمتجر على سلة، يمكنك استخدام أداة اختبار عبر المتصفحات لاختبار موقع الويب الخاص بك على Safari. سيسمح لك هذا برؤية كيفية ظهور التنسيقات على Safari وتحديد أي مشاكل قد تحدث.
  9. إجابة عبدالباسط ابراهيم سؤال في تعلم التفكير المنطقي كانت الإجابة المقبولة   
    التفكير المنطقي في البرمجة يأتي مع الوقت والممارسة.لذلك مع تعلم البرمجة ستجد أن التفكير المنطقي يظهر في حل المشكلات بشكل كبير كما أن حل المشكلات البرمجية تقوي التفكير المنطقي لديك ومهارة حل المشكلات بشكل كبير
    ويعتبر هذا السؤال تم الإجابة عليه عدة مرات لذلك يمكنك الإستفادة من الإجابات التالية
     
  10. إجابة عبدالباسط ابراهيم سؤال في ما هي مفاتيح النجاح في العمل الحر؟ كانت الإجابة المقبولة   
    العمل الحر ليس سهلاً كما يبدو للكثير وذلك في البداية حيث أن أصحاب المشاريع غالباً ما تقوم بتوظيف المستقلين القدامى على المنصات ولكن هناك العديد م النصائح والخطوات التي تجعلك تحصل على أول عمل لك مما يزيد من فرص النجاح على هذه المنصات وبدلاً من التكرار يفضل الإطلاع على المقالات التالية والإجابات التالية
     
     
     
  11. إجابة عبدالباسط ابراهيم سؤال في حل مشكله بطئ في جلب البيانات Node.js كانت الإجابة المقبولة   
    تواجه مشكلة شائعة عند التعامل مع كميات كبيرة من البيانات، وهي جلب جميع البيانات في نفس الوقت من قاعدة البيانات.
    إليك بعض الحلول:
    التقسيم إلى صفحات (Pagination)
    اجلب البيانات بشكل مقسم إلى صفحات، مثلاً 10 منتجات في كل صفحة أضف خيارات للمستخدم للتنقل بين الصفحات حمل بيانات الصفحة الحالية فقط عند طلبها التحميل التدريجي (Lazy Loading)
    أظهر عدد محدود من المنتجات في البداية، مثلاً 10 منتجات أضف خيار "تحميل المزيد" يقوم بجلب 10 إضافية عند الطلب يوفر تجربة أسرع بتحميل أجزاء صغيرة من البيانات استخدام Query Parameters لتحديد عدد العناصر والصفحة مثل limit=10&page=2 كما في التعليق السابق .
    الحلول السابقة تحتاج شرح مطول لذلك قم بالبحث عن المصطلحات السابقة وحاول تطبيقها وستشاهد الفرق 
  12. إجابة عبدالباسط ابراهيم سؤال في سؤال:كيف تحمي سيرفر ويندوز VPS من الهوست كانت الإجابة المقبولة   
    يختلف الوصول إلى خادم VPS (Virtual Private Server) الذي يعمل بنظام Windows Server بحسب مزود الاستضافة وسياساته. قد يقدم بعض مزودي الاستضافة وصولًا إلى الخادم الافتراضي لأغراض الدعم الفني، في حين قد لا يقدمه البعض الآخر.
    من المهم التحقق من سياسات مزود الاستضافة الخاص بك أو الاطلاع على وثائقهم لفهم سياساتهم المتعلقة بدعم VPS. سيكونون قادرين على تزويدك بأدق المعلومات حول مستوى الوصول والدعم الذي يقدمونه لخادم VPS يعمل بنظام Windows Server.
    يرجى ملاحظة أن توافر الدعم الفني ومستوى الوصول قد يختلف اعتمادًا على نوع خطة استضافة VPS التي تمتلكها. يقدم بعض مزودي الخدمة استضافة VPS المُدارة، حيث يهتمون بإدارة الخادم وتقديم الدعم، بينما يقدم آخرون استضافة VPS غير المُدارة، حيث تكون لديك مزيد من التحكم والمسؤولية في إدارة الخادم.
    لضمان الوضوح، من الأفضل الاتصال بفريق الدعم لمزود الاستضافة الخاص بك والاستفسار عن الخيارات المحددة للوصول والدعم المتاحة لخادم VPS الذي يعمل بنظام Windows Server.
    تلخيصاً يجب الإهتمام بالتعامل مع شركة استضافة كبيرة حيث أن هذه الشركات تحافظ على سمعة جيدة
  13. إجابة عبدالباسط ابراهيم سؤال في مكتبه لمساعدتي في انشاء الدورات كانت الإجابة المقبولة   
    يمكنك استخدام React-admin هي مكتبة شهيرة ومستخدمة على نطاق واسع لإنشاء لوحات تحكم باستخدام React. توفر مجموعة شاملة من الأدوات والمكونات التي تبسط عملية التطوير وتسمح للمطورين بالتركيز على بناء وظائفهم الأساسية في واجهات الإدارة.
    مزودات البيانات: تدعم React-admin مزودات بيانات مختلفة مثل REST وGraphQL ومزودات مخصصة. تتعامل هذه المزودات مع التواصل مع واجهات برمجة التطبيقات الخلفية وتوفر البيانات اللازمة للوحة التحكم. عمليات CRUD: توفر المكتبة دعمًا مدمجًا لتنفيذ عمليات الـ CRUD (إنشاء، قراءة، تحديث، حذف) على كيانات البيانات. تتضمن مكونات مُبنية مسبقًا لإنشاء نماذج، وجداول، وفلاتر، مما يسهل إدارة وتعديل البيانات. مصادقة المستخدم والترخيص: يوفر React-admin آليات للمصادقة والترخيص مدمجة في المكتبة. يدعم استراتيجيات مصادقة مختلفة مثل JWT (JSON Web Tokens) و OAuth. يمكن للمطورين بسهولة تكوين أدوار المستخدم والأذونات للتحكم في وصولهم إلى أجزاء مختلفة من لوحة التحكم. توفر React-admin دعم مُدمج للتعدد الثقافي (i18n). يتيح للمطورين ترجمة واجهة المستخدم بسهولة إلى لغات متعددة ويوفر أدوات لإدارة الموارد المتعددة اللغات. تخصيص وتغيير السمات: المكتبة قابلة للتخصيص بشكل كبير وتوفر إمكانيات تغيير السمات باستخدام Material UI. يمكن للمطورين تخصيص مظهر لوحة التحكم من خلال اختيار سمات مُبنية مسبقًا أو إنشاء سمات مخصصة خاصة بهم. يدمج React-admin بسلاسة مع Redux، وهو مكتبة إدارة الحالة الشهيرة لـ React. يستغل Redux لإدارة حالة التطبيق ويوفر ميزات مثل ذاكرة التخزين المؤقت للبيانات والتقديم المتفائل ووظيفة التراجع/الإعادة.
  14. إجابة عبدالباسط ابراهيم سؤال في افضل طريقه لرفع الصور واستخدمها في الموقع كانت الإجابة المقبولة   
    حسب مافهمت من سؤالك فإنه هناك عدة طرق ممكنة لرفع الصور واستخدامها في الموقع دون الحاجة إلى رفعها على ملفات الباك إند. وفيما يلي بعض الطرق المجانية والشائعة لذلك:
    خدمات تخزين الصور (Image Hosting Services):   يمكنك استخدام خدمات تخزين الصور عبر الإنترنت مثل Imgur وPhotobucket وPostImages وغيرها. تتيح هذه الخدمات رفع الصور وتخزينها على خوادمها، وتوفر لك روابط للصور التي يمكنك استخدامها في موقعك. يمكنك استخدام واجهات برمجة التطبيقات (API) المقدمة من هذه الخدمات للتفاعل معها وتنفيذ عمليات مثل الرفع والحصول على روابط الصور. خدمات تخزين الكائنات (Object Storage Services):  خدمات تخزين الكائنات مثل Amazon S3 وGoogle Cloud Storage وMicrosoft Azure Blob Storage توفر واجهات برمجة قوية لتخزين الصور والملفات والوصول إليها. يمكنك رفع الصور على هذه الخدمات واستخدام واجهات برمجة التطبيقات لإدارة الصور واسترجاعها وتوفير روابط لها في موقعك. خدمات الاستضافة السحابية (Cloud Hosting Services):   بعض خدمات الاستضافة السحابية مثل Firebase من Google وNetlify وVercel توفر إمكانية رفع الصور مباشرة على خوادمها واستخدامها في مواقع الويب. توفر هذه الخدمات واجهات برمجة التطبيقات ومكتبات سهلة الاستخدام للتفاعل مع التخزين وإدارة الصور. خدمات تحليل الوسائط (Media Processing Services):بعض الخدمات مثل Cloudinary وImgix توفر خدمات تحليل الوسائط التي تسمح لك برفع الصور وإجراء عمليات مثل تغيير الحجم والتلاعب بالصور وتحسينها. تتيح هذه الخدمات أيضًا إمكانية توفير روابط للصور المعالجة لاستخدامها في موقعك. تذكر أنه قد يتطلب استخدام هذه الخدمات إنشاء حسابات وتكوينها واستخدام واجهات برمجة التطبيقات المقدمة. قم بمراجعة وثائق وتعليمات الاستخدام الخاصة بكل خدمة لمعرفة المزيد عن كيفية استخدامها وتكاملها مع موقعك.
  15. إجابة عبدالباسط ابراهيم سؤال في تم ايقاف حسابى الاعلانى في تيك توك اريد المساعدة كانت الإجابة المقبولة   
    حاول مراجعة سياسات الإعلانات قد يكون سبب إيقاف حسابك هو انتهاك سياسات الإعلانات الخاصة بتيك توك. يرجى مراجعة هذه السياسات بعناية للتأكد من أنك لم تخالف أي منها. إذا كنت تعتقد أن الإيقاف كان غير مبرر، فيمكنك الإتصال بفريق الدعم لمناقشة القضية معهم.
    وإذا كان بالفعل بسبب نشاط مشبوه أو غير عادي أو انتهاك لسياسة الإعلانات فأعتقد أنه لا يمكنك فعل أي شئ للمساعدة في ذلك
    ويجب ملاحظة أن الحظر  Suspension permanent ليس حظر مؤقت للأسف بل دائم
  16. إجابة عبدالباسط ابراهيم سؤال في كلية هندسة (تخصص اتصالات/حاسبات ومعلومات) أم كلية حاسبات ومعلومات كانت الإجابة المقبولة   
    أعتقد أنه لم يتم فهم سؤالك بشكل جيد لذلك الفرق بين هندسة الكمبيوتر والحاسبات والمعلومات كما يلي
    في البداية يجب معرفة المزيد من المعلومات والاختلافات بين الكليتين لمعرفة أيهما أفضل، لذلك سوف نشرح ما يلي:
    كلية هندسة الحاسوب
    تعتمد كلية هندسة الحاسوب بشكل أعمق على دراسة المواد الإلكترونية والهاردوير، حيث تعتمد على ما مجموعه 70٪.
    يدرس الطالب طرق إنشاء أجهزة الكمبيوتر، وكذلك الأجهزة والبرامج، كما يدرس السوفتوير، ولكن ليس بالمقدار العلمي الموجود في كلية الحاسبات والمعلومات.
    تعتمد هندسة الحاسوب بشكل أساسي على دراسة الإلكترونيات فيها، بحيث تكون عصب الدراسة فيها.
    كلية الحاسبات والمعلومات
    وتعتمد في دراساتها على مواضيع متعددة أهمها الرياضيات ودراسة الخوارزميات والحوسبة ومواد الذكاء الاصطناعي. يدرس الطالب أيضًا المحاكاة وأمن الكمبيوتر.
    تهتم كلية الحاسبات والمعلومات بدراسة الشبكات والبرمجيات بأنواعها، بالإضافة إلى دراسة الأجهزة، وإنشاء أجهزة الكمبيوتر، وكيفية التعامل مع التحكم.
    هناك العديد من المواد المشتركة بين الكليتين، وقد يتجاوز عدد هذه المواد 30 حسب الجامعات المختلفة.
    مدة الدراسة والتأهيل الأكاديمي والمسمى الوظيفي:
    كلية الحاسبات والمعلومات مدة الدراسة أربع سنوات يدرس فيها الطالب دراسات الحاسب الآلي وكذلك الدراسات المعلوماتية في سنته الدراسية الأولى، ويكون التخصص فيها في السنة الثالثة أو السنة الرابعة حسب الجامعة
    كلية هندسة الحاسوب مدة الدراسة في كلية هندسة الحاسب خمس سنوات، مقسمة على النحو التالي:
    السنة الأولى: هندسة تحضيرية.
    السنة الثانية والثالثة: لدراسة الكهرباء والالكترونيات.
    السنة الرابعة والخامسة: يدرسون الحاسبات.
    الفرق بين حاسبات ومعلومات وهندسة الحاسبات
    انطلاقا من الواقع العملي وسوق الإلكترونيات وتكنولوجيا المعلومات نجد أن كلية الحاسبات والمعلومات تتميز عن كلية الهندسة بشعبة الحاسبات ونظم المعلومات للأسباب التالية:
    تحتوي كلية الحاسبات والمعلومات على أقسام متعددة تخدم السوق التكنولوجي سواء في الداخل أو الخارج، ويمكن إضافة أقسام أخرى إليها وتجديدها حسب متطلبات التقدم التكنولوجي وظهور سوق إلكتروني يتطلب ذلك، مثل كذكاء اصطناعي على عكس كلية الهندسة التي صممت لهذا الجانب فقط ولا يمكن تغييرها أو إضافتها إليه.
    تهتم هذه الكلية ببعض الفروع التي لن تجدها في الكليات الأخرى، مثل إدارة أزمات المعلومات، ودراسة الذكاء، وكذلك أنظمة الدعم، واتخاذ القرار والفروع الأخرى.
    كما نجد أن لكلية الحاسبات والمعلومات نصيب كبير جدًا تشغله بين الوزارات، مثل وزارة الاتصالات وتكنولوجيا المعلومات، حيث تعد تقنية المعلومات جزءًا من أقسامها.
    على الرغم من أهميتها، فقد نجد حقها ضائعًا بين أفضل الكليات، ولا يزال عدد خريجي هذه الكلية قليلًا جدًا بالنسبة لاحتياجات سوق التكنولوجيا، سواء في الداخل أو في الخارج.
  17. إجابة عبدالباسط ابراهيم سؤال في الخاصية data-bs-spy لا تعمل كانت الإجابة المقبولة   
    سبب المشكلتين معاً هو الخاصية overflow-x : hidden المطبقة على body حيث أن هذه الخاصية تجعل الموقع غير قابل لل scroll  من ناحية الجافاسكريبت إذاً الكود التالي لا يتم تنفيذه
    $(window).scroll(function () { if ($(this).scrollTop() >= 400) { $("#navbar").addClass("noTransparent"); } else { $("#navbar").removeClass("noTransparent"); } }); لذلك عند حذف الخاصية overflow-x : hidden من ال body 
    html, body { overflow-x: hidden; /* احذف هذا السطر*/ padding: 0; margin: 0; width: 100%; height: 100%; } وستظهر لديك مشكلة ظهور ال scrollbar ولإخفاءه قم بتطبيق الخاصية overflow-x : hidden على ال html كمايلي
    html{ overflow-x: hidden; } بعد هذه التعديلات سيتم حل المشكلتين معاً
  18. إجابة عبدالباسط ابراهيم سؤال في طريقة انشاء زر بقائمة منسدلة تحتوي على عدة ازرار أخرى كانت الإجابة المقبولة   
    يمكن إنشاء زر يحتوي على قائمة من خلال استخدام مكونات Bootstrap. يمكن استخدام الفئة "dropdown-toggle" لتنشيط القائمة عند النقر على الزر، ويمكن استخدام الفئة "dropdown-menu" لتحديد عناصر القائمة.
    فيما يلي مثال على كيفية إنشاء زر يحتوي على قائمة باستخدام Bootstrap:
    <div class="dropdown">   <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">     <!-- يمكنك استخدام الثلاث نقاط الأفقية هنا -->     <span class="sr-only">Toggle Dropdown</span>   </button>   <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">     <a class="dropdown-item" href="#">زر 1</a>     <a class="dropdown-item" href="#">زر 2</a>   </div> </div> يمكن استخدام الأيقونات بدلاً من النقاط الأفقية باستخدام العنصر `<i>`، ويمكن تخصيص الأيقونات باستخدام فئات Bootstrap مثل "fas" و "fa-caret-down" و "fa-ellipsis-h"؛ على سبيل المثال:
    <div class="dropdown">   <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">     <i class="fas fa-ellipsis-h"></i>     <span class="sr-only">Toggle Dropdown</span>   </button>   <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">     <a class="dropdown-item" href="#">زر 1</a>     <a class="dropdown-item" href="#">زر 2</a>   </div> </div> يرجى ملاحظة أنه يجب تضمين مكتبة Bootstrap و FontAwesome في مشروعك لاستخدام هذه الأيقونات والفئات.
  19. إجابة عبدالباسط ابراهيم سؤال في أريد أن يعمل دوران لزر القائمة العلوية كانت الإجابة المقبولة   
    يمكن تحقيق هذه الوظيفة باستخدام JavaScript و CSS. يجب عليك إنشاء دالة تقوم بتدوير زر القائمة العلوية بمقدار 90 درجة عند الضغط عليه، ومن ثم استخدام CSS لتنفيذ الدوران.
    فيما يلي  كيفية تحقيق هذه الوظيفة
    ملف index.css
    .rotate { transform: rotate(90deg); /* دوران الزر بزاوية 90 درجة */ } #toggler { transition: transform 0.3s ease-in-out; /* تحديد وقت الانتقال و التأثير المرئي */ } ملف index.js
    $("#toggler").click(function (event) { this.classList.toggle("rotate"); // إضافة هذا السطر فقط }); عند النقر مرة أخرى على الزر، يتم إزالة الصفة "rotate" وبالتالي يتم إعادة الزر إلى حالته الأولى.
  20. إجابة عبدالباسط ابراهيم سؤال في كيفية نشر تطبيق Laravel بدون توقف باستخدام أدوات واستراتيجيات مناسبة؟ كانت الإجابة المقبولة   
    تنشيط تطبيق Laravel على سيرفر دون انقطاع يتطلب القيام ببعض الخطوات الضرورية لتجنب أي تأخير أو انقطاع في عملية النشر. فيما يلي شرح مفصل لأهم الأدوات والاستراتيجيات التي يمكن استخدامها لنشر تطبيق Laravel بدون توقف:
    استخدام خدمات الاستضافة المخصصة لـ Laravel: توفر خدمات الاستضافة المخصصة لـ Laravel مثل Laravel Forge و Laravel Vapor إعدادات مسبقة للنشر والتحكم في الإصدارات والتحديثات دون توقف الخدمة. تتضمن هذه الخدمات أيضًا أدوات مثل Git و SSH للتحكم في الإصدارات والتحديثات.
    استخدام أدوات النشر المستمر: يمكن استخدام أدوات النشر المستمر مثل Travis CI و CircleCI لإعداد سيرفرات الإنتاج وتحديثات البرمجيات دون توقف. يمكن استخدام هذه الأدوات لتحديد مراحل النشر والاختبار والتحديثات الدورية.
    استخدام Docker: يمكن استخدام Docker لإنشاء حاويات Docker ونشرها على خوادم الإنتاج بدون توقف. يتم إنشاء حاويات Docker المحمولة بسهولة ويمكن نقلها بين الخوادم بسهولة، ويمكن استخدام أدوات مثل Docker Compose لتسهيل العملية.
    استخدام إدارة التحميل: يمكن استخدام إدارة التحميل مثل Envoyer لتبسيط عملية النشر والتحديثات الدورية دون توقف. يوفر Envoyer واجهة برمجة التطبيقات (API) لتوصيل البرامج وإعدادات مسبقة للنشر.
    استخدام استراتيجيات النشر: يمكن استخدام استراتيجيات النشر مثل Blue-green deployment و Canary release لنشر الإصدارات الجديدة بشكل تدريجي ومراقبة الأداء والاستجابة قبل إطلاقها بشكل كامل. يمكن استخدام هذه الاستراتيجيات لتخفيض أي تأثير على الخدمة الحالية وزيادة الثقة في الإصدار الجديد.
    استخدام خوادم التحميل الموزعة: يمكن استخدام خوادم التحميل الموزعة مثل NGINX و Apache لتقليل وقت الانتظار وتحسين أداء النشر عن طريق توزيع الحمولة على عدة خوادم.
    بالنسبة للنشر عبر GitHub، يمكن استخدام خدمات CI/CD مثل Travis CI و CircleCI لإنشاء سيرفرات الإنتاج وتحديثات البرمجيات بشكل تلقائي. يمكن استخدام Git hooks لتنفيذ إجراءات محددة عند الإصدارات الجديدة، مثل تحديث قاعدة البيانات وتحميل الملفات الثابتة. يمكن أيضًا استخدام Docker وإدارة التحميل لتسهيل عملية النشر. يتم ذلك عن طريق إنشاء ملفات Dockerfile و docker-compose.yml لتعريف الحاويات والخدمات المطلوبة لتشغيل التطبيق. يمكن تحديث هذه الملفات وتنفيذ عمليات النشر عن طريق خدمات CI/CD المتكاملة مع GitHub.
  21. إجابة عبدالباسط ابراهيم سؤال في مشكلة في الانتقال بين الصفحات REACT كانت الإجابة المقبولة   
    إذا كنت تستخدم React 16.8+، يمكن التعامل بسهولة مع التمرير إلى الأعلى في كل مرة يتم فيها التنقل باستخدام مكون يقوم بالتمرير إلى الأعلى على نافذة المتصفح.
    فيما يلي مكون scrollToTop.js:
    import { useEffect } from "react"; import { useLocation } from "react-router-dom"; export default function ScrollToTop() {   const { pathname } = useLocation();   useEffect(() => {     window.scrollTo(0, 0);   }, [pathname]);   return null; } ثم يمكن عرض المكون في أعلى تطبيقك، ولكن أسفل المكون Router.
    فيما يلي كيفية عرض المكون في ملف app.js:
    import ScrollToTop from "./scrollToTop"; function App() {   return (     <Router>       <ScrollToTop />       <App />     </Router>   ); } أو يمكن عرضه في ملف index.js:
    import ScrollToTop from "./scrollToTop"; ReactDOM.render(     <BrowserRouter>         <ScrollToTop />         <App />     </BrowserRouter>     document.getElementById("root") ); بهذه الطريقة، سيتم تمرير الصفحة إلى الأعلى في كل مرة يتم فيها التنقل إلى صفحة جديدة.
  22. إجابة عبدالباسط ابراهيم سؤال في ما هي لغة البرمجه التي يجب عليا تعلمها بعد javascript كانت الإجابة المقبولة   
    أعتقد أنك الأن تحتاج للبحث عن عمل ومن خلال المشاريع التي تأتيك فبالتأكيد ستكتسب بعض الخبرات في مجالك بدلاً من تعلم تقنيات تؤدي نفس الوظيفة 
    بالإضافة إلى ذلك هناك بعض التقنيات يفضل تعلمها
    GraphQL هي تقنية جديدة لتطوير واجهات برمجة تطبيقات (APIs)، والتي تسمح للمطورين بتحديد البيانات التي يحتاجون إليها بشكل دقيق وبشكل مخصص. تتميز GraphQL بالسهولة في استعلام البيانات وتحسين أداء التطبيق. AWS أو Azure أو Google Cloud Platform: الحوسبة السحابية ومنصات الخدمات السحابية مثل AWS و Azure و Google Cloud Platform هي أدوات هامة لتطوير تطبيقات الويب وإدارتها في بيئة السحابة. يمكن للمطورين تعلم كيفية استخدام هذه المنصات لتطوير ونشر التطبيقات بشكل أفضل وأكثر فعالية. Docker و Kubernetes هما أدوات شائعة في تطوير تطبيقات الويب، والتي تمكن المطورين من إنشاء بيئات تطوير موحدة ونشر التطبيقات بشكل موحد ومتسق. تعلم كيفية استخدام Docker و Kubernetes يمكن أن يساعد المطورين في تطوير ونشر التطبيقات بشكل أسرع وأكثر فعالية. Microservices: هي تقنية تسمح للمطورين بتقسيم التطبيق إلى مجموعة من الخدمات الصغيرة المستقلة، والتي يمكن تطويرها ونشرها بشكل منفصل. يمكن للمطورين تعلم كيفية تطوير تطبيقات Microservices لإنشاء تطبيقات قابلة للتوسع والصيانة والتحديث بشكل أفضل، ولكن يتطلب الأمر مهارات وخبرة في تطوير تطبيقات الويب.
  23. إجابة عبدالباسط ابراهيم سؤال في الاشعارات لاتعمل ios مع اني اقوم بجلب التوكن بطريقة صحيحة react native كانت الإجابة المقبولة   
    هناك العديد من العوامل التي يمكن أن تؤدي إلى توقف عمل الإشعارات في تطبيق الجوال على iOS بعد مرور بعض الوقت. ومن بين الأسباب الشائعة:
    إعدادات الإشعارات في iOS: يمكن أن تتأثر إعدادات الإشعارات في iOS بتحديثات النظام أو الإعدادات الشخصية للمستخدم. تحقق من إعدادات الإشعارات في iOS وتأكد من أنها مفعلة ومضبوطة بشكل صحيح. مشكلة في مكتبة Firebase Messaging: قد يكون هناك مشكلة في مكتبة Firebase Messaging التي تستخدمها في تطبيقك. يمكنك محاولة تحديث مكتبة Firebase Messaging إلى أحدث إصدار أو التحقق من الأخطاء والتحذيرات المطبوعة في وحدة التحكم الخاصة بـ Firebase. القيود المفروضة على التطبيق: يمكن أن يفرض نظام iOS قيودًا على تطبيقات الجوال التي تستخدم الإشعارات. قد يتم حظر التطبيق أو تقييده بسبب انتهاكات معينة. تحقق من سياسات App Store وتأكد من أن التطبيق الخاص بك يلتزم بالقواعد والمتطلبات. يمكن أن يكون APNs certificate أحد الأسباب المحتملة أيضًا. 
    يمكن أن يقوم iOS بإيقاف تشغيل تطبيقات "خلفية" لتوفير البطارية.
     
  24. إجابة عبدالباسط ابراهيم سؤال في استفسار حول تخزين البيانات في firebase كانت الإجابة المقبولة   
    تخزين البيانات بشكل مباشر كنص عربي وإنجليزي يمكن أن يسهّل العملية ويجعلها تبدو أكثر بساطة، ولكن يمكن أن يؤدي إلى مشاكل في حالة الترجمة أو البحث عن النصوص، لأن الكلمات العربية والإنجليزية تتباينفي نحوها وتهجئتها وقد تكون قد تم تخزينها بطريقة غير متوافقة مع بعض قواعد البيانات.
    من ناحية أخرى، تخزين البيانات كمعرفات فريدة يمكن أن يسهل البحث عن البيانات وتحديثها، ولكن يمكن أن يؤدي إلى زيادة حجم القواعد والتعقيد في التعامل معها.
    بالنسبة لتفضيل أي طريقة، فذلك يعتمد على الحاجة والغرض من التطبيق. إذا كان التطبيق يتضمن ترجمة نصوص أو البحث عن النصوص بشكل متكرر، فقد يكون من المفضل تخزين البيانات بشكل مباشر كنص عربي وإنجليزي. وإذا كان التطبيق يحتاج إلى تحديثات متعددة للبيانات أو تحديثات متعددة لقواعد البيانات، فقد يكون من المفضل تخزين البيانات كمعرفات فريدة.
    بشكل عام، يفضل استخدام معرفات فريدة لتخزين البيانات في قواعد البيانات بسبب المزايا العديدة التي توفرها، مثل البحث السريع والتحديثات السريعة. ومع ذلك، في بعض الحالات، قد يكون من المناسب استخدام تخزين المعلومات كنص عربي وإنجليزي، مثل في حالات البيانات الثابتة التي لا يتم تحديثها كثيرًا. 
    بشكل عام، يعتمد الاختيار بين تخزين البيانات بشكل مباشر كنص عربي وإنجليزي أو تخزينها كمعرفات فريدة على احتياجات التطبيق ومتطلباته.
  25. إجابة عبدالباسط ابراهيم سؤال في كيف استخدم التاريخ الهجري بلغة الجافا سكريبت .. وهل توجد مكتبة خاصة ب react native تمكنني من التقاط التواريخ الهجرية ؟ كانت الإجابة المقبولة   
    نعم، توجد مكتبات في React Native تسمح باستخدام التاريخ الهجري. من أشهرها:
    - react-native-hijri-date-picker: تتيح اختيار تواريخ هجرية بواسطة DatePicker.
    - hijri-date: تسمح بالتعامل مع التواريخ الهجرية بسهولة، مثل إضافة أيام/شهور، تحويل إلى ميلادي، إلخ.
    يمكن استخدام المكتبة hijri-date على النحو التالي:
    import HijriDate from 'hijri-date'; // أخذ تاريخ هجري حالي  const hijri = HijriDate.now(); // طباعة التاريخ في شكل كامل (مثلاً: ١٤٤١/٣/٢٥ هـ) console.log(hijri.format('iYYYY/iMM/iDD')); // إضافة شهر واحد const nextMonth = hijri.addMonths(1);  // تحويل إلى ميلادي  const miladi = hijri.toGregorian();  هذه المكتبة تسهل التعامل مع التواريخ الهجرية في تطبيقات React Native. رجاء استخدم وثائقها لمعرفة كافة الإمكانيات التي تقدمها.
    وهناك مكتبات أخرى تعمل مع التواريخ الهجرية في React Native:
    react-native-hijri: توفر عدة أدوات للتعامل مع التاريخ الهجري مثل تحويل التواريخ بين الميلادي والهجري، إضافة أشهر/أيام، الحصول على اليوم/الشهر الحالي، إلخ. hijri-converter: بسيطة وتسمح فقط بتحويل التواريخ بين الميلادي والهجري. react-native-calendars: مكتبة توفر تقويماً شاملاً في React Native، وتدعم عرض التقويم الميلادي والهجري. react-hijri: أخرى بسيطة توفر تحويل التواريخ وعرض تقويم هجري. يمكن استخدام هذه المكتبات بنفس طريقة hijri-date تقريباً. من الأفضل اختبار عدة مكتبات واختيار الأنسب لاحتياجاتك.
×
×
  • أضف...