شرف الدين حفني

برجاء إرفاق المشروع حتى نتمكن من معاينته بشكلٍ أفضل

يوجد لديك مشكلتان قمت بوضع مسار ملف الجافا سكريبت بشكلٍ خاطئ حيث قمت بكتابة <script src="../New folder (7)/main.js"></script> وهذا المسار غير موجود حيث أنك قد وضعت ملف الجافاسكريبت في نفس مجلد ملف الhtml مما يعني أن يجب أن يكون وسم الإستيراد كالتالي <script src="main.js"></script> في ملف جافا سكريبت قمت بكتابة var inp = document.getElementById("input"); ولا يوجد في ملف html عنصر يحمل id بإسم input بل يحمل class بهذا الإسم فبرجاء تغيير العنصر في ملف html ووضع الid بقيمة input ليصبح شكل العنصر في صفحة الhtml كالتالي <input type="text" id="input">

تحتاج أولًا إلى تثبيت المكتبة التالية , pbkdf2 عبر إستخدام أداة pip pip install pbkdf2 ومن ثم نقوم بعمل إستيراد لهم import pbkdf2, os ومن ثم نقوم بإضافة salt وهو عبارة عن كلمة يتم إضافتها للشفرة لتزويد صعوبتها وتعقيدها ونقوم بتوليدها عبر توليد رموز عشوائية كما بالشفرة التالية passwordSalt = os.urandom(16) ومن ثم نقوم بتوليد المفتاح عبر الشفرة التالية باستخدام مكتبة pbkdf2 key = pbkdf2.PBKDF2(password, passwordSalt).read(32) لتصبح في النهاية شفرتنا البرمجية شبيهة بتلك الشفرة import pbkdf2, os password = "sharafeldeen" passwordSalt = os.urandom(16) key = pbkdf2.PBKDF2(password, passwordSalt).read(32)

يمكنك تنفيذ المطلوب عبر إستخدام الدالة COUNT , حيث في حالتنا هنا نريد الحصول على عدد المُعجبين والذي يمكن تنفيذه كالتالي بإستخدام sql select COUNT(UserLikes.PostId) from Post left join UserLikes on Post.id = UserLikes.PostId وفي حالة أردنا عرض المنشور وبجانبه عدد المعجبين يمكننا إستخدام الدالة count مع الدالة group by لأن بدون إستخدام group by سيتم عرض فقط المنشورات التي لديها معجبين, ويمكننا تمثيل ذلك بكود sql كالتالي select Post.*, COUNT(UserLikes.PostId) from Post left join UserLikes on Post.id = UserLikes.PostId group by Post.id حيث يتم عرض جميع المنشورات حسب الid الخاص بهم بالإضافة إلى عدد المُعجبين, ويمكننا تنفيذ الشفرات السابقة إلى أكواد sequelize كالتالي const posts = await Post.findAll({ attributes:[ [Sequelize.fn("COUNT", Sequelize.col("UserLikes.id")), "likes"] ], include:{model:User,as:"UserLikes" , attributes:[]}, group: ['Post.id'], subQuery: false, limit: limit, offset: limit * pageNo }) كما تلاحظ قمنا في خانة attributes بوضع attribute واحد فقط وهو مجموع الحقل UserLikes.id لنعلم كم إعجاب لكل منشور حسب ظهور المُعرف الخاص بالمُعجب, كما إستخدمنا أيضًا subQuery ب false حتى نجعل الشفرة تعمل كما بالأعلى حتى لا يتم إستبدال الjoin ب subquery const posts = await Post.findAll({ attributes:{ include:[[Sequelize.fn("COUNT", Sequelize.col("UserLikes.id")), "likes"]] }, include:{model:User,as:"UserLikes" , attributes:[]}, group: ['Post.id'], subQuery: false, limit: limit, offset: limit * pageNo }) الفرق الوحيد أننا قمنا بتغيير خاصية attributes بدلًا من وضعها على هيئة مصفوفة قمنا بوضعها على هيئة كائن, حيث إن وضعناها على هيئة مصفوفة سيقوم بجلب العناصر التي في المصفوفة فقط, بينما إن قمنا بوضعها على هيئة كائن سيقوم بجلب العناصر جميعها بالإضافة إلى الحقل في الخاصية include

