لوحة المتصدرين

ما هو الافضل لتقسيم الموقع grid او flex

لكل منهما وظيفة يتميز بها، بشكل عام الفرق بينهما كالتالي: Flex: تستخدم لتنسيق تموضع العناصر معًا على نفس المحور، أي بشكل أفقي أو بشكل عمودي Grid: تستخدم لتنسيق تموضع العناصر على بعدين أفقي وعمودي معًا، حيث يمكن تحديد مساحات معينة تضع فيها عنصر ما في حال كان المطلوب هو تنسيق عدة عناصر على الصفحة كاملة، Grid تعد الخيار الأنسب، أما في حال كانت العناصر بسيطة ومطلوب تنسيقها على محور واحد Flex تكون مناسبة في هذه الحالة، يمكنك الاستفادة من قراءة المقالات التالية:

نعم يمكنك رفع اكثر من مشروع على مجلد واحد لكن لا ينصح بذلك. لكن يمكن عمل list تحتوي المشاريع الخاصة بالـ Flutter بحيث يمكنك الوصول إليهم بسهولة. ويكون ذلك بالطريقة التالية : قم بالدخول إلى حسابك على GitHub ثم انقل إلى repositories كما في الصورة بعد ذلك قم بعمل list جديدة خاصة بك عبر النقر على السهم جانب المشروع ثم النقر على إشارة create list : ثم قم بإدخال اسم ال list و الوصف وانقر على create الآن قم بإضافة المشاريع الخاصة بال Flutter إلى هذه ال list كما في الصورة : يمكنك الوصول لل list الخاصة بك ومعاينة المشاريع من خلال الذهاب للقائمة Stars :

