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

بتاريخ 12 ساعة قال Hassan Mahmoud6:

اعمل تحديث للملف ده jquery.min.js   ولا مش شرط

لا يوجد حاجة لتحديث ملف `jquery.min.js` إذا كان يعمل بشكل صحيح ولا يوجد به أي مشاكل.

يمكن التحقق من صحة وصلاحية ملف `jquery.min.js` عن طريق التأكد من وجوده في المسار الصحيح وعدم وجود أي أخطاء في الرمز الموجود داخله. وإذا كان الملف يعمل بشكل صحيح ولا توجد به أي مشاكل، فلا يوجد حاجة لتحديثه.

ومع ذلك، إذا كان هناك إصدار أحدث من `jquery.min.js` متاحًا ويحتوي على تحسينات أو إصلاحات لمشاكل معروفة، فقد يكون من المفيد تحديث الملف إلى الإصدار الأحدث للحصول على أداء أفضل وتجنب أي مشاكل قد تواجهها في المستقبل.

يبدو أنّ المشكلة تتعلق بعدم استدعاء المكوّنات (components) من ملفاتها الخاصة بشكل صحيح.

يجب التأكد من أن الملفات About.jsx و home.jsx موجودة في المسار الصحيح وأن اسم الملفات واسم المكوّنات المستدعاة تطابق بين الأماكن التي تم استدعاء المكوّنات منها وأماكن تعريفها.

على سبيل المثال، يمكن تغيير الأمر

import About from './components/About/About.jsx';

إلى

import { About } from './components/About/About.jsx';

لأنه يتم تصدير المكون باستخدام export function في ملف About.jsx.

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

يمكنك استخدام مكتبة الصوت في assembly مثل "OpenAL" أو "DirectSound" لتشغيل ملفات الصوت. ومع ذلك ، يعتمد الطريقة الدقيقة على النظام الذي تستخدمه والمكتبة التي تستخدمها.

على سبيل المثال ، إذا كنت تستخدم نظام Windows وتريد استخدام مكتبة DirectSound ، يمكنك استخدام دالة "DirectSoundCreate" لإنشاء كائن DirectSound و "CreateSoundBuffer" لإنشاء مخزن الصوت. ثم يمكنك استخدام "Play" لتشغيل الملف الموسيقى.

إليك مثالًا بسيطًا باستخدام مكتبة DirectSound في لغة التجميع:
 

; مثال لتشغيل ملف موسيقى باستخدام مكتبة DirectSound في لغة التجميع

include dsound.inc ; تضمين ملف التعريفات لمكتبة DirectSound

section .data
filename db "music.wav", 0 ; اسم ملف الموسيقى

section .bss
lpDSound dd ?
lpDSoundBuffer dd ?

section .text
global _start

_start:
; إنشاء كائن DirectSound
push 0 ; GUID_NULL
call DirectSoundCreate, 0, addr lpDSound, 0

; إنشاء مخزن الصوت
push 0 ; DSBUFFERDESC
push dword [lpDSound]
push dword [esp+16] ; LPDIRECTSOUNDBUFFER *
call CreateSoundBuffer, 0, addr lpDSoundBuffer, 0

; تشغيل الملف الموسيقى
push 0 ; dwReserved1
push 0 ; dwPriority
push 0 ; dwFlags
push 0 ; dwStartingOffset
push 0 ; dwPlayBytes
push 0 ; dwNotifyFreq
push dword [filename]
push dword [lpDSoundBuffer]
call IDirectSoundBuffer_Play, dword [lpDSoundBuffer], 0, 0, 0

; الخروج من البرنامج
push 0
call ExitProcess

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

لا يشترط أن تكون المشاريع أو التطبيقات التي تقوم بوضعهاف في ال portfolio الخاص بك لعميل حقيقي يمكنك تنفيذ أي مشروع تراه مناسب لك وبعد ذلك يمكنك رفعه وعرضه في ال portfolio الخاص بك كما يمكنك 

• يمكنك العمل على مشاريع Django الصغيرة لتحسين مهاراتك والتعرف على بنية التطبيقات في Django. يمكنك استخدام الموارد عبر الإنترنت للحصول على أفكار للمشاريع التي يمكنك العمل عليها.
• يمكنك الانضمام إلى المجتمعات المختلفة للمطورين والمستخدمين في Django و Python والمشاركة في الأحداث والتحديات والمناقشات. يمكنك التعلم من المطورين الآخرين والحصول على الدعم والمشورة.
• يمكن المساهمة في مشاريع Django المفتوحة المصدر والمساعدة في تطويرها وتحسينها. يمكن أن تكون هذه الخطوة مفيدة للحصول على الخبرة في Django و Python والتعرف على الممارسات الجيدة للتطوير.
•  يمكن الحصول على الخبرة في Django و Python من خلال الابتكار والتحسين المستمر. يجب تحليل الأخطاء والعثور على الحلول الأفضل لتحسين الكود وجعل التطبيق أكثر فعالية واستجابة.