المشكلة لديك أنك تقوم بوضع الشرط else داخل نفذ الحلقة التكرارية, وبالتالي عندما تمر أول لفة ولا يجد العنصر المطلوب يتم تنفيذ شرط else دون إنتظار المرور على باقي العناصر الحل أن تضع متغير يتم تغييره قيمته إلى true أو false حسب إن تم إيجاد العنصر أم لا, وثم تضع شرط أن العنصر لم يتم إيجاده خارج الحلقة التكرارية لتصبح شفرتك البرمجية كالشكل التالي var isFound = false; let action = document.getElementById("action"); action.addEventListener("click", function () { let input = document.getElementById("input").value, demo = document.getElementById("demo"); for (i = 0; i < fields.length; i++) { if(input == fields[i].field1){ let result = "<tr><td>" + fields[i].field1 + "</td>" + "<td>" + fields[i].field2 + "</td>" + "<td>" + fields[i].field3 + "</td>" + "<td>" + fields[i].field4 + "</td>" + "<td>" + fields[i].field5 + "</td></tr>"; demo.innerHTML = result; isFound = true; } } if(!isFound){ demo.innerHTML = "غير موجود"; } isFound = false; });

أعتذر لم أنتبه إلى ملف الجافاسكريبت, المشكلة لديك في ملف الجافاسكريبت أنك تحاول إستخدام جيكويري على الرغم أنك لم تضعها في الملفات, فلو دخلت إلى المسار /assetستجده فارغًا ليس به جيكويري, برجاء تنزيلها أو وضع هذا الاسكريبت ومسح وسم الاسكريبت الذي يُشير إلى مكان الجيكويري في المسار asset/jquery src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script> بالنسبة إلى تعويض عدم وجود media فيمكنك تعويضها بإستخدام التنسيقات وأصناف بوتستراب مثل الflex , على سبيل المثال يمكنك إستخدام تلك الأصناف لتعويض الصنف media <div class="col-md"> <div class="d-flex"> <div class="flex-shrink-0"> <img class="mr-3" src="test.png" width="50"/> </div> <div class="flex-grow-1 ms-3"> <h5 class="mt-0 text-left"> EASY CUSTOMIZATION </h5> <p class="mb-2 text-left"> Seamlessly restore client-focused potentialities rather than functional strategic theme areas. </p> </div> </div> حيث قمنا هنا بإستخدامم flex-box بغرض تقسيم المحتوى إلى قسمين, قسم للصورة وقسم للنصوص

المشكلة أنك تستخدم الإصدار الخامس من بوتستراب والذي لا يدعم media التي توقف دعمها من بعد الإصدار الرابع لقد بحثت في ملف الhtml الخاص بك ومن الواضح أنك نسيت إعطاء العناصر الصنف noTransperrent حيث قمت بتعريف تنسيقات الصنف في ملف الcss ولكن نسيت أن تعطيه للعناصر هذا يحدث لأن النسبة بين أبعاد الصورة تتغير, حيث على سبيل المثال إن كان عرض الصورة 200 بيكسل وإرتفاعها 100 بيكسل, إن أردت تغيير الإرتفاع إلى 50 يجب أيضًا بالمثل تغيير العرض إلى 100, لذا الحل أن تقوم بتحديد إرتفاع الصورة ومن ثم وضع خاصية العرض بشكل تلقائي width:auto حتى لا يتم إفساد أبعاد الصورة

الtransition لا يعمل إلا في القيم المطلقة ماهي القيم المطلقة؟ هي القيم التي لها معنى واضح مثل 50 px أو 0px بينما القيم التي تكون مثل auto, inherit لا تعمل مع الtranstion لذا برجاء تغيير قيمة الmargin:auto الموجودة للصنف parent إلى 0px

