لوحة المتصدرين
المحتوى الأكثر حصولًا على سمعة جيدة
المحتوى الأعلى تقييمًا في 02/28/21 في كل الموقع
-
يمكنك أن تستعمل صور SVG لأنها تتمدد إلى أي حجم دون أن تفقد جودتها، لذلك مهما كان حجم الموقع أو الشاشة المعروض عليها فلن تتأثر الصورة. يوجد العديد من المواقع التي تقدم صور SVG مجانية مثل: storyset و flaticon، كما يمكن أن تستعمل برامج مثل Adobe Illustrator لعمل شعارك الخاص (يفضل أن توظف مصمم محترف لعمل الشعار) أو التعديل عليه. هذه المدونة تستهدم صورة عادية بصيغة png ولكن حجمها كبير للغاية (رابط الصورة)، وبالتالي يتم تصغيرها إلى الحجم المطلوب بإستخدام CSS و خاصية media query (خاصية في CSS أيضًا).2 نقاط
-
مرحباً بك : strictMode: هي أداة لتتبع الأخطاء عن طريق إضافة بعض الفحوصات الإضافية الخاصة بها لمكون معين وأبناءه ومثلها مثل ال Fragment لا تؤثر على ال UI فقط تتبع الأخطاء import React from 'react'; function ExampleApplication() { return ( <div> <Header /> <React.StrictMode> <div> <ComponentOne /> <ComponentTwo /> </div> </React.StrictMode> <Footer /> </div> ); } في المثال السابق لن يتم عمل فحوصات إضافية ل ( Header - Footer ) أما ال ComponentOne - ComponentTwo ومحتوياتهم سيتم فحصهم مثال لما يتم فحصه: 1. التأكد من عدم استخدام ال ( UNSAFE_life cycly hooks ) مثل ( UNSAFE_componentWillReceiveProps - UNSAFE_componentWillMount - UNSAFE_componentWillUpdate ) 2. التأكد من عدم استخدام string ref 3. التأكد من عدم استخدام عناصر منتهية مثل ( findDOMNode ) 4. التأكد من عدم استخدام old context API هذه التحذيرات فقط تظهر آثناء التطوير ( development ) وليس ال production2 نقاط
-
اتقبل النقد ويسعدني اخد النصائح منكم لتطوير نفسي اكثر
1 نقطة -
كيف اصمم شعار لموقعي متجاوب وبالمقاس الصحيح مثل هذه المدونة؟1 نقطة
-
يمكنك أن تنشأ خطاف لاحتواء المنطق الذي يتعامل مع البيانات بهذه الطريقة import { useState, useEffect } from 'react'; import axios from 'axios'; const useData = () => { const [data, setData] = useState(); useEffect(() => { function getData() { axios.get('http://localhost:5000/posts').then((res) => { setData(res.data); }); } getData(); }, []); return data; }; export default useData; ويمكنك استيراده في المكون وهكذا سيكون الكود نظيف ودقيق وهذا مثال بسيط فقط بل يمكنك أن تذهب خطوة الى الامام وتجعل useData دينامكيا عن طريق الشروط والمعايير وتستخدمها في كل المكونات التي تحتوي على منطق يتعامل مع البيانات import React from 'react'; import useData from './useData'; export default function App() { const data = useData(); return ( <div> {data && data.map((post) => ( <div key={post.id}> <h1>{post.title}</h1> <p>{post.description}</p> </div> ))} </div> ); }1 نقطة
-
أريد أن أعرف كيف أقوم بتوسيط div بداخل div آخر باستخدام Css؟ <div class="a"> <div class="b">asdasd</div> </div>1 نقطة
-
هناك العديد من الطرق لتوسيط div بداخل div, لنستعرض معا البعض منها الطريقة الأولى: نقوم بإعطاء div الداخلي width معين مثلا 50% ومن ثم نعطيه خاصية margin كما هو موضح في الكود الآتي .b{ width: 50%; margin: 0 auto; } عند اعطاء هذه الخصائص لل div الداخلي سوف يتوسط بداخل div الخارجي وسوف تكون النتيجة بهذا الشكل الطريقة الثانية: نستخدم خاصية table حيث نعطي عنصر div الداخلي هذه الخصائص .b{ display: table; margin: 0 auto; } سوف تكون النتيجة بهذا الشكلالطريقة الثالثة: سوف نستخدم خاصية flexbox لتوسيط ال div الداخلي بداخل ال div الخارجي, لاحظ لو سمحت الكود الآتي .a{ border:1px solid #f00; display: flex; justify-content: center;//لتوسيط المحتوى padding: 20px; } لاحظ أعطينا الdiv الخارجي خاصية display: flex; ومن ثم ثم قمنا بتوسيط المحتوى الذي بداخله سوف تكون النتيجة مشابهة لنتيجة الطريقة الثانية
1 نقطة -
يوجد العديد من الطرق، وذلك يعتمد على النمط الذي تقوم باستخدامه في العرض Flex أو Grid أو حسب توزع العناصر ضمن الصفحة. ولكن أسهل طريقة في حال لم تكن تستخدم بنية محددة ولسرعة التوسيط يمكنك استخدام margin: auto مثال: <!DOCTYPE html> <html> <head> <style> .center { margin: auto; width: 60%; border: 3px solid #73AD21; padding: 10px; } </style> </head> <body> <div style="background-color:yellow"> <div class="center">Hello World!</div> </div> </body> </html> وستحصل على النتيجة التالية: وكذلك margin-left: auto و margin-right: auto معاً لنفس العنصر. أما لتوسيط عنصر نصّي نستخدم text-align مع القيمة center كالتالي: .center { text-align: center; } وسيتم توسيط النص ضمن العنصر الحاوي له.
1 نقطة -
إن الاختبار يتم بتفيذ الأمر مباشرةً ورؤية النتائج: php artisan schedule:run ولكن في حال كان الهدف هو طباعة رسائل الخطأ المخصصة في حالات معيّنة، فإن scheduler لا يقوم بالطباعة بطبيعته، ولكن يمكنك توجيه الطباعة للكود الذي يتم تنفيذه لأي ملف آخر عن طريق استخدام: writeOutputTo() أو: appendOutputTo() وهو مايعرف في TaskOutput في التوثيق الرسمي للارافيل، مثال: $schedule->command('emails:send') ->daily() ->sendOutputTo($filePath); حيث نستبدل $filepath بمسار الملف الذي نريد الطباعة عليه. أما لإجراء Unit Test للعمل بشكل مخصص أكثر، فيمكن إضافة التالي ليتم اختبار schedule محدد مثل الكود السابق لديك: public function testIsAvailableInTheScheduler() { /** @var \Illuminate\Console\Scheduling\Schedule $schedule */ $schedule = app()->make(\Illuminate\Console\Scheduling\Schedule::class); $events = collect($schedule->events())->filter(function (\Illuminate\Console\Scheduling\Event $event) { return stripos($event->command, 'NewCommand'); }); if ($events->count() == 0) { $this->fail('No events found'); } $events->each(function (\Illuminate\Console\Scheduling\Event $event) { // This example is for hourly commands. $this->assertEquals('0 * * * * *', $event->expression); }); }1 نقطة
-
برنامج لاختبار العدد x فيما إذا كان أولي أم لا, بلغة c++ . من فضلكم.1 نقطة
-
أولا ما هي الأعداد الأولية؟ هي أي عدد أكبر من 1 وتقبل القسمة على عددين هما 1 و العدد نفسه. كيفية التأكد من باقِ القسمة في ++C؟ (يقبل العدد X القسمة على Y إذا كان باقِ قسمته مساوياً للصفر) mod => % x % y = z 4 % 2 = 0 5 % 2 = 1 .. لاختبار العدد فيما إذا كان أولي أم لا علينا التأكد من أنه لا يقبل القسمة على أي عدد ضمن المجال من 2 إلى العدد نفسه - 1 bool isPrime(int x) { for (int i=2; i < x ;i++){ if (x % i == 0){ // يقبل القسمة return false; // غير أولي } } return true; // عدد أولي لأنه لا يوجد عدد يقبل القسمة عليه } يمكنك استدعاء هذه الدالة في البرنامج الرئيسي الدالة Main وتمرير القيمة X بعد إدخالها من المستخدم بتعليمة cin أو استخدام نفس المنطق ضمن الدالة main مباشرة1 نقطة
-
أريد أن أضيف خاصية لمكون react لدي وفقًا لشرط، فمثلًا أريد أن أحذف الخاصية disable إن كان المتغير name يحتوي على قيمة. كيف أقوم بذلك؟ const InputComponent = function() { const name = "My Name"; return ( // في هذا الجزء أريد أن يتم حذف الخاصية disable لأن المتغير name يحتوي على قيمة <input type="text" disabled /> ); }1 نقطة
-
يمكنك تحديد ما إذا كان سيتم إضافة هذه الخاصية أم لا من خلال إضافة المتغير name نفسه ققيمة لها، React ذكي بما فيه الكفاية ليقوم بحذف الخاصية إن كانت تساوي false const InputComponent = function() { const name = "My Name"; return ( // بهذا الشكل لن تظهر الخاصية disable <input type="text" disabled={!name} /> ); } في المثال السابق يتم إعتبار نتيجة الشرط تساوي false لأن المتغير name يحتوي على قيمة، وبهذا لن يتم إضافة الخاصية disabled للعنصر input.1 نقطة
-
في حالتك يمكن حل المشكلة كاﻵتي: const InputComponent = function() { const name = "My Name"; return ( <input type="text" disabled={name !== undefined && name !== null} /> ); } بهذا حين يكون للـname قيمة ستكون خاصية disabled تساوي true، قد تقول "لكن المتصفح يقوم بعمل disable للـinput لمجرد وجود الخاصية"، لا تقلق بشأن ذلك ﻷن React لا يضيف الخاصية البوليانية إلا إذا كانت true. أما حين تريد حذف أو تمرير خاصية غير بوليانية يمكن اللجوء للطريقة التالية: const InputComponent = function() { const isNumberInput = true; return ( <input type="text" pattern={isNumberInput ? "[0-9]+" : undefined} /> ); } عند إسناد undefined لخاصية فإنها لا تضاف للـHTML وكأنها لم تمرر1 نقطة
-
يمكنك ذلك من خلال استخدام التصير الشرطي في React حيث توفر لك React مثل هذه الميزة لكي تستطيع بسهولة عمل رندرة للشيفرة البرمجية بحسب شرط معيًا. يمكنك استخدام هذه الطريقة في حال كان لديك prop قادم من مكون أخر غير المكونالذي تعمل عليه أو قادم من قاعدة البيانات. فمثلًا يمكنك استخدام هذه الطريقة لكي تعمل التصير الشرطي للشيفرة. باستخدام props الذي قادم من مكون اخر: const function InputComponent({name}) { if(name == null){ return ( // في حال كان هنالك اسم سوف يستطيع ادخال الاسم <input type="text" /> ); } } else { return ( // في حال كان الأسم موجود سوف يكون قيمة المدخل الاسم القادم <input type="text" value={name} disabled /> ); } بهذه الطريقة حسب الـ prop القادم إلى المكون سوف تصبح بنية المكون الجديد. أتمنى لك التوفيق.1 نقطة
-
يوجد نقص في بعض التعاريف في الملف، فيجب التأكد من تعريف ملف bootstrap بشكل صحيح وربطه ضمن kernel التطبيق قبل البدء بإجراء أي task، مثال شامل: @servers(['localhost' => '127.0.0.1']) @setup define('LARAVEL_START', microtime(true)); $app = require_once __DIR__.'/bootstrap/app.php'; $kernel = $app->make(Illuminate\Contracts\Console\Kernel::class); $kernel->bootstrap(); dump(config('database')); @endsetup @task('new', ['on' => 'localhost']) ls @endtask وبمجرد الدلالة على bootstrap ضمن kernel و إضافة Laravel_START لا داعي لإدخال ملفات vendor فسيتم اعتمادها بشكل تلقائي. ثم تأكد من إجراء العمليات التالية لتجنّب أي مشاكل: php artisan config:clear php artisan cache:clear composer dump-autoload php artisan view:clear php artisan route:clear1 نقطة
-
يمكن إجراء تنفيذ scripts بداخل الاختبار، ولكنها يجب ألا تكون متتالية. بل يجب تعريف كل جزء على حدى، مثال: public function testExample() { $this->browse(function ($browser) { $browser ->visit('http://localhost:8000/home') ->driver->executeScript('window.scrollTo(0, 500);'); // browser لا يمكن إجراء أوامر أخرى هنا مباشرةً يجب تعريف غرض جديد من $browser->click('label[for=test_1]') ->pause(500) }); } حيث قمنا باستخدام الدالة window.scrollTo، في حال كنت تستخدم نسخة أقدم من لارافيل، يمكنك استخدام jquery لتنفيذ ذلك: public function scrollTo($selector) { $this->ensurejQueryIsAvailable(); $selector = $this->resolver->format($selector); $this->driver->executeScript("jQuery(\"html, body\").animate({scrollTop: jQuery(\"$selector\").offset().top}, 0);"); return $this; }1 نقطة
-
طبعًا، إن موقع GoNative يسمح لك بتحويل قوالب الويب العادية إلى تطبيق موبايل أيً كان الموقع. فقط الأهم أن يكون متجاوب مع الشاشات الصغيرة. فموقع GoNative فقط يقوم بتحويل موقع الويب نفسه إلى شاشة تطبيق. وهذا مايقوم به بالضبط. ويكون جميع اتصاله بالموقع نفسه وإن أي تحديث على موقعك سوف ينعكس مباشرة على التطبيق الذي قمت به.1 نقطة
-
مرحبًا @علي العبدالله، إن استخدام مثل هذه المواقع هو الخير الثاني للمبرمج، فإن كان المبرمج لايستطيع كتابة كود البرنامج الخاص به من الصفر باستخدام React Native أو لايملك الوقت الكافي ﻹعادة كتابة أكواد صفحة الويب الخاصة به، فقد يلجئ لمثل هذا الموقع الذي يقوم بتحويل موقع الويب إلى تطبيق جاهز. وهو يسهل عليك العمل كثيرًا فكل ماعليك هو وضع رابط موقع الويب ومن ثم القيام ببعض التعديلات بالموقع ليصبح تطبيقك جاهز. وطبعًا يجب أن يكون موقع الويب الذي تقوم بتحويله مناسب للشاشات الصغيرة. لكن طبعًا هذا يصلح فقط للصفحات البسيطة وغير المعقدة جدًا، أما في حال المشاريع المعقدة فمن الأفضل كتابة التطبيق باستخدام Native من الصفر. وإن كنت تود شرح مفصل عنه فالأفضل مراجع التوثيق الخاص به من الصفحة الرسمية لموقع GoNative من الرابط هنا.1 نقطة
-
اريد كود لوضع صورة خلفية لواجهة المستخدم بايثون بيثون - برمجة واجهة المستخدم الرسومية (Tkinter)1 نقطة
-
مرحبًا @محمد عبدالله رضي، إن المتحكم Arduino عبارة عن منصة مفتوحة المصدر تتكون من أجهزة وبرامج تتيح التطور السريع لمشاريع الإلكترونيات التفاعلية. يستخدم Arduino لغة برمجة خاصة به، وهذه اللغة تشبه إلى حد كبير ++C. ومع ذلك فيمكنك استخدام Arduino مع Python أو لغة برمجة أخرى عالية المستوى. في الواقع، تعمل منصات مثل Arduino بشكل جيد مع Python، خاصة للتطبيقات التي تتطلب التكامل مع أجهزة الاستشعار والأجهزة المادية الأخرى. الخطوات لكتابة أكواد Python في Arduino: قم بإنشاء الدارة الإلكترونية التي تريد برمجتها. قم بإعداد بروتوكول Firmata على Arduino. اكتب التطبيقات الأساسية لـ Arduino في Python. قم بالتحكم في المدخلات والمخرجات الخاصة بـ Arduino. قم بدمج مستشعرات Arduino مع التطبيقات عالية المستوى. وللقيام بمشروع صغير باستخدام بيثون في أردوينو يمكنك مراجعة التوثيق الخاص بـ Real Python حول أردوينو من الرابط هنا. أتمنى لك التوفيق.1 نقطة
-
يستخدم Arduino لغة البرمجة الخاصة به ، والتي تشبه C ++. ومع ذلك ، من الممكن استخدام Arduino مع Python أو لغة برمجة أخرى عالية المستوى. في الواقع ، تعمل منصات مثل Arduino بشكل جيد مع Python ، خاصة للتطبيقات التي تتطلب التكامل مع أجهزة الاستشعار والأجهزة المادية الأخرى. بشكل عام ، يمكن لـ Arduino و Python تسهيل بيئة تعليمية فعالة تشجع المطورين على الدخول في تصميم الإلكترونيات. إذا كنت تعرف بالفعل أساسيات Python ، فستتمكن من بدء استخدام Arduino باستخدام Python للتحكم فيه.1 نقطة
-
مرحباً @آية جمال سالم و عليكم السلام: يمكنكِ الاستفسار عن ذلك عن طريق التواصل مع مركز المساعدة عبر الرابط التالي: مركز المُساعدة تواصلي معهم وسيقومون بتوضيح ما تريدين بكل سهولة وشفافية.1 نقطة
-
يمكنك التواصل مع مركز الدعم الفني من هنا وفتح تذكرة هناك (مع اختيار قسم أكادمية حسوب) لمساعدتك بشكل أفضل فيما يتعلّق بأمور الدفع، وأيضاً أي استفسار آخر لديك.1 نقطة
-
المُشكلة التي ظهرت لك بسبب هذا السطر: let name = fares; لان جافاسكربت لا تعرف الكلمة fares فهي ليست كلمة محجوزة في اللغة، كما أنه لا يوجد في السكربت أي مُتغير بالإسم fares. أعتقد أنك تريد تعريف مُتغير name و إسناد إسمك له كقيمة. لكن لعمل هذا تحتاج أن تُخبر جافاسكرت بأنه نص بإستعمال علامتي التنصيص بهذا الشكل مثلاً: let name = "fares"; و هذا ما تُوضحه رسالة الخطأ: Uncaught ReferenceError: fares is not defined1 نقطة
-
StrictMode هي ميزة تمت إضافتها في الإصدار 16.3 وتهدف إلى مساعدتنا في العثور على المشكلات المحتملة في أحد التطبيقات. كيفية أستعمال ميزة StricMode في تطبيق React : كل ما عليك فعله لتفعيل StrictMode (من الإصدار 16.3) هو لف المكون الذي تريده في تطبيقك بـ <React.StrictMode>. فيما يلي مثال على إضافة StrictMode إلى مكون (component) : import React from 'react'; function ExampleApplication() { return ( <div> <Header /> <React.StrictMode> <div> <ComponentOne /> <ComponentTwo /> </div> </React.StrictMode> <Footer /> </div> ); } بعد القيام بذلك مباشرة ، ستتمكن من رؤية التحذيرات في وحدة تحكم أدوات المطور. وهذا سبب ظهور التنبيه في console الخاص بك1 نقطة
-
لمتطلبات التي يجب علي دراستها لكي احصل على شهادة a+1 نقطة
-
نعم تستطيع برمجة لوحة الاردوينو بواسطة لغة بايثون من خلال من خلال بيئة التطوير المتكاملة الخاصة بالاردوينو " Arduino IDE " يجب تضمين الواجهة البرمجية/المكتبة برمجية Pyfirmata من خلال تنفيذ الأمر التالي في سطر الأوامر: pip install pyfirmata ثم بعد ذلك تقوم بإختيار Firmata من Arduino IDE ورفع الكود للاردوينو. مثال للتحكم في الأضواء المتصلة في الاردوينو عن طريق لغة بايثون: `from pyfirmata import Arduino, util import time board = Arduino('/dev/ttyUSB00') print('Start') for i in range(10): board.digital[13].write(1) time.sleep(1) board.digital[13].write(0) time.sleep(1) print ('End') لاحظ أنه تم تضمين الكلاس Arduino من pyfirmata module ليمكننا من التعامل مع لوحة الاردوينو.1 نقطة