كما أن محاولة تنفيذ المشاريع المطلوبة على مواقع العمل الحر تجعلك كما لو أنك تعمل على المشروع بشكل حقيقي 

هل تريد دورات مدفوعة أو مجانية ؟

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

أما إذا كنت تريد دورة مجانية باللغة العربية فلا يوجد دورة تستحق المتابعة (حسب ما رأيت )

أما إذا إنتقلت للمحتوى الأجنبي فيوجد الكثير من المصادر سواء المجاني أو المدفوع فمثلاً

• دورة The Complete Node.js Developer Course على Udemy: هذه الدورة مناسبة للمبتدئين وتغطي كل شيء بدءًا من التثبيت وحتى التطبيقات العملية. وتشمل الدورة أيضًا Express.js و MongoDB. كما يتم التركيز في هذه الدورة على إنشاء تطبيقات الويب باستخدام Node.js.
• دورة Node.js Basics على Pluralsight: تغطي هذه الدورة المفاهيم الأساسية لـ Node.js، بما في ذلك الموديولز، والإدخال والإخراج، والموارد، والتعامل مع الأخطاء. ويمكن من خلال هذه الدورة تعلم كيفية إنشاء تطبيقات Node.js الأساسية.
• دورة Node.js Fundamentals على LinkedIn Learning: تعتبر هذه الدورة مناسبة للأشخاص الذين لديهم خلفية في البرمجة، حيث تغطي المفاهيم الأساسية لـ Node.js وتشمل أيضًا Express.js و MongoDB. وتركز هذه الدورة على تطوير تطبيقات الويب باستخدام Node.js.

هذه بعض الدورات المميزة لتعلم Node.js، ولكن يمكنك البحث عن المزيد من الدورات والمصادر التعليمية عبر الإنترنت لتحديد الدورة التي تناسب احتياجاتك ومستواك في Node.js.

يمكنني توضيح استخدام هذه الدوال في Laravel من خلال مثال على هذه الدوال

على سبيل المثال، لنفترض أن لدينا تطبيق ويب يسمح للمستخدمين بإنشاء حسابات شخصية وتحديث معلوماتهم الشخصية. يتم تخزين بيانات المستخدمين في قاعدة البيانات، ويتم الوصول إليها باستخدام الـRouting في Laravel.

في هذا المثال، يتم استخدام PUT لتحديث بيانات المستخدم، PATCH لتحديث جزء من بيانات المستخدم، و DELETE لحذف حساب المستخدم.

على سبيل المثال، يمكن تعريف الـRouting في Laravel على النحو التالي:

Route::put('/users/{id}', 'UserController@update');
Route::patch('/users/{id}', 'UserController@updateProfile');
Route::delete('/users/{id}', 'UserController@delete');

وفي هذا المثال، يتم استخدام PUT لتحديث بيانات المستخدم، PATCH لتحديث جزء من بيانات المستخدم (مثل تغيير كلمة المرور فقط)، و DELETE لحذف حساب المستخدم بأكمله.

ويمكن تحديد الـController المناسب لكل دالة، حيث يتم استخدام دالة الـPUT لتحديث بيانات المستخدم، ودالة الـPATCH لتحديث جزء من بيانات المستخدم، ودالة الـDELETE لحذف حساب المستخدم.

وبهذا الشكل، يمكن للمستخدمين استخدام الدوال PUT و PATCH و DELETE في تطبيقات الويب لتحديث وحذف الموارد المختلفة، بناءً على الغرض المطلوب.

بتاريخ 4 دقائق مضت قال Khessam Ahmed:

لم افهم كلمة مورد  او مادا تعني

يعني مصطلح "المورد" (Resource) أي شيء يتم الوصول إليه أو تحديثه أو حذفه في تطبيق الويب. ويمكن أن يكون المورد مثلاً: مستخدم، تدوينة، صورة، فيديو، تعليق، إلخ.

وبشكل عام، يتم تمثيل الموارد في تطبيق الويب بواسطة عناوين URL مختلفة. على سبيل المثال، يمكن أن يكون عنوان URL لمورد مستخدم ما هو: /users/{id}، حيث يتم استخدام المعرف (id) لتمييز كل مستخدم بشكل فريد.

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

وبشكل عام، يساعد استخدام مفهوم المورد في تبسيط عملية برمجة تطبيقات الويب، وتحديد العمليات المناسبة للتفاعل مع الموارد المختلفة في التطبيق.

يمكن العثور على العديد من القوالب المجانية للمواقع عبر الإنترنت، وبعضها متوافق مع React. يمكن البحث عن هذه القوالب على محركات البحث مثل Google، ويمكنك العثور عليها بسهولة عن طريق البحث عن "free react website templates" أو "react website templates".

