اذهب إلى المحتوى
تعلم مهارات المستقبل: احصل على دورتين بسعر دورة واحدة ×

Mustafa Suleiman

الأعضاء
 عرض الملف الشخصي  تصفح المحتوى

  • المساهمات

    18818

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

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

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

    445

 نوع المحتوى 

ريادة الأعمال

البرمجة

التصميم

DevOps

التسويق والمبيعات

العمل الحر

البرامج والتطبيقات

آخر التحديثات

قصص نجاح

أسئلة وأجوبة

كتب

دورات

كل منشورات العضو Mustafa Suleiman

  1. Mustafa Suleiman
    بإمكانك استخدام علامات الـ "pre" في HTML و "pre" في CSS للحفاظ على تنسيق النص عند الطباعة، وبالتالي يتم عرض النص بدون ترجمته في المتصفح. <!DOCTYPE html> <html> <head> <title>مثال</title> <style> pre { white-space: pre-wrap; font-family: inherit; font-size: inherit; margin: 0; } </style> </head> <body> <pre> echo "النص النص النص"; ? </pre> </body> </html>
  2. Mustafa Suleiman
    حاول استخدام المجموعات (Groups) والمجموعات الديناميكية (Dynamic Groups) في Unity. 1- المجموعات الثابتة (Static Groups) تعد المجموعات الثابتة مفيدة عندما تريد تجميع العناصر التي تكون دائمًا في نفس المكان في اللعبة، والتي لا يتم تحريكها أو تغيير موقعها. لإنشاء مجموعة ثابتة في Unity. وتستطيع اختيار الكائنات التي تريد تجميعها في hierarchy ومن ثم النقر بزر الماوس الأيمن واختيار "Create Empty Group"، ثم تسمية المجموعة وسحب الكائنات المراد تجميعها داخلها. 2- المجموعات الديناميكية (Dynamic Groups) تستخدم المجموعات الديناميكية في Unity عندما تريد تجميع العناصر التي قد يتم تحريكها أو تغيير موقعها في اللعبة. وبإمكانك إنشاء مجموعة ديناميكية في Unity بالتحديد نفس طريقة إنشاء مجموعة ثابتة، ولكن يجب تمكين الخاصية "Dynamic" في إعدادات المجموعة الديناميكية. بمجرد إضافة الكائنات إلى المجموعة الديناميكية، تستطيع تحريك المجموعة بأكملها وستتحرك الكائنات الموجودة داخلها معًا.
  3. Mustafa Suleiman
    بالطبع تستطيعي ذلك، أرجو منك الضغط على اسم الحساب الخاص بك بالأعلى ثم إختيار إعدادات الحساب، بعد ذلك سيظهر لك البريد الإلكتروني وبجانبه تغيير وسيظهر لك صفحة أخرى لإضافة بريد إلكتروني آخر بالإضافة للموجود وستتمكني بتسجيل الدخول من خلاله.
  4. Mustafa Suleiman
    لنبدأ من البداية، عليك بتثبيت مكتبة fontawesome في مشروع React بالشكل التالي: npm i --save @fortawesome/fontawesome-svg-core ثم عليك بتثبيت شكل الأيقونات الذي تريد استخدامه سواء solid أو regular بالشكل التالي: npm i --save @fortawesome/free-solid-svg-icons npm i --save @fortawesome/free-regular-svg-icons والآن لنقوم بتثبيت مكون Font Awesome React component بأخر إصدار: npm i --save @fortawesome/react-fontawesome@latest والآن عليك تثبيت إضافة Babel Macros من أجل استيراد الأيقونات بشكل Dynamic: npm install babel-plugin-macros ثم أنشأ ملف باسم babel.config.js في حالة لم يكن موجود وأضف إليه التالي: module.exports = function (api) { return { plugins: ['macros'], } } ثم قم بإنشاء ملف باسم babel-plugin-macros.config.js وأضف إليه التالي: module.exports = { 'fontawesome-svg-core': { 'license': 'free' } } والآن تستطيع إضافة الأيقونات في مشروع React بالشكل التالي: import { FontAwesomeIcon } from '@fortawesome/react-fontawesome' import { icon } from '@fortawesome/fontawesome-svg-core/import.macro' <FontAwesomeIcon icon={icon({name: 'user-secret'})} /> // Defaults to the Classic family, Solid style <FontAwesomeIcon icon={icon({name: 'coffee', style: 'regular'})} /> // Defaults to Classic family <FontAwesomeIcon icon={icon({name: 'coffee', family: 'sharp', style: 'solid'})} /> // Setting both family and style <FontAwesomeIcon icon={icon({name: 'twitter', style: 'brands'})} /> // A brand icon ولاحظ استخدام brands في style ، ففي مكتبة FontAwesome ، "brands" هي مصطلح يستخدم للإشارة إلى العلامات التجارية (brands) التي تمثل شركات ومنظمات وشبكات اجتماعية معينة، مثل Twitter وFacebook وغيرها. ويتم استخدام هذا المصطلح في الرموز الخاصة بالعلامات التجارية في FontAwesome لتمييزها عن الرموز العادية (solid) أو الناعمة (regular) أو الخطية (light). وهذا يشير إلى أن الأيقونة المطلوبة هي من فئة العلامات التجارية (brands) ، بدلاً من الرموز العادية أو الناعمة، وبالتالي ، سيتم عرض الأيقونة المناسبة لـ "تويتر" كأيقونة من فئة العلامات التجارية (brands). وأرجو منك قراءة المستندات الخاصة بمكتبة FontAwesome فبها شرح عن كيفية استخدامها في React: https://fontawesome.com/v6/docs/web/use-with/react https://fontawesome.com/v6/docs/web/use-with/react/add-icons
  5. Mustafa Suleiman
    نعم يجب إدخال نفس البريد الإلكتروني الذي تم من خلال الإشتراك بالدورات، وأرجو منك مشاهدة الفيديوهات التالية:
  6. Mustafa Suleiman
    الحل الأسهل استخدام إضافة إذا كنت تستخدم وورد بريس أو تنزيل مكتبة إذا كنت تطور موقع خاص بك. أما إذا كنت تريد الكود، فإليك كود HTML: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Share on WhatsApp</title> <style> .whatsapp-share-button { display: inline-block; text-align: center; background-color: #25d366; color: #fff; border-radius: 4px; padding: 8px; font-weight: bold; text-decoration: none; box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.2); font-size: 16px; } .whatsapp-share-button:hover { background-color: #128c7e; } </style> </head> <body> <a class="whatsapp-share-button" href="https://api.whatsapp.com/send?text=Enter%20your%20message%20here&phone=whatsapp_number_with_country_code" target="_blank">Share on WhatsApp</a> </body> </html> وإليك كود جافاسكريبت لتحديث الرابط المراد مشاركته مع الرسالة: <script> function shareOnWhatsApp() { const text = "Enter your message here"; const url = "https://www.example.com/image.jpg"; const message = encodeURIComponent(text) + " - " + encodeURIComponent(url); const whatsapp_url = "https://api.whatsapp.com/send?text=" + message; window.open(whatsapp_url); } document.querySelector('.whatsapp-share-button').addEventListener('click', shareOnWhatsApp ); </script> ثم يتم استدعاء الدالة "shareOnWhatsApp()" عند النقر على زر مشاركة الواتساب: ويجب استبدال "Enter your message here" بالنص الذي تريد مشاركته و"https://www.example.com/image.jpg" بالرابط الخاص بالصورة أو المنشور أو الفيديو الذي تريد مشاركته.
  7. Mustafa Suleiman
    لا تقلق عزيزي بخصوص هذا الأمر، حيث يوجد مشكلة بسيطة يتم حلها الآن عليك فقط بإرسال رسالة لمركز المساعدة الخاص بأكاديمية حسوب وسيتم حل المشكلة ولكن أرجو منك الإنتظار لبعض الوقت قد تتراوح ما بين 24 إلى 48 ساعة لحين حل المشكلة. وعند التوجه لمركز المساعدة عليك بإدخال البريد الذي قمت بالإشترك من خلاله بالدورة، ثم سيصلك كود تأكيد على البريد قم بإدخاله وستظهر لك نافذة المحادثة. وأرجو مراجعة قائمة دوراتي في حسابك وتفقد الدورة. كيف أصل للدورات التي اشتركت بها
  8. Mustafa Suleiman
    عند استخدام الدالة setInterval ، يتم استدعاؤها بشكل متكرر كل 1000 مللي ثانية (1 ثانية) وتقوم بتحديث حالة الـ timer. ومع ذلك، يمكن أن يحدث تأخير في عملية تحديث الحالة، وهذا يؤدي إلى تجاوز قيمة timer المرتقبة بشكل خاطئ. لذلك باستطاعتك استخدام دالة الـ useEffect لتحديث قيمة الـ timer بشكل دقيق بعد انتهاء الـ interval. const [timer, setTimer] = useState(0); const format = (time) => { let hours = Math.floor((time / 60 / 60) % 24); let minutes = Math.floor((time / 60) % 60); let secondes = Math.floor(time % 60); hours = hours < 10 ? "0" + hours : hours; minutes = minutes < 10 ? "0" + minutes : minutes; secondes = secondes < 10 ? "0" + secondes : secondes; return hours + ":" + minutes + ":" + secondes; }; useEffect(() => { const interval = setInterval(() => { setTimer((timer) => timer + 1); }, 1000); return () => { clearInterval(interval); }; }, []); useEffect(() => { const timerValue = format(timer); // Do something with the timerValue, like displaying it }, [timer]); من خلال إضافة دالة useEffect جديدة والتي تتم استدعائها عند تحديث الـ timer يتم إنشاء متغير يحتوي على القيمة المنسقة للـ timer باستخدام دالة format، وعليك باستخدام هذا المتغير لعرض الـ timer بالشكل المطلوب. ولاحظ أن دالة clearInterval مفادها هو إلغاء الـ interval بشكل صحيح عندما يتم إيقاف تشغيل المؤشر، وإعادة ترتيب الكود عن طريق نقل دالة setInterval إلى داخل دالة useEffect. وإحدى الطرق الأفضل هي استخدام دالة useRef لحفظ قيمة الـ interval والسماح لنا بإيقافها بشكل دقيق وفي الوقت المناسب، بالشكل التالي: import { useState, useEffect, useRef } from "react"; function Timer() { const [timer, setTimer] = useState(0); const intervalRef = useRef(); const format = (time) => { let hours = Math.floor((time / 60 / 60) % 24); let minutes = Math.floor((time / 60) % 60); let secondes = Math.floor(time % 60); hours = hours < 10 ? "0" + hours : hours; minutes = minutes < 10 ? "0" + minutes : minutes; secondes = secondes < 10 ? "0" + secondes : secondes; return hours + ":" + minutes + ":" + secondes; }; useEffect(() => { intervalRef.current = setInterval(() => { setTimer((timer) => timer + 1); }, 1000); return () => { clearInterval(intervalRef.current); }; }, []); const stopTimer = () => { clearInterval(intervalRef.current); }; const resetTimer = () => { setTimer(0); }; return ( <div> <div>{format(timer)}</div> <button onClick={stopTimer}>Stop Timer</button> <button onClick={resetTimer}>Reset Timer</button> </div> ); } تستخدم دالة useRef لإنشاء مرجع ref جديد لـ interval وحفظ قيمته في متغير، وإرجاع الدالة useEffect التي تستخدم intervalRef.current بدلاً من interval وإعادة تعيين قيمة intervalRef.current عندما يتم تحديث الـ timer. كما تم إضافة دالة stopTimer لإلغاء الـ interval و إنشاء دالة resetTimer لإعادة الـ timer إلى القيمة الافتراضية. وإضافة زر "Stop Timer" لإيقاف تشغيل المؤشر وزر "Reset Timer" لإعادة تعيين الـ timer إلى القيمة الافتراضية، وتستطيع استخدام الـ format() في عرض الـ timer بالشكل المطلوب.
  9. Mustafa Suleiman
    في مشروع لارافيل، ملف composer.json يحتوي على قائمة بجميع الحزم (packages) التي يحتاجها المشروع، بما في ذلك إصداراتها المحددة وتبعياتها. وملف composer.lock هو ملف يُنشأ تلقائياً عند تنفيذ أمر تثبيت الحزم باستخدام Composer ويحتوي على نفس القائمة من الحزم وإصداراتها المحددة، بالإضافة إلى معلومات عن الحزم المثبتة بالفعل في النظام. الفرق الرئيسي بينهما هو أن composer.json يُحدث يدوياً بشكل مستمر بواسطتك لإضافة وحذف الحزم وتحديث إصداراتها. بينما يتم توليد composer.lock تلقائياً بواسطة Composer. ويستخدم ملف composer.json لتحديد متطلبات المشروع ولإنشاء ملف composer.lock، بالإضافة إلى ذلك، يستخدم ملف composer.lock للتأكد من أن جميع الحزم التي تم تثبيتها في المشروع متوافقة مع بعضها البعض ولتجنب أي تعارضات بينها. أي أن composer.json هو الملف الرئيسي الذي يستخدمه المطورون لتحديد متطلبات حزم المشروع، بينما يعتبر composer.lock ملف إضافي يستخدم لضمان توافق الحزم وعدم وجود أي تعارضات بينها. ولعلك تتسائلي لماذا نحن بحاجة إلى composer.lock؟ في الحقيقة نحن بحاجة إلى ملف composer.lock لعدة أسباب بالإضافة إلى ما تم ذكره سابقًا: 1- تجنب تغييرات غير مرغوبة في الحزم حيثث يساعد ملف composer.lock على تجنب تغييرات غير مرغوبة في الحزم المثبتة في المشروع. فإذا قمت بتثبيت الحزم باستخدام composer.json فقط، فقد يحدث تغيير غير متوقع في إصدار الحزمة أو إضافة حزم جديدة تعتمد على إصدارات مختلفة من الحزم الحالية. وبما أن الملف composer.lock يحدد إصدارات الحزم بدقة، فلا يمكن تغييرها دون إعادة تشغيل عملية تثبيت الحزم. 2- التأكد من استقرار المشروع يتيح ملف composer.lock لفريق التطوير والمطورين الآخرين التأكد من أن جميع الحزم المستخدمة في المشروع مستقرة، وأنها تم اختبارها بشكل جيد، مما يعني أن الجميع لديه نفس الإصدار من الحزم. وذلك يفيد في تجنب المشاكل الغير مرغوبة طالما أن الجميع يعمل في نفس بيئة العمل، فستحدث نفس المشكلة لدى الجميع وليس لدى شخص واحد فقط يستخدم حزمة مختلفة. وربما لديك تساؤل آخر، عند استخدام الأمر composer install يتم تثبيت الحزم من ملف composer.lock أم composer.json؟ وما يحدث هو أنه سيتم تثبيت الحزم من ملف composer.lock إذا كان موجوداً في المجلد الحالي، وإلا سيتم استخدام ملف composer.json. وإذا كنت قد أنشأتي ملف composer.json ولم تقومي بتنفيذ الأمر composer install من قبل، فلن يتم إنشاء ملف composer.lock بعد تشغيل composer install. وبدلاً من ذلك، سيتم إنشاء ملف composer.lock وتحديثه تلقائيًا عندما تقوم بتشغيل composer update أو عند تثبيت حزمة جديدة باستخدام composer require.
  10. Mustafa Suleiman
    إذا كنت تقصد دورة تطوير واجهات المستخدم فأنت ستتعلم من خلالها التالي: مفهوم الواجهة الأماميّة للموقع front-end وكيفية عملها. أساسيات لغات تطوير واجهات المستخدم: HTML, CSS, JavaScript. استخدام أحدث أدوات التطوير: Bootstrap, jQuery, Sass, Gulp. التعامل مع خدمة استضافة المشاريع GitHub. إعداد هيكل الموقع ووضع خطة العمل. تطوير واجهة استخدام حقيقة لمتجر الكتروني كامل من الصفر. تطوير موقع لشركة مع مدونة خاصة خطوة بخطوة. بناء 5 صفحات هبوط مختلفة بناء واجهة لموقع يشبه YouTube بناء لوحة تحكم لتطبيق ويب وهو الجانب الخاص بالواجهة الأمامية، والآن إذا أردت تصبح مطور واجهة خلفية أيضًا وبذلك تصبح مطور Full stack أي قادر على بناء مشروع كامل بمفردك، فعليك بتعلم إما Node.js أو PHP وإطار لارافيل. وبإمكانك تعلم Node.js من خلال دورة تطوير التطبيقات باستخدام لغة JavaScript: و PHP ولارافيل وورد بريس أيضًا من خلال دورة تطوير تطبيقات الويب باستخدام لغة PHP. وإذا أردت نصيحتي عليك بتعلم دورة تطوير تطبيقات الويب باستخدام لغة PHP، إذا كنت تريد أن تصبح مطور ويب. أما إذا أردت تصبح مطور ويب وأيضًا معرفة كيف يتم تطوير تطبيقات الهاتف وسطح المكتب فعليك بدورة تطوير التطبيقات باستخدام لغة JavaScript، حيث سيتم فيها شرح React native و Electron.js. وأنصحك بقراءة النقاشات التالية:
  11. Mustafa Suleiman
  12. Mustafa Suleiman
    خطوات تصدير مشروع Go كملف تنفيذي exe 1- قم بإنشاء ملف باسم main.go يحتوي على الشفرة التالية: package main import "fmt" func main() { fmt.Println("Hello, world!") } 2- قم بفتح موجه الأوامر (Command Prompt) أو الطرفية (Terminal) الخاصة بجهاز الكمبيوتر الخاص بك. 3- استخدم الأمر "cd" للانتقال إلى مجلد يحتوي على ملف main.go الذي قمت بإنشائه في الخطوة السابقة. 4- استخدم الأمر "go build" لبناء ملف التنفيذي (exe)، لإعطاء اسم مخصص لملف التنفيذي: go build -o <اسم الملف> واستبدل <اسم الملف> باسم الملف الذي تريده. 5- بعد الانتهاء من بناء ملف التنفيذي، سيتم إنشاء ملف باسم "main.exe" في نفس المجلد الذي يحتوي على ملف main.go. 6- تستطيع تشغيل ملف التنفيذي عن طريق النقر المزدوج عليه في نظام Windows. وأرجو ملاحظة أن الخطوات للتصدير قد تختلف قليلاً اعتمادًا على نظام التشغيل الذي تستخدمه والأدوات التي تستخدمها لتطوير التطبيق.
  13. Mustafa Suleiman
    أرجو المتابعة هنا في سؤالك عزيزي.
  14. Mustafa Suleiman
    شكل صفحة HTML في أبسط صورة لها هي كالتالي: <!DOCTYPE html> <html> <head> <title>عنوان الصفحة</title> <style> /* هنا يتم كتابة الـ CSS الخاص بالصفحة */ </style> </head> <body> <!-- هنا يتم كتابة محتوى الصفحة --> </body> </html> لذلك تأكد من الكود لديك بالشكل السابق، ويتم استخدام عنصر style لكتابة تنسيقات CSS داخل كود HTMLكالتالي: <style> h1 { color: red; font-size: 24px; } p { color: blue; font-size: 18px; } </style> ويجب أن يكون عنصر style داخل عنصر head كما تم توضيحه في الكود الأول بالأعلى. فمن خلال التنسيق السابق، تم كتابة الـ CSS الخاص بعنوان الصفحة h1 والفقرات p، وتغيير لون النص وحجم الخط. بعد كتابة كود الـ CSS السابق، يمكنك كتابة محتوى الصفحة داخل علامات أو عنصر الـ body، وإليك مثال: <body> <h1>عنوان الصفحة</h1> <p>هذا هو محتوى الصفحة</p> </body> عليك الآن حفظ الملف باسم ملف HTML، وذلك بإضافة امتداد .html إلى نهاية اسم الملف، مثال: index.html ليصبح شكل الكود النهائي لملف index.html كالتالي: <!DOCTYPE html> <html> <head> <title>عنوان الصفحة</title> <style> /* هنا يتم كتابة الـ CSS الخاص بالصفحة */ h1 { color: red; font-size: 24px; } p { color: blue; font-size: 18px; } </style> </head> <body> <!-- هنا يتم كتابة محتوى الصفحة --> <h1>عنوان الصفحة</h1> <p>هذا هو محتوى الصفحة</p> </body> </html> وأنصحك بقراءة المقالات التالية:
  15. Mustafa Suleiman
    السؤال غير واضح، فما هي اللغة المستخدمة وما هو المشروع؟ وعلي أي حال، تستطيع استخدام بعض البرامج التي تسمى بـ"مجمّعات" Compiler لتحويل مشروعك من صيغة الملفات المصدرية إلى ملف تنفيذي exe. وتختلف عملية التحويل حسب نوع اللغة البرمجية التي تستخدمها والبيئة التي تعمل عليها. فمثلاً، إذا كنت تستخدم لغة الـ C#، فبإمكانك استخدام مجمعات مثل Microsoft Visual Studio أو SharpDevelop لتوليد ملف exe. وإذا كنت تستخدم لغة الـ Java، فتستطيع استخدام برامج مثل Eclipse أو NetBeans. وتحتاج إلى اتباع الخطوات التالية لتوليد ملف exe: تأكد من أن المشروع الخاص بك يعمل بشكل جيد ولا يوجد به أخطاء. ابحث عن المجمع المناسب لنوع لغة البرمجة التي تستخدمها. اتبع تعليمات المجمع لتوليد ملف exe لمشروعك. بعد توليد الملف exe، يمكنك تثبيته على جهاز الكمبيوتر الخاص بك.
  16. Mustafa Suleiman
    قبل الحديث عن كيفية اختراق كود PHP، يجب أن نفهم بعض المفاهيم الأساسية فيما يتعلق بأمن التطبيقات. المفاهيم الأساسية فيما يتعلق بأمن التطبيقات 1-الثغرات الأمنية نقاط ضعف في تصميم أو تنفيذ التطبيق يمكن للمهاجم استغلالها للوصول إلى معلومات أو مصادر يسمح له بتنفيذ عمليات غير مصرح بها. 2- هجوم الحقن هو نوع من الهجمات التي تستخدم للاستغلال الثغرات الأمنية في تطبيقات الويب، حيث يقوم المهاجم بإدخال بيانات ضارة في حقل الإدخال في التطبيق للحصول على تصرفات لا تصرح بها، مثل الوصول إلى قواعد البيانات أو تنفيذ أوامر خبيثة. 3- تهيئة PHP PHP هي لغة برمجة قابلة للتكوين، وهذا يعني أنه يمكن تعديل إعدادات اللغة بحيث تجعل التطبيقات المبنية عليها أكثر أمانًا. 4- إدارة الجلسات تستخدم الجلسات في PHP للحفاظ على حالة المستخدم بين طلبات الصفحة المختلفة، ويجب إدارة هذه الجلسات بعناية لمنع هجمات الاختراق. 5- استخدام المتغيرات المرسلة بواسطة المستخدم يجب التحقق من جميع المتغيرات المرسلة بواسطة المستخدم قبل استخدامها في البرنامج لمنع هجمات الحقن. آخر شيء يريده أي مطور هو أن يتم اختراق تطبيقه، لذا، يجب على أي مطور مراعاة بعض النقاط الأساسية لتأمين تطبيقه المبني على PHP. طرق يمكن استخدامها لاختراق التطبيقات المبنية على PHP 1- الهجوم على قاعدة البيانات إذا كان التطبيق يستخدم قاعدة بيانات MySQL أو أي نظام إدارة قواعد البيانات (DBMS) آخر، فمن الممكن أن يتم استغلال ثغرات في تطبيق PHP للوصول إلى البيانات المخزنة في قاعدة البيانات. مثلاً، الهجوم على قاعدة البيانات للوصول إلى كلمات المرور المخزنة بشكل غير آمن أو إدخال بيانات ضارة في القاعدة. 2- الهجوم على الجلسات إذا كان التطبيق يستخدم جلسات PHP، فمن الممكن للمهاجم استغلال ثغرات في تطبيق PHP لسرقة الجلسات والوصول إلى حسابات المستخدمين أو تنفيذ أوامر بدلاً منهم، ومن الممكن الاستفادة من هجوم الاختراق على الجلسات لتنفيذ أي نوع من الأوامر على التطبيق المخترق. 3- الاستغلال الضعيف لإدارة المتغيرات المرسلة بواسطة المستخدم إذا لم يتم التحقق من المدخلات المرسلة من المستخدمين، يمكن للمهاجم استغلال هذه الثغرة لتنفيذ أوامر ضارة في التطبيق. ومن الأمثلة على ذلك هجوم SQL injection وهو نوع من هجمات الحقن الذي يستخدم لتنفيذ أوامر SQL خبيثة في قاعدة البيانات. 4- استخدام تطبيقات مهاجمة يستطيع المهاجم استخدام تطبيقات مهاجمة مثل Burp Suite أو OWASP ZAP لاختبار التطبيق على الإنترنت وتحديد الثغرات في التطبيق. 5- عدم تحديث الإصدارات إذا لم يتم تحديث إصدارات PHP والإضافات المستخدمة في التطبيق بانتظام، فمن المحتمل أن يتعرض التطبيق لثغرات أمنية معروفة ويمكن استغلالها. 6- استخدام كود PHP ضعيف قد يتم استغلال الأخطاء البرمجية في كود PHP ضعيف لتنفيذ أوامر ضارة أو الوصول إلى بيانات حساسة. لذلك ينبغي تجنب استخدام الكود المصدر المفتوح الذي لم يتم تحديثه لفترة طويلة أو الذي يعاني من ثغرات أمنية معروفة. 7- عدم التحقق من المدخلات المخترق قادر على استغلال ثغرة عدم التحقق من المدخلات في تطبيق PHP لتنفيذ أوامر ضارة. كمثال، إذا كان التطبيق يتلقى بيانات المستخدم عبر متغير GET أو POST، يجب التحقق من المدخلات والتأكد من صحتها قبل استخدامها في التطبيق. 8- عدم إعطاء الأذونات المناسبة يجب منح الأذونات المناسبة لملفات PHP والمجلدات المستخدمة في التطبيق، لتجنب الاستفادة من عدم إعطاء الأذونات المناسبة للملفات لتنفيذ أوامر ضارة. 9- استخدام كلمات مرور ضعيفة ينبغي استخدام كلمات مرور قوية وتغييرها بانتظام. يمكن للمهاجم استخدام كلمات مرور ضعيفة للوصول إلى النظام أو تعطيل التطبيق. 10- عدم حماية الملفات المهمة يجب حماية الملفات المهمة في التطبيق بكلمات مرور أو طرق أمنية أخرى، فيمكن الاستفادة من عدم حماية الملفات المهمة للوصول إلى النظام أو تعطيل التطبيق. 11- عدم استخدام الاتصال المشفر ينبغي استخدام الاتصال المشفر (SSL/TLS) لتأمين الاتصالات بين التطبيق والمستخدمين، فقد يتم الاستفادة من عدم استخدام الاتصال المشفر للحصول على معلومات حساسة. الأدوات والمكتبات التي يمكن استخدامها للحد من اختراق الكود الخاص بتطبيقات PHP من أهمها: 1- PHP Security Checker أداة تساعد على فحص التطبيق للبحث عن الثغرات الأمنية المعروفة. 2- PHP CodeSniffer أداة تستخدم لفحص الكود بحثاً عن الأخطاء البرمجية والأخطاء الأمنية. 3- Suhosin مكتبة أمنية تضيف طبقات إضافية من الأمان إلى PHP، وتقوم بحماية السيرفر من الهجمات المختلفة. 4- PHP Data Encryption مكتبة تستخدم لتشفير البيانات الحساسة التي يتم تبادلها بين التطبيق والمستخدمين. 5- OWASP PHP Security Project مشروع يوفر مجموعة من الموارد والأدوات لتحسين أمان تطبيقات PHP. 6- PHP Password Hashing مكتبة تستخدم لتخزين كلمات المرور بشكل آمن، وتستخدم تقنيات التجزئة والتمرير والملح. 7- PHP Firewall برنامج يستخدم لفرز وتصفية حركة المرور بين التطبيق والمستخدمين، ويمكن استخدامه لمنع الهجمات المختلفة. 8- PHP Secure Communications Library مكتبة تستخدم لتشفير الاتصالات بين التطبيق والمستخدمين باستخدام SSL/TLS.
  17. Mustafa Suleiman
    أرجو منك طرح المنشور على شبكة التواصل التابعة لأكاديمية حسوب وهي io.hsoub. في المجتمعات الخاصة بالبرمجة مثل: https://io.hsoub.com/webdev https://io.hsoub.com/programming حيث أن قسم أسئلة البرمجة هنا خاصة بالأسئلة البرمجية والتقنية فقط. وأيضًا قد يفيدك إنشاء حساب على LinkedIn والتواصل مع الأشخاص في نفس المستوى والمذاكرة سويًا.
  18. Mustafa Suleiman
    الأمر بحاجة إلى توضيح، فعند تعلم البرمجة، ففي البداية يتم شرح المفاهيم من خلال لغة برمجة مثل بايثون أو C+ أي يتم شرح الأساسيات وذلك لتأهيلك لتعلم لغة البرمجة الأولى لك الخاصة بالمسار الذي قمتي بإختياره. بمعنى أنه يجب التركيز على على اللغة البرمجية الأولى لك والخاصة بالمسار الذي تريدي تعلمه، مثلاً لو كنتي في دورة تطوير التطبيقات باستخدام لغة JavaScript فيجب هنا تعلم جافاسكريبت فقط والتركيز عليها حتى إتقانها. أما إذا كنتي في دورة تطوير التطبيقات باستخدام لغة Python فيجب التركيز على لغة بايثون فقط حتى إتقانها، ونفس الأمر بالنسبة لدورة PHP. وبعد بناء عدة مشاريع باللغة الخاصة بالمسار الذي إخترتيه تستطيعي تعلم لغة أخرى، أي أنه في حالة تعلم الأساسيات من خلال لغة بايثون ثم الإنتقال لتعلم اللغة الخاصة بالمسار والتركيز عليها فلا مشكلة. أي أنه في مرحلة تعلم الأساسيات لا مشكلة في التعرف على أكثر من لغة وكتابة الكود الخاص بها، أما عند دراسة دورة تدريبية أي مسار كامل فيجب الإلتزام باللغة الخاص بذلك المسار والتركيز عليها فقط لمدة 6 شهور.
  19. Mustafa Suleiman
    إذا كنتي تقصديك إظهاره خارج محرر الأكواد VScode أي تشغيل سواء CMD أو Powershell فتستطيعي البحث عن منفذ الأوامر CMD في خانة البحث وسيظهر لك كما بالصورة التالية: وهناك طريقة أخرى وهي الضغط على زر CTRL + X معًا وسيظهر لك قائمة إختاري منها CMD أو terminal أو PowerShell وذلك تبعًا لمنفذ الأوامر المتاح لديك. أما إذا كنتي تريدي تشغيله في محرر الأكواد VScode فأسهل طريقة هي كالتالي: قومي بالضغط على زر CTRL + حرف الذال في الكيبورد كما في الصورة التالية:
  20. Mustafa Suleiman
    عند الإشتراك في الدورة وإتمام الدفع ستظهر الدورات الخاص بك في تبويب دوراتي، وستجد هنا شرح يوضح كيفية الوصول إلى الدورات الخاصة بك: كيف أصل للدورات التي اشتركت بها ويجب أن تكون سجلت دخولك بالإيميل الذي اشتركت به في الدورة وتم الدفع من خلاله. وفي حالة عدم ظهور الدورة إنتظر قليلاً، وإن لم تظهر لك، عليك بالتحدث إلى مركز المساعدة وسيتم حل مشكلتك خلال 24 ساعة ولا تقلق وسيتم الرد عليك. حيث سيتوجب عليك وضع الإيميل الخاص بك والذي قمت بالإشتراك به في الدورة، ثم سيصلك كود تحقق على البريد أدخله وستجد نافذة المحادثة قد ظهرت لك، أخبرهم بالمشكلة الخاصة بك. وإذا كان هناك أية توضيحات تريد معرفتها أخبرني، وضع كل ما تريد معرفته في السؤال هنا.
  21. Mustafa Suleiman
    نعم في المسار الخاص بالمشاريع سيتم استخدام Axios
  22. Mustafa Suleiman
    ما أنت بحاجة إلى تعلمه حاليًا هو جافاسكريبت ومن خلالها تستطيع استخدام fetch API حيث أن دالة fetch توفر لك إمكانية التعامل مع الـ API في الواجهة الخلفية وإرسال واستقبال البيانات من وإلى الخادم أو إرسال طلب حذف او تحديث وهكذا. وكل ذلك يتم من خلال fetch API والتي كانت في الأصل عبارة عن طلب Ajax أي أنها تقوم في الخلفية بإرسال طلب AJAX كالتالي: var xhr = new XMLHttpRequest(); xhr.open("GET", "https://example.com/api/users"); xhr.onload = function() { if (xhr.status === 200) { // Success! var users = JSON.parse(xhr.responseText); } else { // Error! console.log("Error: " + xhr.status); } }; xhr.send(); بينما ما تكتبه هو كالتالي: fetch("https://example.com/api/users") .then(response => response.json()) .then(users => { // Success! }) .catch(error => { // Error! console.log("Error: " + error); }); وتستطيع تقليل الكود السابق أيضًا من خلال استخدام Async و Await في جافاسكريبت بمعنى أنه كود غير متزامن، مثال: async function getUsers() { const users = await fetch("https://example.com/api/users").json(); return users; } const users = await getUsers(); console.log(users); وبالتالي أنت بحاجة إلى بحاجة إلى دورة تطوير التطبيقات باستخدام JavaScript لكون ستقوم بتعلم ما سبق والمزيد من أساسيات جافاسكريبت، وستقوم ببناء مشاريع تستخدم فيها API وأيضًا ستتعلم مكتبة React وهي إضافة كبيرة لك حيث ستطور واجهات متفاعلة ودينامكية أي ليست بحاجة إلى إعادة تحديث الصفحة من أجل تحديث البيانات. وهناك مكتبات خاصة بجافاسكريبت مثل Axios وهي مكتبة شهيرة جدًا وتسهل عليك عملية التعامل مع الـ API بشكل كبير. مثال لنفس الكود السابق ولكن باستخدام axios: import axios from "axios"; async function getUsers() { const response = await axios.get("https://example.com/api/users"); const users = response.data; return users; } const users = await getUsers(); console.log(users); ولن يتضح لك فائدتها الآن إلا بعد تعلم جافاسكريبت و fetch API و Ajax.
  23. Mustafa Suleiman
    ما تشعرين به أمر طبيعي ولا داعي للقلق وسيزول هذا الإحساس مع التطبيق العملي وإعادة كتابة الكود بمفردك. ما يجب عليك فعله الآن، هو إعادة بناء المشاريع التي قمتي بها في الدورة بمفردك، والبحث والتفكير ومحاولة إيجاد حلول حتى لو كانت جديدة ولم يتم شرحها أو مختلفة عن شرح المدرب للمشكلة التي تواجهك، والحل الأخير هو العودة للفيديو ثم مشاهدة ما قام به المدرب واستكمال المشروع بمفردك. وبذلك ستتمكني من استرجاع ما قمتي بدراسته بالكامل، وأيضًا اكتساب الثقة في قدرتك على بناء المشاريع وإزالة الرهبة من كتابة الكود بمفردك أو حل المشاكل، فوظيفة المبرمج هي حل المشاكل وليس كتابة الكود. والتفكير المنطقي والتخطيط الصحيح قبل كتابة الكود، ولا تشرعي أبدًا في كتابة الكود دون معرفة ما الذي ستقومين بكتابته ولماذا؟ وهل يوجد حل أفضل؟ وفي البداية لا تشغلي بالك كثيرًا بجودة الكود أو الحل الأفضل إذا لم تستطيعي معرفته، المطلوب هو معرفة كيفية بناء مشروع بالكامل بمفردك ويعمل بشكل سليم. وبعد ذلك عليك ببناء مشاريع أخرى مختلفة عن ما قمتي به بالدورة، وأيضًا بخواص ومميزات مختلفة لاكتساب معلومات جديدة وخلق تحدي لنفسك ولا تقلقي أبدًا ولا تشعري أنك لا تفهمي شيئًا، عليك بتقسيم المشكلة او المهمة المطلوب تنفيذها إلى أجزاء صغيرة ثم تقسيم تلك الأجزاء إلى أجزاء إن أمكن. ثم البدء بالعمل على تنفيذ كل جزء على حدى، وصدقًا حتى من لديهم خبرة كبيرة يشعرون أحيانًا أنهم غير جيدين في البرمجة، فركزي إهتمامك بالعمل على التعلم وبناء المشاريع. وإذا أردتي ملخص للغة بايثون أو أي إطار عمل عليك بالبحث عن Cheatsheet وبجانبه اللغة أو الإطار مثلاً Python Cheatsheet أو Django Cheatsheet. وإليك ملخص رائع للغة بايثون: https://www.pythoncheatsheet.org/ وهنا ملخص بالنسبة لإطار Django: https://github.com/lucrae/django-cheat-sheet https://cheatography.com/tag/django/ وبخصوص طريقة التعلم الصحيحة وبعض النصائح الأخرى، أنصحك بقراءة النقاشات التالية:
  24. Mustafa Suleiman
    إذا كان السؤال خاص بدورة بايثون فأرجو منك طرحه أسفل الفيديو المتعلق بموضوع السؤال. وإذا كان سؤال غير متعلق، فإليك الشرح. تستطيع إخفاء بعض الحقول والنماذج عن المستخدمين الجدد في Django باستخدام الصلاحيات (Permissions) وعرض الحقول والنماذج المطلوبة فقط للمستخدمين الذين لديهم هذه الصلاحيات. وبإمكانك تحقيق ذلك باستخدام مجموعات المستخدمين (Groups) والصلاحيات المخصصة لكل مجموعة. ففي Django، بإمكانك الاستفادة من نمط الصلاحيات المدمج في الإطار (Built-in permission system) لإنشاء صلاحيات مخصصة لمجموعات المستخدمين الخاصة بك، ويمكنك إنشاء مجموعة جديدة للمستخدمين الذين لديهم الصلاحية المطلوبة لرؤية وتحرير حقول ونماذج معينة. وتحديد صلاحيات لكل نموذج (Model) وحقل (Field) في Django باستخدام خاصية الصلاحيات (Permissions) المدمجة في النموذج، باستخدام الدالة Meta الموجودة في كل نموذج في Django، ومن خلال تعيين الصلاحيات للمجموعات المناسبة ، تستطيع تحديد الحقول والنماذج التي يمكن للمستخدمين الجدد الوصول إليها والتي يمكن للمستخدمين المحددين الوصول إليها. مثلاً، إنشاء مجموعة للمستخدمين الذين يملكون صلاحية الوصول إلى الحقل "تحرير" في نموذج معين. ثم تعيين الصلاحيات المناسبة لهذه المجموعة على النموذج والحقل المراد إخفاؤه عن المستخدمين الجدد. علاوة على ذلك ، تستطيع استخدام الزيادات (Mixins) في Django لإضافة صلاحيات إضافية للمجموعات المخصصة الخاصة بك. هذا يتيح لك إضافة المزيد من الصلاحيات المخصصة للمجموعات الخاصة بك لتحديد الحقول والنماذج التي يمكن للمستخدمين الوصول إليها. باختصار ، ما تحتاجه هو استخدام صلاحيات المستخدم والمجموعات والزيادات في Django لتحديد الحقول والنماذج التي يمكن للمستخدمين الجدد الوصول إليها وللمستخدمين المحددين الوصول إليها. أيضًا تحديد هذه الصلاحيات باستخدام خاصية الصلاحيات المدمجة في النماذج وتعيين الصلاحيات المناسبة لكل مجموعة من المستخدمين في Django. مثالًا بسيطًا باستخدام Meta و Permissions لإضافة صلاحيات لحقل معين. لنفترض أن لدينا نموذج لـ المقالات (Articles) في مدونة، ونريد فقط السماح للمستخدمين المحددين ( المسؤولين فقط) بتحرير حقل تاريخ النشر (Publish Date). لهذا الغرض، سنقوم بإنشاء مجموعة جديدة تسمى Editors ونعين صلاحيات لهذه المجموعة فقط للوصول إلى حقل تاريخ النشر. في ملف models.py، يمكننا تحديد الصلاحيات باستخدام Meta و Permissions على النحو التالي: from django.db import models from django.contrib.auth.models import Group, Permission class Article(models.Model): title = models.CharField(max_length=200) publish_date = models.DateTimeField(auto_now_add=True) class Meta: permissions = [ ("can_edit_publish_date", "Can edit the publish date"), ] def __str__(self): return self.title نقوم بتحديد الصلاحية can_edit_publish_date ووصفها "Can edit the publish date" في القائمة permissions، وهذا يتيح لنا استخدام هذه الصلاحية لتعيينها لمجموعة محددة في وقت لاحق. الآن، عليك بإنشاء مجموعة جديدة باسم Editors ونعين الصلاحية التي قمنا بتعريفها في Meta لهذه المجموعة باستخدام Permission.objects.get(): from django.contrib.auth.models import Group, Permission editors_group, created = Group.objects.get_or_create(name='Editors') can_edit_publish_date = Permission.objects.get(codename='can_edit_publish_date') editors_group.permissions.add(can_edit_publish_date) نستخدم get_or_create() لإنشاء مجموعة جديدة إذا لم تكن موجودة بالفعل. ثم، نستخدم get() للعثور على الصلاحية التي قمنا بتعريفها سابقًا باستخدام اسم الصلاحية codename. وأخيرًا، نستخدم permissions.add() لإضافة الصلاحية.
  25. Mustafa Suleiman
    ما يحدث أن Firebase تعمل على عرض التحقق عندما تقوم بإرسال رسالة تحقق SMS لرقم هاتف محمول في نظام Android. ويهدف هذا الإجراء إلى تحقق من أن المستخدم الذي يقوم بإدخال رقم الهاتف هو شخص حقيقي وليس روبوت. وإذا كنت ترغب في إزالة التحقق، تستطيع تعطيل خاصية التحقق في Firebase Console، من خلال الخطوات التالية: قم بتسجيل الدخول إلى Firebase Console. حدد مشروع Firebase الخاص بك. انتقل إلى "Authentication" في القائمة الجانبية اليسرى. حدد "Sign-in method" في القائمة الرئيسية. ابحث عن "Phone" وانقر على الزر "Configure". حدد "Invisible" في الخيار "Visibility" لتعطيل التحقق البصري. حفظ التغييرات. بعد تعطيل التحقق، لن يتم عرض التحقق بعد الآن وستتمكن من إدخال رمز التحقق مباشرةً في تطبيق Flutter الخاص بك. ولكن يجب مراعاة أن ذلك قد يؤثر على مستوى الأمان لتطبيقك. أي أن تعطيل التحقق البصري لا يؤثر على عملية إرسال رمز التحقق OTP، بل سيتم ما زال يتم إرسال رمز التحقق OTP إلى الرقم المحمول الذي تم إدخاله، ويتعين على المستخدم إدخال رمز التحقق لإتمام عملية تسجيل الدخول، ولكن الآن يتم إزالة الخطوة الإضافية للتحقق البصري بمتصفح Chrome.
×
×
  • أضف...