بالإضافة إلى إجابة عدنان فإن الrecursion يستهلك مساحة أكثر من الذاكرة memory حيث أن في كل لفة يتم تخزين مؤشر إلى الدالة في الmemory stack مما يأخذ مساحة من الذاكرة, بالتالي فإن الiteration يكون أسرع نسبيًا من الrecursion , ولكن هذا يأتي على حساب التبسيط فإن يوجد بعض المشاكل مثل ال divide and conquer لا يمكن تطبيقها بواسطة الiteration إلا بصعوبة ولكن على الرغم من ذلك فإن الrecursion في أوقات كثيرة لا يتسبب بالمشاكل التي بالأعلى وذلك بسبب أن في أوقات كثيرة الcompiler يقوم تلقائيًا بتحويل الشفرة البرمجية الخاصة بالrecursion إلى الiteration

oop كل شئ في الoop عبارة عن objects حيث يجب وجود class وتأتي منه objects وكل صنف يمكنه الوراثة من صنف أخر بحيث يأخذ منه خصائصه والدوال الخاصة به كل كائن يحتوي على خصائص attributes و bhafiors عبارة عن دوال الدوال تنقسم إلى نوعين pure functions تقوم بإستقبال مُعطيات وتقوم بإخراج معطيات من دون التعديل على خصائص على الكائن, بينما الدوال الغير نقية non-pure functions تقوم بالتعديل على خصائص الكائنات مثال على شفرة برمجية للoop public class Person { private String name; public String getName() { return name; } public void setName(String newName) { this.name = newName; } } هنا نلاحظ وجود الدالة getName التي تقوم بإرجاع إسم الشخص, والدالة setName التي هي دالة غير نقية حيث تقوم بالتعديل على خاصية الإسم لدى الشخص functional programming الدوال في الfunctional programming كلها نقية حيث تقوم بإستقبال المعطيات وإخراج ناتج دون وجود side effects أي أنها لا تقوم بالتعديل أو تغيير أحد القيم الموجودة لدينا تمتاز أنها declarative أي أن نقوم بمعالجة البيانات عبر مجموعة من الدوال الجاهزة بتجميع تلك الدوال معًا دون الإحتياج إلى كتابة الشفرة الخاصة بكل دالة منهم List<Integer> numbers = Arrays.asList(1,2,3,4,5); numbers.forEach(number -> System.out.print( number + " ")); كما تلاحظ في أننا هنا نقوم فقط بأخذ مجموعة من القيم الموجودة في مصفوفة ونقوم بالمرور عليها وطباعة العناصر دون أن نقوم بالتغيير في القيم الأصلية وكل سطر في البرنامج عبارة عن دالة

عادةً يتم تخزين الرمز jwt token إما في ملفات الإرتباط (cookies) أو في المساحة المحلية للمتصفح(local storage) وفي حالة تخزينه في المساحة المحلية يتم إرساله عبر وضعه في Header مع طلب الajax بينما إن تم تخزينه في ملفات الإرتباط يمكن للخادم الحصول عليه , ويمكنك معرفة أي طريقة للتخزين تناسبك بشكلٍ أفضل عبر قراءة الإجابات الموجودة على السؤال التالي

الTemplate engines مثل handlebars عادةً ما يتم إستخدامها لسهولتها في الصفحات البسيطة التي لا يكون فيها تلاعب كبير بDOM وهذا لأن طريقة كتابتها والتعامل معها تكون أسهل من التعامل مع أكواد الجافاسكريبت والAjax , وخاصة عندما يكون الذي يتعامل هنا مُصمم وليس مُبرمج فيكون من الأسهل للمُصممين التعامل مع الوسوم الخاصة بhandlebars أو الTemplate engines بوجهٍ عام بدلًا من التعامل مع أكواد الجافاسكريبت ما الذي يجعلك تستخدم hbs عندما يكون في الفريق بعض الأشخاص الذي ليس لديهم معرفة كبيرة في التعامل مع جافاسكريبت تُريد فقط إنشاء بعض الصفحات البسيطة التي لا تحتاج إلى تلاعب كبير في DOM لا تريد إستخدام أطر عمل مثل React, angular ما الذي يجعلك لا تستخدمها عندما يكون التطبيق لديك يحتوي على تلاعب كثير بDOM عندما يكون هنالك تفاعل كبير بين المستخدم والموقع مما يجعلك تحتاج إلى كتابة javascript بشكلٍ كبير عندما تريد إستخدام أطر عمل مثل React.js, angular.js, vue.js