لدي ثلاثة أصناف Classes وكلُ منهم يحتوي على تابع باني constructor على النحو التالي: class GrandFather { public function __construct() { // .. } } class Father extends GrandFather { public function __construct() { // call GrandFather's constructor parent::__construct(); } } class Son extends Father { public function __construct() { // أريد إستدعاء التابع الباني الخاص بالصنف GrandFather هنا // بدون تشغيل التابع الباني الخاص بالصنف Father } } أريد إستدعاء التابع الباني الخاص بالصنف GrandFather من داخل الصنف Son، ولكن بدون تشغيل التابع الباني الخاص بالصنف Father هل هناك طريقة للقيام بهذا الأمر؟

كيف يمكنني اضافة هذه الصور للقسم في css و تكون متجاوبة مع احجام الشاشات

<button data-gh="go" data-id="div">go</button> <button data-gh="go" data-id="div2">go2</button> <div id="div" style="display:none"> <h2>Hello World</h2> </div> <div id="div2" style="display:none"> <p>welcome to the chat </p> </div> <script> var tag = document.querySelectorAll('[data-gh="go"]'); //تحديد جميع العناصر التي تحمل السمة data-gh="go" tag[0].onclick = function(){ document.getElementById(tag[0].dataset.id).style.display="block"; } tag[1].onclick = function(){ document.getElementById(tag[1].dataset.id).style.display="block"; } </script> لدينا في الكود عدد اثنين ازرار يشتركان معا في السمة data-gh="go" ويختلفان في قيم السمة data-id ولدينا عدد اثنين div مخفيان ، يتم اظهار كل div عند الضغط على الزر الخاص به بالنسبة لكود جافا سكربت فقد قمت بتحديد الزرين بواسطة هذا الامر var tag = document.querySelectorAll('[data-gh="go"]'); ويعتبر المتغير tag مصفوفه وهذا الشي يعرفه كل محترغي جافا سكربت اما هذا الامر tag[0].onclick = function(){ document.getElementById(tag[0].dataset.id).style.display="block"; } فيقوم بعمل حدث الضغط على احد الازرار ثم تشغيل داله لتقوم باظهار الdiv المخفي السؤال انا قمت بعمل الكود يدويا كل زر بكود وحدث خاص به. ماذا لوكان لدينا العديد من الازرار تقوم بنفس المهمه، ايس من المنطقي ان اعمل لكل زر حدث وكود، هل يوجد طريقه لجعل الامر غير يديوي، فيكون لدي كود واحد يتعمل مع جميع الازار رلو كان عددها الف زر، عملت حلقة تكرار ولكنها فشلت فما الحل

ازاي احط صوره في ال readme.md في الgithub repo

قمت بأعطاء ال NAV-BAR قيمة Position : fixed و قامت جميع العناصر بالارتفاع في مكان ال nav bar وقمت بأعطائهم margin-top هل هذه هي الطريقه الصحيحه في جعل grid ينزل عن ال nav- bar ام لا و شكرا css

نعم الطريقة صحيحة. عند إعطاء أي حاوية أو عنصر الخاصية Position : fixed سوف ينفصل عن مستوى صفحة HTML أي تعتبر أن له طبقة مختلفة، وسوف يحل محله العنصر التالي في ترتيب صفحة HTML وبذلك لنحافظ على ظهور العنصر الذي أسفله، نقوم بعمل إزاحة من الأعلى من خلال الخاصية margin-top لتبتعد عن الجزء العلوي للعنصر body (الحافة الداخلية) حيث أصبح هذا العنصر هو الذي يسبق باقي أجزاء الصفحة و ليس العنصر ذو Position : fixed، أي سوف ينزلق أسفله، و بذلك نعيده لمكانه بعمل إزاحة من الأعلى. موسوعة حسوب position#fixed

يعطيك العافية اخي قمت بحل المشكلة .. فقط قمت بإضافة هذه الشيفرة window.gapi.load('client:auth2', () => { window.gapi.client.init({ clientId: '****.apps.googleusercontent.com', scope: "email", plugin_name: 'App Name that you used in google developer console API' //اسم عميل OAuth 2.0 الخاص بك }) })

نعم هذه طريقة صحيحة. في عالم ال css والبرومجة عموما هنالك الكثير من الطرق التي تعطي نفس النتيجة، على سبيل المثال انظر كيف تعامل مصممي موقع حاسوب مع نفس هذه المشكلة. حيث قاموا بإضافة padding-top لل body. بينما المصممين لموقع ترجمة جوجل قاموا بإضافة div فارغ واعطوه ارتفاعاً معين ليدفع المحتوى نحو الاسفل في الطبقة الاساسية بينما يغطيه ال header من الامام في الطبقة الامامية.

اقدر ارفع مثلا 20 مشروع فلاتر مثلا ع جيت هاب بس كلهم يكونوا ف فولدر واحد بحيث لو عاوز ارفع مشاريع غير فلاتر ميبقاش كله داخل ف بعضه

يمكن دفع المشاريع التي هي من نفس النوع بطريقة بسيطة، وهي أن تكون هي نفسها في مجلد واحد في حاسوبك المحلي، سوف تقوم بإنشاء المستودع لمشاريع فلاتر في مجلد Flutter، و في حاسوبك يكون كل المشاريع ضمن مجلد واحد، ثم تقوم بدفع مجلد Flutter لمستودع غيت هاب. Projects Flutter Flutter_1 Flutter_2 Flutter_3 Laravel Laravel_1 Laravel_2 Laravel_3 لكن الأفضل هو وجود مستودع لكل مشروع منفضل، يمكنك لاحقا ضمن غيت هاب GitHub عمل فلترة لنتائج البحث وجلب المشاريع التي هي من نفس النوع، لأن وجود مستودع لجميع المشاريع هو أمر خطر و غير محبذ. حذف مشاريع عن طريق الخطأ بطيء في عمليات دفع و سحب التعديلات لأن المستودع يصبح ضخم و كبير حيث أن حلول دفع عدة مشاريع لنفس المستودع تكون بتسميه فرع مختلف لكل منهم و ممكن عن طريق الخطأ دفع ملفات من مشروع لآخر.. في حال عمل عدة مستودعات محلية (لكل مجلد مشروع) يمكنك دفعهم لنفس المستودع مع تغيير الاسم # repo 1 git push origin Flutter:Flutter-1 # repo 2 git push origin Flutter:Flutter-2 # repo 3 git push origin Laravel:Laravel-1 # repo 4 git push origin Laravel:Laravel-2 وهو شيء لا أنصح به

المشكلة على ما يبدو انك اعطيت ال header : header { position: fixed; /* المشكلة هنا */ width : 100% } وهذا يجعله في طبقة منفصلة في الامام. للتغلب على هذه المشكلة بإمكانك إعطاء الـ <section class="content"> <div class="phone"> <p class="phone_des">Lorem, ipsum dolor sit amet consectetur adipisicing elit. Adipisci nostrum harum voluptatem est odit, error, corporis blanditiis ad, dolorem laudantium aliquam libero soluta necessitatibus. Rerum dolorem ab porro distinctio et eius iure! Laudantium sint doloribus, officiis vel sequi quaerat, recusandae sunt ratione asperiores ipsam similique placeat est eum at voluptatum accusantium delectus omnis voluptatem ea explicabo qui. Sint inventore fuga dolor consequuntur amet eius provident nobis officiis nam doloremque doloribus modi, tempora excepturi? Cumque nostrum perspiciatis eligendi iusto dicta dolores tempore delectus accusantium harum! Placeat, sequi, blanditiis incidunt error dignissimos optio repudiandae enim eaque eius facilis inventore eos nulla laborum.</p> <img class="phone_img" width="250px" src="photos/phone.png" alt="noIMg"> </div> </section> margin-top يوافق طول ال header بالشكل التالي : .content{ margin-top: 100px; } واعطاء ال header خاصية ال top = 0 حيث يصبح : header { position: fixed; top: 0; /* التصحيح */ width: 100%; } فيصبح الشكل النهائي كالتالي ملف ال css بعد التعديل : style.css

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

لاحظت مشكلتين بالكود الذي شاركته الاولى أنك تقوم بجلب العناصر ووضعهم في المتغير arrayOfTasks لكن لا تقوم بتشغيل الوظيفة المسؤولة عن العرض readFn. if (window.localStorage.getItem("array")) { arrayOfTasks = JSON.parse(window.localStorage.array); } ولكن الصحيح ان يكون بالشكل التالي : if (window.localStorage.getItem("array")) { readFn(); } والمشكلة الثانية انك تقوم بإضافة كل العناصر الموجودة في ال localStorage مرة ثاني عند كل اضافة لعنصر جديد بحيث يحدث تكرار للعناصر المضافة مسبقاً، والصحيح ان تمسح محتويات ال outputList قبل إضافة العناصر حتى لا يحدث هذا التكرار ويكون بالشكل التالي : function readFn() { // نقوم بتفريغ القائمة outputList.innerHTML = ""; // ثم نقوم بإضافة كل العناصر الموجودة بالمصفوفة لتجنب التكرار let arrayOfTasks = JSON.parse(window.localStorage.getItem("array")); arrayOfTasks.forEach((task) => { let li = document.createElement("li"); let span = document.createElement("span"); span.appendChild(document.createTextNode("delete")); li.appendChild(document.createTextNode(task.title)); li.appendChild(span); outputList.appendChild(li); }); } لتحميل الحل من هنا : fix.js

نص المشكلة التي ظهرت عندي : كما تعلم يجب ان تقوم بتسجيل الدومين الخاص بموقعك وكذلك عنوان صفحة تسجيل الدخول في اعدادات Authorized JavaScript origins. قم بوضع العنوان الذي تستخدمه والذي يجب ان يكون يشبه التالي اذا كنت تستخدم رياكت : http://localhost:3000 ويشبه التالي اذا كنت لاتستخدم اي مكتبات وتقوم بالتشخير عبر live server : http://127.0.0.1:5500/index.html كما هو موضع في الصورة h إذا كنت متأكد من كل ما سبق فقم بحذف المشروع من google auth2 ثم قم بإعادة انشاءه.

قم بمشاركة رابط احد المقالات التي تعطيك هذه المشكلة

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

جرب استخدام أحد برامج VPN قد يكون الموقع أو الخدمة محظورة في بلدك

يمكنك عمل الكثير من الأشياء لزيادة مستواك ولتعلم المزيد من التقنيات، هنا بعض منها: قم بتطوير مشاريعك السابقة حاول أن تقوم بفتح أحد مشاريعك السابقة، وقم بتطويره، مثلًا قمتَ بعمل تطبيق To-Do، ويمكن إضافة المهام فيه، حاول تعديله وأضف له بعض المميزات الأخرى مثل إمكانيه إضافة وقت محدد لإنهاء المهمة Deadline أو أضف إمكانيه تحديد نوع أهمية كل مهمة (مهم، عاجل، عادي، غير مهم .. إلخ) وإمكانية ترشيح (فلتره) المهام Filter للوصول إلى المهام التي تندرج تحت تصنيف معين أو لها درجة أهمية معينة (مهم، عاجل، عادي، غير مهم .. إلخ). أيضًا إن لم يكن المشروع متجاوب Responsive حاول تعديله ليصبح متجاوب على كل الشاشات. يوجد الكثير من الأمور التي يمكنك عملها في كل مشروع، فأي فكرة يمكن تطويرها لشيء أفضل. تقليد المواقع الشهيرة أو التي تستعملها بكثيرة أن كنت تستعمل مواقع التواصل بشكل كبيرة أو أي موقع آخر، فيمكنك محاولة تقليد واجهة الموقع، وبالتالي تتدرب على واجهة موقع حقيقي، وذلك سيحسن من مهارتك وسيجعلك تواجهة تحديات أكبر، وستواجهة مشاكل أثناء هذه العملية ويجب أن تبحث عن حلول لهذه المشاكل، وكنتيجة لهذا الأمر سوف تتعلم تقنيات جديدة وسوف ترى نقاط القوة ونقاط الضعف لديك،و يمكنك تحسينها بعد ذلك. حل التحديات البرمجية يوجد الكثير من المواقع التي تقدم تحديات ومسائل برمجية، وتتدرج هذه المشاكل في صعوبتها (سهل، متوسط، متقدم .. إلخ)، حل هذه المسائل سوف يزيد من قدرتك على تطوير مشاريع أكثر تعقيدًا وسوف تستطيع حل المشاكل التي تواجهك أثناء العمل على مشاريع بشكل أسرع وأسهل، كما أن هذه التمارين سوف تزيد من فهمك لغة البرمجة التي تستعملها مما يزيد من مهاراتك بشكل عام. قد يكون حل المشاكل صعبًا في البداية، ولكن مع كل مشكلة تقوم بحلها سوف تتعلم شيء جديد أو تتعرف على تقنية مختلفة، ومع مرور الوقت سوف يكون بإمكانك حل أغلب المشاكل بسهولة. أشهر المواقع التي تقدم عدد كبير من المسائل البرمجية هنا قائمة ببعض المواقع التي تقدم مسائل برمجية، بعض هذه المواقع يتطلب التسجيل فيها أولًا لتتمكن من الوصول إلى المسائل: Coderbyte Project Euler HackerRank CodeChef Codewars LeetCode

لا ولا مرة اشتغل هاد الerror ظهر من اول محاولة للاسف عملت ورجعت لكن ما اشتغل اسفة على الازعاج مهندس

أيه على أساسيات قواعد البيانات أصبحت من الذكريات