وبالنسبة للاستفادة من هذه القوالب لتعلم React وتنفيذها، فهذه طريقة جيدة للممارسة وتحسين مهاراتك في البرمجة. يمكنك استخدام هذه القوالب كنقطة انطلاق لبناء مواقع React الخاصة بك، وتعلم الكثير منها، مثل:

- كيفية بناء مكونات React وتفاعلها مع بعضها البعض
- كيفية استخدام مكتبات وأدوات React مثل React Router و Redux و Axios وغيرها
- كيفية تصميم وتنفيذ واجهات المستخدم الجذابة باستخدام CSS و Bootstrap وغيرها

موقع Frontend Mentor موقع ممتاز لتعلم تطوير الواجهات الأمامية وتحسين مهارات تصميم المواقع وتنفيذها باستخدام HTML وCSS و JavaScript و React وغيرها من التقنيات. يقدم الموقع تحديات تصميم مختلفة لمطوري الواجهات الأمامية، يمكن للمستخدمين تنزيل ملفات المشروع والعمل عليها وتنفيذها بأنفسهم. كما يتضمن الموقع مجتمعًا يدعم بعضه البعض ويقدم المساعدة والتوجيه في حال واجهت أي مشاكل في تنفيذ التحديات.

بتاريخ On 6‏/5‏/2023 at 17:01 قال Abdullah Alamri4:

لا زلت ابحث عن اجابة 

يمكنك يمكنك تجربة استخدام الدالة `highlight_string()` في PHP لتنسيق الكود وإرجاعه كنص بدون تنسيق. يمكنك استخدامها في الشفرة التالية:
 

<?php
$code = '<?php echo "النص النص النص"; ?>';
highlight_string($code);
?>

ستظهر النتيجة على الصفحة بالشكل التالي:

<?php echo "النص النص النص"; ?>

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

هناك طرق أخرى لتنظيم العناصر في قائمة Hierarchy في Unity إضافةً إلى المجموعات الثابتة والديناميكية التي تم ذكرها في التعليق السابق:

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

باستخدام هذه الطرق المختلفة، يمكنك تنظيم العناصر في قائمة Hierarchy بطريقة مناسبة وجعلها سهلة الوصول والتعديل عليها.

لا يمكن فتح ملف الرسوم المتحركة في Adobe Animate قبل شرائه، لأن هذه المواقع لا توفر نسخة تجريبية أو وصولًا مجانيًا إلى ملفات الرسوم المتحركة. ومع ذلك، تقدم المواقع عادة معاينات ولقطات شاشة ووصفًا لملفات الرسوم المتحركة، والتي يمكن أن تساعدك على تقييم ما إذا كان الملف مناسباً لاحتياجاتك قبل شرائه.

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

ويمكنك تجربة المواقع التالية

•  VideoHive: 
•  Envato Elements: 
•  Motion Array: 
•  Gumroad: 
•  Animated Market:

ملفات AEP هي ملفات مشاريع Adobe After Effects وتستخدم لإنشاء الرسوم المتحركة والتأثيرات الخاصة. يمكنك فتح ملفات AEP في Adobe After Effects والتعديل على الفريمات وإضافة المؤثرات الخاصة والنصوص والصوت وغيرها.

بمجرد تحرير الملف AEP في Adobe After Effects، يمكنك تصدير الملف بتنسيقات مختلفة مثل MP4 أو MOV أو GIF والاحتفاظ به في جودة عالية.

بالنسبة لسؤالك حول دعم برنامج Adobe Animate لملفات AEP، فإن برنامج Adobe Animate يدعم تصدير أشكال ملفات مختلفة مثل SWF وHTML5 وملفات GIF والمزيد، ولكنه لا يدعم ملفات AEP مباشرة. ولذلك، يجب أن تقوم بتصدير الملف AEP من Adobe After Effects بتنسيق يتوافق مع برنامج Adobe Animate، مثل MP4 أو MOV، ومن ثم يمكنك استيراد الملف الناتج إلى Adobe Animate والعمل عليه والتحرير فيه.

يجب ملاحظة أن بعض المؤثرات والتأثيرات التي تم إضافتها في Adobe After Effects قد لا تكون متوافقة تمامًا مع Adobe Animate، ولذلك يجب الانتباه إلى ذلك عند تصدير الملفات.

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

• خيارات الاستضافة المجانية:

يمكنك استخدام خدمات الاستضافة المجانية مثل GitHub Pages أو Netlify. هذه الخدمات توفر خيارات استضافة مجانية للمستخدمين، وتسمح لك بنشر صفحتك على الإنترنت بسهولة وبدون دفع أي رسوم.

في حالة استخدام GitHub Pages، يمكنك إنشاء مستودع Repository على GitHub وتحميل ملفات صفحتك إلى المستودع، ثم تحويل المستودع إلى صفحة ويب باستخدام خيارات GitHub Pages.

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

• خيارات الاستضافة المدفوعة:

يمكنك استخدام خدمات الاستضافة المدفوعة مثل Bluehost أو HostGator. هذه الخدمات تتيح لك استضافة صفحتك على الإنترنت باستخدام خادم الويب الخاص بهم، وتوفر ميزات مثل الدعم الفني والأمان والنسخ الاحتياطي وغيرها من الخدمات الإضافية.

يجب عليك دفع رسوم للاستفادة من خدمات الاستضافة المدفوعة، ويتم تحديد سعر الاستضافة بناءً على الخطط والميزات التي تحتاجها.

 يمكنك استخدام مزود خدمة استضافة مجاني مثل GitHub Pages أو Netlify، أو يمكنك استخدام خيارات الاستضافة المدفوعة.

في حالة استضافة صفحتك على GitHub Pages، يمكنك اتباع الخطوات التالية:

• قم بإنشاء حساب على GitHub وانشاء مستودع Repository جديد.
• قم بتحميل ملفات HTML و CSS الخاصة بك في المستودع الجديد.
• اذهب إلى إعدادات مستودعك وانتقل إلى صفحة GitHub Pages.
• في قسم Source، اختر الفرع الذي يحتوي على ملفات HTML و CSS الخاصة بك.
• اضغط على زر Save لحفظ الإعدادات.
• سيتم توفير رابط لصفحتك على GitHub Pages يمكنك مشاركته مع الآخرين.
• بعد القيام بهذه الخطوات، يمكنك الوصول إلى صفحتك من أي جهاز عبر الإنترنت باستخدام الرابط الذي تم توفيره لك.

يمكن استخدام خطوات مشابهة لاستضافة صفحتك على Netlify أو أي مزود خدمة استضافة آخر.

هناك طرق مختلفة لإضافة زر مشاركة للواتساب إلى صفحة الويب الخاصة بك.

• WhatsApp API:

WhatsApp API هي خدمة مقدمة من WhatsApp تتيح للمطورين إنشاء زر مشاركة للواتساب على صفحة الويب الخاصة بهم. يعتمد استخدام هذه الخدمة على عدة خطوات:

- الحصول على مفتاح API من WhatsApp Business API.
- إنشاء رسالة نصية تحتوي على النص أو الرابط الذي يريد المستخدم مشاركته.
- إنشاء رابط يحتوي على المفتاح الخاص بك ورسالتك النصية.
- إضافة الرابط الذي تم إنشاؤه إلى صفحة الويب الخاصة بك.

عندما ينقر المستخدم على الزر المشاركة ، يتم فتح WhatsApp مع رسالة جاهزة للإرسال إلى جهات الاتصال الخاصة به.

• مكتبات الوسائط الاجتماعية:

هناك العديد من مكتبات الوسائط الاجتماعية التي تتيح للمطورين إضافة زر مشاركة للواتساب بسهولة إلى صفحات الويب الخاصة بهم. معظم هذه المكتبات تتطلب إدراج بعض الكود في صفحات الويب الخاصة بك. على سبيل المثال، يمكن استخدام مكتبة AddToAny لإضافة زر مشاركة للواتساب، ويمكن إضافة الكود التالي في صفحات الويب الخاصة بك:
عندما ينقر المستخدم على الزر المشاركة ، يتم فتح WhatsApp مع رسالة جاهزة للإرسال إلى جهات الاتصال الخاصة به.

• خيارات مخصصة:

يمكن للمطورين إنشاء خيارات مخصصة لإضافة زر مشاركة للواتساب إلى صفحات الويب الخاصة بهم. يمكن أن تختلف هذه الخيارات بشكل كبير وتشمل إضافة رمز الزر مباشرة إلى HTML أو استخدام JavaScript لإنشاء زر مخصص.على سبيل المثال، يمكن إنشاء زر مشاركة للواتساب باستخدام الكود التالي:

<button onclick="whatsAppShare()">مشاركة على الواتساب</button>

<script>
function whatsAppShare() {
  var message = "اكتب النص الذي تريد مشاركته هنا";
  var phone = "رقم الهاتف الذي تريد إرساله إليه";
  var url = "https://api.whatsapp.com/send?text=" + encodeURIComponent(message) + "&phone=" + phone;
  window.open(url);
}
</script>

عندما ينقر المستخدم على الزر المشاركة ، يتم فتح WhatsApp مع رسالة جاهزة للإرسال إلى جهات الاتصال الخاصة به.

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

بالإضافة إلى استخدام `setTimeout` ، هناك طرق أخرى لتحديث الحالة بشكل دوري. من بين هذه الطرق:

•  استخدام `setInterval` مع تحديث القيمة بشكل صحيح:

يمكن استخدام `setInterval` لتحديث الحالة بشكل دوري ، ولكن يجب التأكد من تحديث القيمة بشكل صحيح من خلال إرجاع دالة من `useEffect` تستخدم لإلغاء `setInterval` عندما يتم إعادة تقديم المكون أو إزالته. يمكن استخدام الكود التالي لتحقيق ذلك:

useEffect(() => {
  const intervalId = setInterval(() => {
    setTimer(timer => timer + 1);
  }, 1000);

  return () => clearInterval(intervalId);
}, []);

• استخدام `requestAnimationFrame`:

يمكن استخدام `requestAnimationFrame` لتحديث الحالة بشكل دوري ، ولكن يجب التأكد من تحديث القيمة بشكل صحيح من خلال إرجاع دالة من `useEffect` تستخدم لإلغاء `requestAnimationFrame` عندما يتم إعادة تقديم المكون أو إزالته. يمكن استخدام الكود التالي لتحقيق ذلك:

const requestRef = useRef();
const previousTimeRef = useRef();

const animate = (time) => {
  if (previousTimeRef.current != undefined) {
    const deltaTime = time - previousTimeRef.current;
    setTimer(timer => timer + deltaTime / 1000);
  }
  previousTimeRef.current = time;
  requestRef.current = requestAnimationFrame(animate);
}

useEffect(() => {
  requestRef.current = requestAnimationFrame(animate);
  return () => cancelAnimationFrame(requestRef.current);
}, []);

•  استخدام مكتبات التحديث الدوري:

هناك العديد من مكتبات التحديث الدوري المتوفرة لـ React مثل `react-timer-hook` و `react-use` و `useInterval` والتي تسمح بتحديث الحالة بشكل دوري بسهولة. يمكن استخدام هذه المكتبات لتحقيق الهدف بشكل أسهل وأكثر فعالية.

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

بتاريخ On 4‏/5‏/2023 at 22:18 قال Abdelhalim-Hafez:

ماذا عن كورس back - End المتكامل 

يوجد عدة دورات في الأكاديمية حول ال backend بمختلف التقنيات باستخدام لغة Python و JavaScript و PHP و Ruby كما تم التوضيح في التعليقات السابقة 

تختلف المميزات التي توفرها كل من Node.js و PHP و Django و Ruby on Rails ، ومن المهم معرفتها عند اختيار اللغة والإطار الذي سيتم استخدامه لتطوير تطبيق الويب. وفيما يلي نظرة عامة على بعض المميزات التي يقدمها كلا منهما:

Node.js:

• يستخدم لغة JavaScript الشائعة والسهلة التعلم.
• يتميز بأداء عالي وسرعة في تطوير التطبيقات.
• يتميز بقدرته الكبيرة على التعامل مع الاتصالات المتزامنة.
• يتميز بإمكانية تشغيل الكود المصدري على الخادم والعميل.

PHP:

• تعد من أكثر لغات برمجة الخلفية شيوعًا واستخدامًا.
• يتميز بسهولة تعلمها وقابليتها للتوسع والتخصيص.
• يتميز بإمكانية تكاملها مع العديد من قواعد البيانات والإطارات العمل الأخرى.
• يتميز بأدائه الجيد في تطوير تطبيقات الويب المتوسطة والصغيرة.

Django:

• يعتبر إطار عمل Python الشهير لتطوير تطبيقات الويب.
• يتميز بقدرته الكبيرة على تطوير تطبيقات الويب المتوسطة والكبيرة.
• يتميز بسهولة استخدامه وسرعة تطوير التطبيقات.
• يتميز بإمكانية تكاملها مع العديد من قواعد البيانات والإطارات العمل الأخرى.

Ruby on Rails:

• يعتبر إطار عمل Ruby الشهير لتطوير تطبيقات الويب.
• يتميز بسهولة استخدامه وسرعة تطوير التطبيقات.
• يتميز بقدرته الكبيرة على تطوير تطبيقات الويب المتوسطة والكبيرة.
• يتميز بإمكانية تكاملها مع العديد من قواعد البيانات والإطارات العمل الأخرى.

لا يمكن تحويل الفيديو مباشرة من YouTube إلى ملف Blender دون إعادة بناء المشروع من الصفر، لأن ملفات الفيديو عادة ما تكون في صيغة مختلفة ولا تحتوي على تفاصيل المجسمات والمواد والإضاءة والكاميرا والتأثيرات التي تضاف في Blender.

للحصول على ملفات المجسمات، يمكن استخدام بعض الأدوات المتاحة على الإنترنت مثل موقع Sketchfab. يسمح موقع Sketchfab للمستخدمين بتحميل ومشاركة ملفات المجسمات 3D والرسوم المتحركة والصور الثلاثية الأبعاد. يمكن البحث عن أي مجسم موجود على Sketchfab وتحميله بصيغة متوافقة مع Blender مثل OBJ أو FBX واستيراده إلى Blender للتعديل عليه.

يمكنك أيضًا استخدام برنامج خاص لتحميل الفيديو من YouTube وتحويله إلى صيغة متوافقة مع Blender مثل MP4 أو AVI. بمجرد تحويل الفيديو إلى صيغة متوافقة، يمكنك استخدام خيار "Import" في Blender لاستيراد الملف المحول والبدء في تعديله. ومن ثم يمكنك إضافة المجسمات والمواد والكاميرا والإضاءة والتأثيرات والتعديل عليها بشكل منفصل حسب احتياجات المشروع.