يوجد لديك مشكلتان لقد قمت بكتابة if(socketIO.instance ===null) بدل null ب undefined لأن في الحقيقة الكائن لم يتم إنشاؤه بعد فبالتالي هو غير مُعرف عند تصدير الكائن قم بتصديره على الشاكلة التالية export default socket.socket وهذا لأنك في الأعلى قمت بكتابة this.socket =io("") وبالتالي الكائن الذي سيرجعلك من Constructor لن يكون السوكيت وإنما سيكون كائن يحمل بداخله كائن أخر وهو السوكيت

المشكلة لديك في الخاصية pop حيث أنها لا تستقبل id وإنما تقوم بإستقبال قيمتين فقط إما -1 لتقوم بمسح أول عنصر في القائمة أو 1 لتقوم بمسح أخر عنصر في القائمة إن كنت تريد أن تحذف بإستخدام الid يمكنك إستخدام $pull بدلًا منها $pull:_id

يمكنك فعل المطلوب بإستخدام نوعية البيانات Buffer التي تُقدمها mongoose كما يتضح لنا في الشفرة القادمة var imageSchema = new mongoose.Schema({ name: String, img: { data: Buffer, contentType: String } }); var Image = mongoose.model('Image', imageSchema); حيث تُمثل الdata البيانات الموجودة في الصورة وتُمثل contentType نوع الصورة (png, jpg,...etc) ونقوم بإستقبال الصورة وليكن بإستخدام المُكون express-fileupload, فنقوم بعمل إستيراد له const fileUpload = require('express-fileupload'); ومن ثم نقوم بتمريره في الدالة التي نقوم فيها بعملية تخزين الصور كما يظهر في الشفرة router.patch('/upload', fileUpload(), async (req, res) => { const data = req.files.file.data const contentType = req.files.file.mimetype const img = await Image.create({data, contentType}) return res.status(201).send(''); }) ومن ثم يتم تخزين الصورة بنجاح

أها أعتذر لقد أسأت فهمكِ في البداية, في تلك الحالة من الأفضل عمل جدولين منفصلين أحدهما للعلاقة بين المؤسسة والحسابات والأخر بين البرنامج والحسابات, ولكن ستظل تلك علاقة واحد إلى كثير بما أن البرنامج يمكن أن يكون له أكثر من حساب ونفس الأمر بالنسبة إلى المؤسسة

في حالة عدم إجتياز الإمتحان سيتم إعطاؤك ملاحظات حول ما فعلته في الإختبار ويمكنك بعد ذلك الإمتحان في وقتٍ لاحق , ويمكنك الإستفسار بشكلٍ أكبر من خلال محادثة الدعم الفني

حسب ما فهمت أن لديكِ برامج ومؤسسات, لكلٍ منهما حسابات, ولكن حسابات البرامج لا يمكن أن توجد في حسابات المؤسسات, أليس ذلك صحيحًا؟