ملفات Build هي ملفات HTML وCSS وJavaScript المضغوطة التي تم إنشاؤها بواسطة أداة البناء الخاصة بـ React (مثل webpack) والتي تحتوي على جميع المكونات والمحتويات اللازمة لعرض موقع React باستخدام React DOM.

عندما يتم رفع مشروع React على Netlify ، يجب توفير ملفات Build لـ Netlify لعرض الموقع بشكل صحيح. إذا لم تقم بإنشاء ملفات Build أولاً ، فلن يتم عرض الموقع بشكل صحيح وسيتم عرض أخطاء في الصفحة.

لذلك ، يجب التأكد من وجود ملفات Build اللازمة لعرض الموقع بشكل صحيح عند الرفع على Netlify.

لذلك يجب عليك اتباع الخطوات التالية:

• قم بإنشاء مستودع GitHub جديد لمشروع React الخاص بك.
• تأكد من أن مشروع React الخاص بك يحتوي على ملفات Build اللازمة لعرض الموقع. يمكنك إنشاء ملف Build باستخدام الأمر "npm run build" أو "yarn build".
• حدد المستودع الخاص بمشروع React الخاص بك.
• اختر الفرع الذي تريد استخدامه للإنشاء الأوتوماتيكي (عادةً ما يكون الفرع الافتراضي master/main) وحدد دليل البناء الذي يحتوي على ملفات Build الخاصة بمشروع React الخاص بك.
• انقر على الزر "Deploy site" للبدء في عملية الرفع.

أولًا، بالنسبة لسؤالك عن الاستفادة من دورات حسوب في تعلم البرمجة وعمرك الصغير، فالإجابة هي: بالتأكيد يمكنك استخدام دورات حسوب وغيرها من الموارد التعليمية لتعلم البرمجة باستخدام لغة بايثون، بغض النظر عن عمرك. فالمهم هو الشغف والاجتهاد في التعلم، وليس السن.

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

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

سأقدم شرحًا نظريًا مفصلاً لتصميم برنامج إدارة طلاب الجامعة باستخدام البرمجة الكائنية (Object-Oriented Programming) مع بعض الأمثلة البسيطة.

في البرمجة الكائنية، يتم التفكير في البرنامج على أنه مجموعة من الكائنات التي تتفاعل مع بعضها البعض لتنفيذ مهمة ما. وتتألف الكائنات من الخصائص والأساليب.

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

يتم تصميم الصف (class) للطالب في البرمجة الكائنية باستخدام الكود التالي:

class Student:
    def __init__(self, id, name, birthdate, year, college, avg):
        self.id = id
        self.name = name
        self.birthdate = birthdate
        self.year = year
        self.college = college
        self.avg = avg

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

على سبيل المثال، يمكن إنشاء كائنات لعدة طلاب كالتالي:

student1 = Student(1, "Ahmed", "01/01/2000", 3, "Engineering", 85.5)
student2 = Student(2, "Sara", "02/02/2001", 2, "Science", 90.2)

ويمكن إضافة الطلاب الجدد إلى قائمة (list) باستخدام الدالة append() كالتالي:

students_list.append(student)

ويمكن البحث عن الطلاب باستخدام الدالة filter() والدالة lambda كالتالي:

if choice == 1:
        id = int(input("Enter student ID: "))
        result = list(filter(lambda x: x.id == id, students_list))
    elif choice == 2:
        name = input("Enter student name: ")
        result = list(filter(lambda x: x.name == name, students_list))

ويمكن فرز الطلاب حسب معيار محدد باستخدام الدالة sort() والدالة lambda ويمكن طباعة قوائم الطلاب باستخدام الدالة print() كالتالي:

def print_students():
    for student in students_list:
        print(student.id, student.name, student.birthdate, student.year, student.college, student.avg)

يمكن تنفيذ حركة فتح الباب في Unity باستخدام تقنية التعامل مع الأشياء الافتراضية (Virtual Object Interaction) المتوفرة في مكتبة XR Interaction Toolkit. وفيما يلي خطوات عمل حركة فتح الباب في Unity عند توجيه الجهاز وضغط زر الإمساك:

• إنشاء باب وتعيينه كـ GameObject في المشهد.
• إضافة مكون Collider للباب لتحديد المنطقة التي يمكن التفاعل معها.
• إضافة مكون Rigidbody للباب وتعيين الـ Is Kinematic إلى True لتمكين التحكم اليدوي.
• إنشاء مكون Interactable وتعيينه للباب للسماح بالتفاعل معه.
•  إضافة مكون XR Grab Interactable للباب للتعامل مع عملية الإمساك.
• تعيين الـ Interaction Layer للباب لتحديد الطبقة التفاعلية المناسبة.
• إنشاء مكون XR Socket Interactor للجهاز وتعيينه للتفاعل مع الباب.
•  تعيين الـ Socket Name للـ XR Socket Interactor للتحديد الصحيح للباب.
• إنشاء Script وتعيينه للجهاز للتحقق من توجيه الجهاز نحو الباب واضغط على زر الإمساك.
• استخدام مكتبة XR Interaction Toolkit لتنفيذ حركة فتح الباب.

يمكن تفصيل هذه الخطوات في الـ Documentation الخاص بـ XR Interaction Toolkit المتوفرة في Unity.

الخطأ "A Interaction Layer 31 is not set to 'Teleport'" يشير إلى أن طبقة التفاعل رقم 31 لم يتم تعيينها إلى "Teleport". يبدو أن هذه الطبقة التفاعلية تستخدم في بعض الكائنات Interactable المتعلقة بالتنقل (Teleportation)، ومن الضروري تعيين هذه الطبقة التفاعلية لتكون قابلة للتنقل.

يمكن حل المشكلة عن طريق تعيين طبقة التفاعل 31 إلى "Teleport". يمكن القيام بذلك عن طريق النقر بزر الماوس الأيمن في واجهة المستخدم في Unity واختيار "Layer Settings"، ثم تعيين الطبقة التفاعلية رقم 31 إلى "Teleport" من القائمة المنسدلة.

يجب تعيين الطبقة التفاعلية بشكل صحيح لضمان أن الكائنات Interactable المتعلقة بالتنقل يمكنها استخدامها بشكل صحيح وتحقيق الوظائف المطلوبة.

كما أن الأخطاء الأخرى بناءً على الرسالة التي وردت، يبدو أن المشكلة هي تداخل Collider بين عدة أشياء تفاعلية (Interactable objects). يجب أن يتم تعيين Collider واحد فقط لكل كائن Interactable، ولا يمكن استخدامه مع أي كائن Interactable آخر.

لحل هذه المشكلة، يمكن اتباع الخطوات التالية:

• افتح الـ Inspector الخاص بالكائن المتفاعل الذي تعاني منه المشكلة.
• قم بفتح مكوناته والبحث عن Collider المستخدم به.
• إذا كان هناك Collider آخر مستخدم مع كائن Interactable آخر، فيجب إزالة هذا Collider والاكتفاء بالـ Collider الخاص بالكائن المتفاعل الحالي.
• إذا لم يكن هناك Collider آخر مستخدم، يجب التحقق من إعدادات الطبقات التفاعلية للكائنات المتفاعلة. يجب على الكائنات المتفاعلة التي تستخدم التلفريك (Teleportation) أن تكون في الطبقة التفاعلية المخصصة لذلك (Teleport layer).

بعد إجراء التغييرات اللازمة، يجب حفظ المشهد وإعادة تشغيل اللعبة للتحقق من حل المشكلة. يمكن استخدام واجهة المستخدم في Unity لتعيين الطبقات التفاعلية بشكل صحيح.

يمكنني إعطاء حل غير مباشر للمسألة السابقة بدلاً من الإجابة المباشرة. 

لحل المشكلة الأولى "طباعة الأعداد الزوجية من 0 إلى 20"، يمكن استخدام حلقة تكرارية (loop) للتحقق من الأعداد الزوجية وطباعتها. يمكن استخدام حلقة التكرار for وشرط if لذلك، كما يلي:

for (let i = 0; i <= 20; i++) {
  if (i % 2 === 0) {
    console.log(i);
  }
}

لحل المشكلة الثانية "طباعة مضاعفات العدد 7 من 1 إلى 30"، يمكن استخدام حلقة تكرارية (loop) للضرب في العدد 7 وطباعة النتائج. يمكن استخدام حلقة التكرار for لذلك، كما يلي:
 

for (let i = 1; i <= 30; i++) {
  let result = i * 7;
  console.log(result);
}

وبذلك تم حل المشكلتين بشكل غير مباشر.

يبدو أن المشكلة تكمن في عدم استخدام الحزمة الصحيحة للحصول على أيقونات العلامات التجارية (Brand Icons). تحتوي مكتبة Fontawesome على حزمة مختلفة للأيقونات الصلبة (Solid Icons) والأيقونات العلامات التجارية (Brand Icons) والأيقونات النسبية (Regular Icons).لحل المشكلة، يجب تثبيت الحزمة الصحيحة للأيقونات العلامات التجارية باستخدام الأمر التالي:

npm install --save @fortawesome/free-brands-svg-icons

ثم يمكنك استيراد الأيقونة الخاصة بـ YouTube باستخدام الحزمة الصحيحة كما يلي:

import { faYoutube } from '@fortawesome/free-brands-svg-icons';

وبعد ذلك، يمكنك استخدام الأيقونة باستخدام العلامة التالية:

<FontAwesomeIcon icon={faYoutube} className='icon1'/>

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