يمكن تلخيص الفروق بينهم كالتالي الstruct هو من نوع value-type بمعنى أنه لا يتم تخزينه ك reference مثل الclass ولكنه لا يمكن أن يمتلك constructor فارغ أو أن تكون أبًا لclass أخر, ويمكن إستخدامها بدون إستخدام كلمة new class هو من النوع reference type record يمتاز بأنه لا يمكن تغيير قيمة الخصائص بداخله إذًا ماذا تستخدم؟ عندما تريد أن تستخدم هيكل لتخزين بياناتك بداخله يجب أن تسأل الأسئلة التالية حتى تستطيع الإختيار بشكلٍ صحيح هل البيانات التي أريد أن أمثلها , بشكلٍ منطقي هي تمثل قيمة؟ على سبيل المثال كالشفرة المُرفقة بالأدنى struct Point { public int x, y; public Point(int x, int y) { this.x = x; this.y = y; } } في ذلك المثال نريد أن نُمثل نقطة, فلا داعي أن ننشئ لها صنف بل من الممكن أن نمثلها بstruct لأن في النهاية هي تُمثل قيمة واحدة حتى ولو كانت مُكونة من قيم أخرى هل مساحة البيانات أقل من 16 بايت؟ هل البيانات في أغلب الوقت لن يتم تغييرها؟ إن كانت الإجابة على الأسئلة السابقة نعم فإذًا إستخدم struct عدا ذلك قم بالإجابة على الأسئلة التالية هل الهيكل الذي تريده سيقوم بإحتواء مجموعة من البيانات المعقدة ولكن لا يُمثل شئ مميز بذاته؟ هل البيانات التي بداخل الهيكل لن نحتاج إلى تغييرها في المستقبل إن كانت الإجابة نعم يكون الإختيار record عدا ذلك يكون class

بما أن البرنامج له أكثر من حساب(لأنك قلتي حسابات) إذًا العلاقة واحد من البرنامج إلى كثير من الحسابات وفي الحالة التي ذكرتيها يمكننا جعل المفتاح الأجنبي الغير مستخدم بدون قيمة وسيكون بشكل إفتراضي بnull في حالة أنك قمتِ بعمل جدولين سيصبح الأمر معقدًا بعض الشئ حيث ستحتاجين أن تقومي بعمل check constraint بأن الحساب غير موجود في الجدول الأخر, و لا يمكنك أن تقومي بمناداة الجدول الأخر في الcheck constraint إلا عبر الدوال المُعرفة من قِبل المُستخدم user-defined-functions مما سيجعلك تضطرين أن تقومين بجهد زائد وسيزيد أيضًا من تعقيد هيلكية قاعدة البيانات لذا من الأفضل عمل جدول واحد للربط وجعل قيمة المفتاح الأجنبي الغير مستخدم بnull

إذًا يكون الحل هو الحل الأول أن يتم عمل جدول واحد يحتوي على الحسابات ومُعرف البرنامج أو المؤسسة, بتلك الطريقة نضمن أنه لا يمكن لبرنامج أو مؤسسة الحصول على نفس الحساب لأن بكل بساطة الحساب نفسه موجود في نفس الجدول وسيكون نادر ولا يمكن أن يتكرر مرتين بالإضافة إلى أن هنا يكون العلاقة بين الحساب والبرنامج أو الحساب والمؤسسة many to one

للإجابة على هذا السؤال يجب توفير بعض المعلومات هل لكل برنامج او مؤسسة عدة حسابات ولكن لا يتكررو لكل جدول, بمعنى ان يمكن للبرنامج أن يحمل عددًا من الحسابا ونفس الأمر للمؤسسة ولكن لا يمكن لمؤسسة أن تحتوي على حساب موجود في برنامج؟ في هذه الحالة من الأفضل إنشاء جدول واحد يربط بين الحسابات وبين البرنامج أو المؤسسة هل يمكن للمؤسسة أن تحتوي على حساب موجود في برنامج أو العكس ولكن لا يمكن لمؤسستين أو برنامجين أن يحتوا على نفس الحساب؟ في هذه الحالة ننشئ جدولين أحدهما بين الحسابات والبرنامج والأخر بين الحسابات والمؤسسة

بوجهٍ عام لا يُفضل تخزين الصور على هيئة تشفيل 64 بيت (base 64 encoding) وذلك لأن هذا النوع من التشفير يزيد من حجم الصورة بما يُقارب ال33% وبالتالي سيتم تخزين 33% زيادة في قاعدة البيانات وبالتالي ستُصبح عمليات القراءة والكتابة من قاعدة البيانات أبطأ مع العلم أن قاعدة البيانات في الغالب تخزن البيانات في القرص الصلب والذي هو بمثابة عنق الزجاجة في الحوسبة حيث أن عمليات القراءة والكتابة في القرص الصلب في غاية البطؤ مقارنةً بالذاكرة العشوائية لذلك من الأفضل تخزين البيانات في القرص الصلب بأقل مساحة ممكن والقيام بأي عمليات في الذاكرة العشوائية.