يبدو أنك تعمل على تطبيق React وتواجه مشكلة في تحديد القيمة الافتراضية لحقل نموذج الإدخال (input field) دون تحديد handler onChange. يشير الخطأ إلى أن الحقل سيتم عرضه كحقل للقراءة فقط (read-only) إذا لم يكن لديه handler onChange. ويوصى باستخدام defaultValue بدلاً من value إذا كنت تريد تحديد القيمة الافتراضية للحقل.

لتجنب هذا الخطأ، يجب تحديد handler onChange للحقل إذا كان يتوقع تغيير القيمة بواسطة المستخدم. وإذا كنت تريد تحديد القيمة الافتراضية فقط، فيمكنك استخدام defaultValue بدلاً من value.

في المثال التالي، سنقوم بتعيين قيمة افتراضية لحقل الإدخال (input field) باستخدام defaultValue وتحديد handler onChange عند الحاجة:

import React, { useState } from 'react';

function App() {
  const [name, setName] = useState('');

  const handleInputChange = (event) => {
    setName(event.target.value);
  };

  return (
    <div>
      <label>
        Name:
        <input type="text" defaultValue={name} onChange={handleInputChange} />
      </label>
    </div>
  );
}

export default App;

في هذا المثال، يتم تعيين القيمة الافتراضية لحقل الإدخال (input field) باستخدام defaultValue، ويتم تحديد handler onChange لتحديث القيمة عندما يتم تغييرها بواسطة المستخدم.

يجب تحديد handler onChange لأي حقل إدخال (input field) يتوقع تغيير القيمة بواسطة المستخدم. ويمكن استخدام defaultValue إذا كنت تريد تحديد القيمة الافتراضية التي لا تتغير بواسطة المستخدم.

بتاريخ On 3‏/5‏/2023 at 13:51 قال Ebrahim Abdo2:

 

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

 

مثال بسيط يوضح كيفية تحديد الصلاحيات المتاحة للمستخدمين في Django باستخدام ModelAdmin.

لنفترض أن لديك نموذجًا بعنوان Project يحتوي على حقلين title وdescription وتريد من المستخدمين الجدد فقط عرض هذه الحقول، ولكن تريد للمستخدمين المحددين الوصول إلى حقل الصورة (image) والتحرير والحذف.

في ModelAdmin، يمكنك تحديد الصلاحيات المتاحة لكل مستخدم عن طريق تحديد الحقول التي يمكن للمستخدمين الجدد الوصول إليها والتحرير، وتحديد الحقول التي يمكن للمستخدمين المحددين الوصول إليها والتحرير.

يمكنك تحديد صلاحية القراءة والعرض لجميع المستخدمين لحقلي title و description في Project ModelAdmin عن طريق إضافة الحقلين إلى fields:

from django.contrib import admin
from myapp.models import Project

class ProjectAdmin(admin.ModelAdmin):
    fields = ('title', 'description')

admin.site.register(Project, ProjectAdmin)

ولكن، إذا أردت تحديد الصلاحيات للمستخدمين المحددين لصلاحية التعديل والحذف لحقل الصورة (image)، يمكنك استخدام الخيارات التالية:

readonly_fields: يمكنك استخدامه لتعيين حقل الصورة (image) كحقل للقراءة فقط للمستخدمين الجدد وتركه قابلًا للتحرير للمستخدمين المحددين.

fields: يمكنك استخدامه لتحديد الحقول التي يمكن للمستخدمين المحددين الوصول إليها والتحرير، مثل حقل الصورة (image).

exclude: يمكنك استخدامه لاستثناء حقل الصورة (image) من عرضه في إدارة الموقع بشكل عام والتحكم به عن طريق الصلاحيات المحددة في ModelAdmin.

في هذا المثال، سنستخدم readonly_fields لتعيين حقل الصورة كحقل للقراءة فقط للمستخدمين الجدد وسنستخدم fields لتحديد حقل الصورة والتحكم به عند المستخدمين المحددين:

from django.contrib import admin
from myapp.models import Project

class ProjectAdmin(admin.ModelAdmin):
    fields = ('title', 'description')
    readonly_fields = ('image',)

    def get_readonly_fields(self, request, obj=None):
        readonly_fields = super().get_readonly_fields(request, obj=obj)
        if not request.user.is_superuser:
            return readonly_fields + ('image',)
        return readonly_fields

admin.site.register(Project, ProjectAdmin)

في هذا المثال، إذا كان المستخدم ليس مديرًا، سيتم تعيين حقل الصورة كحقل للقراءة فقط باستخدام الخاصية readonly_fields وستتم إضافته إلى القائمة الموجودة في الخاصية get_readonly_fields. وإذا كان المستخدم مديرًا، فستظهر له كافة الحقول المتاحة بما في ذلك حقل الصورة.

هذا هو مثال بسيط على كيفية تحديد الصلاحيات المتاحة للمستخدمين في Django باستخدام ModelAdmin و Django's Model Permissions. يمكنك تطبيق نفس المفهوم لأي عدد من الحقول في النموذج الخاص بك.