لنأخذ مثال حتى نفهم الأمر بشكلٍ جيد, سنضع تلك الشفرة البرمجية مثال لنا function Page() { const [a, setA] = useState(0); ... return ( ... <Button onChange={() => { doSomething(a); }} /> ); } عند حدوث أي تغيير في المكون page يسبب re-render كتغيير قيمة a على سبيل المثال سيتسبب هذا بعمل re-render أيضًا للمكون Button وذلك بسبب أن الدالة doSomething في كل مرة سيتم معاملتها على أنها قيمة جديدة وبالتالي يقوم المكون Button بإعتبار أن أحد props الخاصة به تغيرت وبالتالي يقوم بعمل re-render بينما إن قمنا بتعديل الشفرة لتصبح على النحو التالي function Page() { const [a, setA] = useState(0); const onButtonChange = useCallback(() => {doSomething(a);}, []); ... return ( ... <Button onChange={onButtonChange} /> ); } عندما يحدث re-render للمكون Page في كل مرة سيتم إعتبار أن الدالة onButtonChange لم تتغير وبالتالي لن يتم عمل re-render للمكون Button إلا في حالة تغير أحد الوسائط التي تم تمريرها في المصفوفة التي مُررت في المعامل الثاني للدالة useCallback بينما useMemo تقوم بتخزين ناتج إرجاع الدالة ونقوم بإستخدامها في حالة كان الدالة تقوم بعملية ثقيلة وتأخذ وقت أو تستهلك موارد وبالتالي في كل مرة نقوم بنداء الدالة لن يتم تنفيذها بل يتم إرجاع قيمة إرجاعها المخزنة بالفعل إلا في حالة تغير أحد المعاملات التي نقوم بوضعها في المصفوفة الممررة للمعامل الثاني للدالة useMemo , على سبيل المثال الشفرة التالية const doHeavyCalc = ()=>{//some calculations} في كل مرة نقوم بنداء تلك الدالة سيتم عمل عمليات ثقيلة بينما إن قمنا بكتابتها على النحو التالي const doHeavyCalc = useMemo(()=>{//some calculations} ,[a]) في تلك الحالة لن يتم مناداة الدالة doHeavyCalc إلا في حالة أن تغيرت أحد المعاملات الممررة لمصفوفة الuseMemo والتي في حالتنا هنا المتغير a, عدا ذلك سيتم إرجاع قيمة الدالة المُخزنة بالفعل

إن عملية serialization ليست مقتصرة على لغة c# أو على أي لغة بوجه عام وإنما هي تعني مفهوم في الحوسبة بوجهٍ عام لتفهم معنى serialization دعنا نناقش المثال التالي: نفترض أن لديك هيكل بيانات عبارة عن Linked-list أي عبارة عن مجموعة من العناصر كل عنصر يحمل معلومتين, أول معلومة هي قيمة العنصر نفسه والمعلومة الثانية هي عنوان العنصر التالي في الذاكرة نفترض الأن أنك أردت إرسال تلك البيانات إلى خادم عبر الشبكة أو تخزينها في قاعدة بيانات أو تخزينها في القرص الصلب, ستقابلك مشكلة مهمة مشكلة الذاكرة كما ذكرنا سابقًا فإن العناصر هنا تحمل بيانات عن أماكن العناصر الأخرى في الذاكرة, ولكن عندما تقوم بنقل تلك العناصر خارج الذاكرة(في القرص الصلب, قاعدة بيانات, عبر الشبكة) سيكون وقتها لا يوجد معنى لتلك البيانات لأنها ببساطة لم تصبح موجودة على الذاكرة, الحل هنا أن نقوم بتحويل تلك البيانات إلى صورة يمكن فهمها خارج الذاكرة على سبيل المثال تحويلها إلى بيانات json أو xml , وتلك العملية تُسمى serialization