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

بداية يجب عليك تحديد ما إذا كنت ترغبين بتعلم المجال لغاية إنشاء تطبيقات مدعمة بالذكاء الإصطناعي أو أنك ترغبين بفهم أدق التفاصيل بهذا المجال والرغبة في المساهمة بتطويره من خلال البحث في مختلف مجالاته ودعمها بأفكار جديدة تساهم بتطويره وحل مشكلات جديدة, وأنا من تجربتي الخاصة أعتقد أنه من الأفضل لك التخصص في مجال واحد وإتقانه, كما ذكرت أنك على وشك الدخول إلى الجامعة في تخصص الطب البشري فإن المجالين سواء الطب أو علم الذكاء الصطناعي مجالان كبيران جدا وسيصعب عليك الجمع بينهما, ولكي أوضح لك مدى شساعة المجال يمكن القول أنه مجال بتفرعات كثيرة لدرجة أن كل فرع هو مجال بحد ذاته، بما ان الـAI له تطبيقات في كثير من الفروع العلمية ولنفرض الطبية فالـAI للمختص بالطب يختلف عن مفهوم الـAI للمختص بالفيزياء لان كل شخص له فكرة عن الـAI وعلاقتة باختصاصة، لذلك يجب ان تدرسي احد الفروع في مجال الـAI فمن غير الممكن دراسة نظريات الـAI والتخصص به بشكل عام. اي حددي المجال الذي تنوين دراسة الذكاء الاصطناعي فيه، مثلا إذا كنت تودين دراسة الذكاء الإصطناعي في علوم الحاسوب فيجب ان تدرسي احد فروع الذكاء الاصطناعي فيه مثلا بناء روبوتات(Robotics) او تعليم الاله(Machine Learning) او Neural Networks او Evolutionary Computation او Vision, او Expert Systems او Speech Processing او Planning او Natural Language Processing بإختصار شديد أنا أنصحك بإكتشاف المجال قليلا والقراءة عنه بحيث تكتشفي مدى قدرتك على التخصص فيه, فإن وجدت نفسك قادرة على التعمق في المجال فيمكنك بعد ذلك تعلمه بشكل أكاديمي في الجامعة عوض الطب البشري, أما إذا كنت تودين التخصص في الطب فإجمعي كل تركيزك على الطب فهو أصلا مجال صعب ولن يتبقى لك وقت لدراسة أي مجال اخر.

السلام عليكم ورحمة الله وبركاته. أريد الإجابة عن سؤال منطقياً فقط.. لنفترض ان عندي مشروع متجر الكتروني عملت عليه بlaravel وتم بناء المشروع وبرمجته.. ولنفترض أنني أريد عمل api له لمطورين الهاتف فهل أبني الapi في نفس مجلد المشروع "أي اعتبارها من ضمن المشروع" أم أبنيها في مجلد منفصل "أي إعتبارها مشروع منفصل" ؟

ما اسم هذي الشيفرة في لارافيل // EXAMPLE {{ ($project->status == 1) ? 'مكتمل' : '' }} وهل بإمكاني استعمال اكثر من مره في نفس السطر البرمجي مثلاً فالكلاس وهل يوجد لها درس في ويكي حسوب؟

السلام عليكم انا اطلعت علي مكتبة material ui و react-bootstrap ولكن وجدت اختلاف في طريقة كتابة الsyntax اعلم ان الفكرة واحدة ويستخدمون طريقة الcomponents لكني افضل استخدام النظام الشبكي من الbootstrap العادي ولو اردت استخدام بعض المكونات ممكن استخدمها من الmatrial -ui لكن لدي عدة أسئلة أولا انا اضمن الbootstrap العادي عن طريق رابط CDN اضعه في Index.html مع العلم كل هذا في react اريد معرفة ما هو الCDN وما مميزاته وعيوبه وأريد ان اصل لنسخة (bootstrap CDN (RTL

السلام عليكم ورحمة الله وبركاته تحيه طيبه للجميع قمت بعمل كود لجلب الصور من الاستوديو وحفظها في قاعدة بيانات mysql الكود شغال بشكل عام ولكن توجد مشكله لم استطع ايجاد حل لها الصور يتم حفظها في مجلد الصور ولكن لا تظهر احصل على الرسالة التاليه: وهذا شكل الصور في المجلد ايضا الاسم في قاعدة البيانات يتكرر يعني لو عملت اول صورتين الامور رح تمشي تمام ولكن لو عملت اربع اسماء رح احصل على اثنان مع ان المفترض يكون الاسم مختلف مثال بشكل التالي: http://******/PHP/admin/upload_pic/thumb_file_0.png http://******/PHP/admin/upload_pic/thumb_file_1.png http://******/PHP/admin/upload_pic/thumb_file_0.png http://******/PHP/admin/upload_pic/thumb_file_1.png الكود المستعمل كامل كالتالي: <?php $photo_url= $_POST['photo_url']; $NameImage = $_POST['NameImage']; include 'connt.php'; $path = "upload_pic/$NameImage.png"; $actualpath = "http://*********/PHP/admin/$path"; $sql = "INSERT INTO photos (photo_url) VALUES (?)"; $stmt = $con->prepare($sql); $stmt->bind_param("s",$actualpath); $stmt->execute(); $result = $stmt->get_result(); // if(mysqli_query($conn,$sql)){ file_put_contents($path,base64_decode($photo_url)); echo "Successfully Uploaded"; // } $stmt->close(); ?> void main() { runApp(MyApp()); } class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp( title: '', theme: ThemeData( primarySwatch: Colors.blue, visualDensity: VisualDensity.adaptivePlatformDensity, ), home: StoreAddScreen(), ); } } class StoreAddScreen extends StatefulWidget { StoreAddScreen({Key key}) : super(key: key); @override _StoreAddScreenState createState() => _StoreAddScreenState(); } class _StoreAddScreenState extends State<StoreAddScreen> { List<String> photoPaths = List<String>(); final picker = ImagePicker(); static final String uploadEndPoint = 'http://**********/PHP/admin/rest/AddNewCategrytesttodelete.php'; void SaveDate() async { for (int i = 0; i < photoPaths.length; i++) { if (photoPaths[i].runtimeType == String) { String strPath = sprintf("thumb_file_%d", [i]); var url = uploadEndPoint; var response = await http.post(url, body: { "photo_url": photoPaths[i], "NameImage": strPath, }); if (response.statusCode == 200) { } else {} } } } static const int MAX_PHOTO_UPLOAD = 5; @override Widget build(BuildContext context) { return Scaffold( body: SingleChildScrollView( child: Column( children: [ SizedBox( width: double.infinity, height: 300.0, child: Expanded( child: Padding( padding: EdgeInsets.all(20), child: SingleChildScrollView( child: SizedBox( child: Column( mainAxisAlignment: MainAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start, children: <Widget>[ Padding( padding: const EdgeInsets.only(top: 10), child: SizedBox( height: 140, child: Row( children: [ Expanded( child: Container( decoration: BoxDecoration( color: Theme.of(context) .textTheme .bodyText1 .color, borderRadius: BorderRadius.circular(8), ), child: ListView.builder( itemCount: photoPaths.length, scrollDirection: Axis.horizontal, itemBuilder: (BuildContext context, int index) { return InkWell( child: Padding( padding: EdgeInsets.only( top: 8.0, bottom: 8.0, left: 8.0, right: 8.0), child: Container( height: 140, width: 140, child: ClipRRect( borderRadius: BorderRadius.circular( 8), child: AspectRatio( aspectRatio: 1.2, child: Image.file( File(photoPaths[index]), fit: BoxFit.cover, width: 300, height: 300, ), ), ))), onTap: () { showDialog( context: this.context, child: new AlertDialog( content: new FlatButton( child: new Text("delete_photo"), onPressed: () => setState(() { photoPaths.removeAt(index); }), ), ), ); }, ); }, ), ), ), Padding( padding: const EdgeInsets.only( left: 10, right: 10), child: Container( width: 50, height: MediaQuery.of(context).size.height, decoration: BoxDecoration( color: Theme.of(context).accentColor, borderRadius: BorderRadius.circular(8), ), child: Material( color: Theme.of(context).accentColor, borderRadius: BorderRadius.circular(8), child: InkWell( borderRadius: BorderRadius.circular(8), child: Icon( Icons.add_a_photo, color: Theme.of(context) .floatingActionButtonTheme .foregroundColor, ), onTap: () async { if (photoPaths.length == MAX_PHOTO_UPLOAD) { showDialog( context: this.context, child: new AlertDialog( content: new FlatButton( child: new Text( "max_photos_reached"), ), ), ); } PickedFile pickedFile = await picker.getImage( source: ImageSource.gallery, imageQuality: 90); setState(() { if (pickedFile != null) { photoPaths .add(pickedFile.path); } }); }), )), ) ], ), ), ), Padding( padding: const EdgeInsets.only(top: 16), child: Center( child: FlatButton( color: Theme.of(context).accentColor, // controller: _btnController, onPressed: SaveDate, child: Text( ("addd"), style: TextStyle( fontWeight: FontWeight.w500, color: Theme.of(context) .floatingActionButtonTheme .foregroundColor, ), ), ), ), ), SizedBox( height: 50, ), ], ), ), ), ), ), ), ], ), )); } } ياليت اذا احد يعرف سبب المشكله يساعدنا ولكم جزيل الشكر

السلام عليكم ورحمة الله، أختكم في حيرة شديدة من أمرها وتحتاج نصحًا وإرشادًا من ذوي النظر والاختصاص.. أكملت دراستي الثانوية حديثًا وأنا بصدد دخول الجامعة؛ لأدرس تخصص الطب البشري. ولكنني رغم ذلك أحب الرياضيات، وميولي الأولى نحو كل ما يتعلق بالمنطق، لذلك لم يكن غريبا تطلَعي للتعرف على مجال البرمجة. بدأت بتعلم لغة جافا من موقع هرماش -جزاه الله خيرا- والحمدلله يمكنني القول أني وصلت لمرحلة متوسطة وجيدة بالنسبة لشهرين من تعلّمها إلى أن أكملت الOOP، وكان ذلك بداية رغبة في تعلم برمجة تطبيقات أندرويد، وكان كل شيء واضحًا أمامي. ثم داهمني منشور صدفة على فيسبوك، ذكر فيه موضوع عن الذكاء الاصطناعي، فإذا بي أتحقق من أمرها وأحاول كشف سرّها، حتى خطر ببالي خاطر أن أتعلمها لعلَها تكون لي خير مجال أكرّس نفسي فيه، بحيث يكون لي مفيدًا ومتعلقًا بدراستي للطب أيضًا. (يمكنني أن أبدع) بيد أنني أشعر بالحيرة والتوهان وأحس أن الطريق غير واضحة أمامي وأنا بصراحة لا أحب الطريق غير واضحة المعالم وأرغب في أن أفهم كل متطلبات المجال بالترتيب وإلى أيم سأصل من ثم؟ وهل يمكنني حقًا الاستفادة منها أم أنني سأضيع وقتي في البحث عن شغف مفقود؟ هل ينصح أحد بالبدء بدراستها هنا؟ علما بأني أقدر على دراسته إن ارتأيت أنه مناسب جدًا واطمئننت له. أشعر بالحيرة والوحدة أيضًا فلست أعرف من أستشير وكيف أبدأ وهل أنا أقوم بالذي علي القيام به للمنافسة في مجالات البرمجة والتقنية الحديثة، أم ماذا...؟

مرفق ملفات المشروع كامله مع قاعدة البيانات تفضل: to.rar

يرجى رفع ملفات مشروعك كاملاً بشكل مضغوط. ربما هناك بعض المشاكل.

مرحبا اخي قمت بتجربه واصبح الكود بشكل التالي كامل ولكن المشكله مثل ما هيا لم تحل File pickedFile = await ImagePicker.pickImage(source:ImageSource.gallery,imageQuality: 90);

هل يمكنك إيضا تغيير السطر التالي await picker.getImage(source:ImageSource.gallery,imageQuality: 90); إلى await picker.pickImage(source:ImageSource.gallery,imageQuality: 90); و أخباري بالنتيجة.

مرحبا اخي @بلال زيادة قمت بتجربه / بعد الازاله الكمبيوتر لا يعترف على الصور بمعنى لم يصبحو ملفات صور مرفق لك صوره: مرحبا اخي الكريم @Wael Aljamal قمت بتغير ووضع الوقت ولكن المشكله نفسها مرفق لك صوره:

إن حفظ الملفات بنفس الاسم يؤدي لحذف الملفات القديمة أو عدم حفظ الجديدة. لذلك وليكون اسم الملف مميز وغير مكرر نضيف له قيمة الوقت: $path = "upload_pic/_" . time() . "_$NameImage"; سبب مشكلة عدم فتح الصور ربما بسبب تغيير اللاحقة لكل الصور إلى PNG في المسار.

هل يمكنك إزالة png. من السطر التالي $path = "upload_pic/$NameImage"; ومن ثم إخباري بالنتيجة.

إسمه معامل الشرط الثلاثي او ternary operator و هو موجود في معظم لغات البرمجة على ما أعتقد، في المثال الذي أرفقته فإننا نفحص حالة المشروع إن كانت تساوي واحد فإننا نعرض كلمة مكتمل أما في الحالة المعاكسة فإننا لا نعرض شيء. و هذا شرحه في موسوعة حسوب الخاص بلغة جافاسكربت و نفس الشيء في لغة php: المعامل الشرطي في JavaScript كما أنه يوجد له شرح في أحد دروس دورة php في مسار الأساسيات: العامل الثلاثي Ternary Operator

هذا الكود عبارة عن شرط if مصغرة يطلق عليها اسم Ternary Operator و تكون على هذه الصيغة (condition) ? (statment1) : (statement2); مثل <?php $i = 50; echo ($i >= 10) ? "YES" : "NO"; ?> بحيث Statement1 تنفذ إذا تحقق الشرط, وStatment2 تحقق إذا كان الشرط خطأ. و إذا أردنا تحويلها إلى if تكون بهذا الشكل <?php $i = 50; if($i >= 10){ echo "YES"; } else { echo "NO"; } ?> ويمكنك استخدامها كما تريد و تكرارها كيفما تشاء.

بإختصار CDN هو ما يطلق عليه Content Delivey Network أي شبكة توزيع و مزامنة المحتوى, وهي مجموعة من الخوادم المتزامنة و الموزعة على شبكة الأنترنت, تحتوي على مكتبات و بعض محتويات الأنترنت الأكثر إنتشاراً مثل مكتبة بوتستراب و مكتبة jquery و مكتبة popper.js والكثير من غيرها. مميزاتها: تسرع من عمل الموقع عند تضمينها. تقلل من حجم ملفات مشروعك. تقلل معدل الأرتداد عيوبها: لا تعمل عند إنقطاع الأنترنت. إذا تم فقد الموقع المستضيف إلى هذه المكتبات فستتعطل هذه المكتبات. يمكنك البحث عن bootstrap rtl ويمكنك استخدام cdn المقدم من قبل الموقع المستضيف لهذه المكتبة مثل موقع rtlcss.com. <link rel="stylesheet" href="https://cdn.rtlcss.com/bootstrap/v4.5.3/css/bootstrap.min.css" integrity="sha384-JvExCACAZcHNJEc7156QaHXTnQL3hQBixvj5RV5buE7vgnNEzzskDtx9NQ4p6BJe" crossorigin="anonymous"> <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script> <script src="https://cdn.rtlcss.com/bootstrap/v4.5.3/js/bootstrap.bundle.min.js" integrity="sha384-40ix5a3dj6/qaC7tfz0Yr+p9fqWLzzAXiwxVLt9dw7UjQzGYw6rWRhFAnRapuQyK" crossorigin="anonymous"></script>

شكرا لك اخي الكريم

ليس لديك أي كلاس ليتم إضافة الدالة إليه , لذلك يمكنك إنشاء كلاس بهذا الشكل <?php class ControllerPhoto { public $pdo; function __construct($pdo){ $this->pdo = $pdo // الأستعلام الخاص بقاعدة البيانات } function insertPhoto($itm) { $stmt = $this->pdo->prepare('INSERT INTO photos(photo_url) VALUES(:photo_url)'); $result = $stmt->execute(array('photo_url' => $itm->photo_url,)); return $result ? true : false; } function sanitize($key) { $val = ""; if( !empty($_POST[$key]) ) $val = $_POST[$key]; return $val; } } و من ثم تمرير متغير pdo$ الخاص بالإتصال بقاعدة البيانات , ومن ثم يمكنك استدعاء الدالة بهذا الشكل $controllerPhoto->controllerPhoto($photo); فيكون كامل الكود بهذا الشكل <?php class ControllerPhoto { public $pdo; function __construct($pdo){ $this->pdo = $pdo // الأستعلام الخاص بقاعدة البيانات } function insertPhoto($itm) { $stmt = $this->pdo->prepare('INSERT INTO photos(photo_url) VALUES(:photo_url)'); $result = $stmt->execute(array('photo_url' => $itm->photo_url,)); return $result ? true : false; } function sanitize($key) { $val = ""; if( !empty($_POST[$key]) ) $val = $_POST[$key]; return $val; } } $controllerPhoto = new ControllerPhoto(); $controllerPhoto->controllerPhoto($photo); $extras = new Extras(); $arrPhotos = array(); if(count($arrPhotos) > 0) { for($ind = 0; $ind < count($arrPhotos); $ind++) { $photo = new Photo(); $photo->photo_url = $arrPhotos[$ind]; insertPhoto($itm)->insertPhoto($photo); } } ?>

نعم تكون ملفات ال API موجودة في نفس مجلدات المشروع، ولكن منفصلة بملفاتها الخاصة مثلا نضع المتحكمات الخاصة بها في مجلد منفصل ِApp/Http/controllers/api/controller1.php ِApp/Http/controllers/api/controller2.php ِ...................... ِ/controller3.php ...................... ِ/controller4.php و نضع Routes أيضا في ملف منفضل: Rotes/api.php نضع فيه مسارات المتحكمات الخاصة. إن متحكمات API تصل لنفس موادر المتحكمات العادية و الملفات الأخرى فلا نضعها في مكان آخر ليسهل الربط بينها مع المشروع. و مع الصلاحيات سيكون كل شيئ آمنا فلا داع للقلق.

يمكنك أن تبني المشروع بالكامل في نفس مجلد لأن Laravel يأتي مجهزًا للتعامل مع الـ API، ويمكنك أن تقوم بعمل RESTful API من خلال عمل Routes في ملف routes/api.php بنفس الطريقة العادية كم اتقوم بها في ملف routes/web.php ويفضل أن تفصل المتحكمات controllers في مجلد داخلي باسم api ليكون في المسار التاليعلى سبيل المثال: /app/Http/Controllers/Api/UsersController.php ويمكنك تقسم الـ API إلى إصدار (V1, V2 .. إلخ) حتى إذا أردت أن تقوم بعمل تحديثات في المستقبل، تقوم بعمل إصدار جديد لذلك قم بوضع المتحكمات في مجلد باسم الإصدار أيضًا كالتالي: /app/Http/Controllers/Api/V1/UsersController.php ويمكنك أن تستخدم التابع prefix لإستخدام الإصدار في مسارات routes الـ API أيضًا كالتالي: Route::prefix('v1')->group(function () { Route::get('/users', [UsersController::class, 'index']); // http://localhost/api/v1/users Route::get('/posts', [PostsController::class, 'index']); // http://localhost/api/v1/posts });

append: سوف تقوم بإضافة جميع الوسطاء الذين تم تمريرهم لها للقائمة كعنصر واحد، أي مهما كان عدد الوسطاء سوف يزيد طول المصفوفة ب1. extend: تقوم بالمرور بحلقة على الوسطاء الممررة لها و تقوم بإضافتهم واحداً تلوَ الآخر ما يؤدي لزيادة عدد عناصر القائمة بعدد العناصر المضافة. مثال1: append لسلسة نصية يضيفها كاملة كعنصر وحيد >>> my_list ['foo', 'bar'] >>> my_list.append('baz') >>> my_list ['foo', 'bar', 'baz'] مثال2:append لقائمة يضيفها كاملة كعنصر وحيد >>> another_list = [1, 2, 3] >>> my_list.append(another_list) >>> my_list ['foo', 'bar', 'baz', [1, 2, 3]] # ^^^^^^^^^ عنصر وحيد مثال3: extend لقائمة يضيف كل عنصر من عناصر كعنصرها مستقل >>> my_list ['foo', 'bar'] >>> another_list = [1, 2, 3] >>> my_list.extend(another_list) >>> my_list ['foo', 'bar', 1, 2, 3] مثال4:extend لسلسلة نصية يضيف كل عنصر من عناصرها كعنصر مستقل >>> my_list.extend('baz') >>> my_list ['foo', 'bar', 1, 2, 3, 'b', 'a', 'z']

في ملف .gitignore يمكنك تجاهل المجلدات بأكملها ، فقط من خلال تضمين مساراتها ووضع / في نهايتها node_modules/ logs/ إذا تركت الشرطة المائلة في النهاية ، فستتطابق مع كل من الملفات و المجلدات بهذا الاسم. يمكنك استخدام بادئة ! لنفي تجاهل ملفات معينة *.log !example.log في هذا المثال ، لا يتم تجاهل example.log ، على الرغم من تجاهل كافة الملفات الأخرى التي تنتهي بـ .log. وهناك العديد من الطرق الأخر لتجاهل الملفات و المجلدات في .gitignore يمكنك الإطلاع عليها في التوثيق الرسمي

عند حدوث أي خطأ في Laravel يتم تخزين المعلومات الخاصة بذلك الخطأ في ملف إسمه laravel.log تجده في المسار storege/logs/laravel.log يمكنك الإطلاع عليه ستجد الخطأ في آخر سطر بالتوفيق

يمكن القول أنها فقط عبارة عن كنية أو إسم مختصر للمستودع البعيد Remote Repo الذي تم استنساخ المشروع منه . فهو يستخدم بدلا عن عنوان الـ URL للمستودع الأصلي و بالتالي يسهل الرجوع إليه و يكون عوضا عن طباعة هذا كل مرة : git push git@github.com:USERNAME/REPOSITORY-NAME.git YOUR-BRANCH يمكن فقط تنفيذ الأمر بهذا : git push origin YOUR-BRANCH ( طبعا يكون هذا بعد تسجيل المستودع البعيد في حالة إنشاء مشروع جديد . ويكون معينا افتراضيا عن طريق الـ git عند استنساخ مستودع ما . ) طبعا يمكن إعادة تعيين هذا فهو إعداد افتراضي و ليس إلزاما , عن طريق هذا الأمر : git remote rename origin something_else كما يتم تعريفه في مشروع محلي جديد كالتالي : git remote add origin git@github.com:USERNAME/REPOSITORY-NAME.git ليس بالضرورة أن يتم تخصيص branch في حالة ما كان يوجد branch واحد على المستودع البعيد , وليكن master مثلا , يكون الأمر السابق عوضا و بدلا عن الأمر التالي : git push origin master فالأمور ببساطة هي اختصارات و اصطلاحات اعتادت عليها الأوساط البرمجية لا أكثر .

فهمت عليك أنت تريد للـcheckbox أن يكون افتراضياً checked مع قابلية تغييره، في الغالب أنت تستعمل بالفعل useState أو this.state ولكن لسبب ما تظن أنهما لن يعملا ولكن الحقيقة هي أنهما سيعملان لسبب بسيط جداً: إن تابع useState يقبل معامل هو القيمة اﻻفتراضية لمتحول الحالة. إذاً في حالتك كل ما عليك استعماله هو useState(true) أي نمرر true كقيمة افتراضية لتابع useState. وحتى لو كنت تستعمل class component فعندها تضع القيمة اﻻفتراضية في constructor أي constructor(){ this.state = { checked: true } }

node-sass غير منصوح بها بعد اﻵن إذ ينصح فريق مطوري لغة SASS باستخدام ما يسمى بـDart SASS والتي تنصب باﻷمر التالي: npm i -D sass نعم أعلم أن documentation لجماعة create-react-app يقولون بأن تنصب node-sass ولكن سبب ذلك أن node-sass لم تصر deprecated إلا منذ عهد حديث(شهر أكتوبر الماضي) وdocumentation الخاص بـcreate-react-app يحتاج إلى تحديث.

الأمر بسيط يمكنك اتباع الخطوات في الأسفل فهي تبين العملية بدقة أولا نبدأ بالشيفرة الحاوية لل testing import { fetchUsers } from './'; describe('fetchUsers', () => { it('fetches with success data from an API', async () => { }); it('fetches with error data from an API', async () => { }); }); الجزء الخاص بالنجاح تخصص في متغير يمثل هيكلة ال data المستقبلة من الطلب وتتحقق import axios from 'axios'; import { fetchUsers } from './'; jest.mock('axios'); describe('fetchUsers', () => { it('fetches with success data from an API', async () => { const data = { ..... }; axios.get.mockImplementationOnce(() => Promise.resolve(data)); }); ...... }); اما الجزء الخاص بفشل الطلب فكالتالي import axios from 'axios'; import { fetchUsers } from './'; jest.mock('axios'); describe('fetchUsers', () => { ....... it('fetches with error data from an API', async () => { const errorMessage = 'Network Error'; axios.get.mockImplementationOnce(() => Promise.reject(new Error(errorMessage)), ); }); });

مرحباً @Adam Ebrahim السبب بسيط وهو إنك تقوم بإسناد الخاصية checked بشكل مباشر في React.createElement عند فعل ذلك لن تتمكن من تغيير القيمة بالتأكيد لأن العنصر الحالي هو checked لكن يجب أن تستخدم قيمة إفتراضية ولفعل ذلك نقوم بإضافة الخاصية defaultChecked وإسناد القيمة true إليها الكود النهائي يصبح هكذا React.createElement('input',{type: 'checkbox', defaultChecked: true}); وأخيراً قم بإزالة <input type="checkbox" checked="checked" /> لأننا نقوم بعمل العنصر (الinput) من خلال الميثود createElement

بافتراض مكون بسيط import React from 'react'; export default function test() { return ( <div> <button id="btn">click</button> </div> ); } يمكنك استخدام jest الى جانب enzyme للضغط على الزر import React from 'react'; import { shallow } from 'enzyme'; import Test from './Test'; it('click btn', () => { const wrapper = shallow(<Test />);//استخدام المكون const button = wrapper.find('#btn');//تحديد الزر button.simulate('click');//محاكات الضغط });

يمكنك استخدام navigate من gatsby import { useEffect } from 'react'; import { navigate } from 'gatsby'; export default () => { useEffect(() => { navigate('/posts/', { replace: true }); }, []); return null; }; إذا كان يجب أن يحل route محل history بدلاً من دفع إدخال جديد في route history ، فقم بإضافة خاصية replace بقيمة true إلى وسيطة خيارات التنقل.

في react الأمر ليس ببساطة فأنت تحتاج لتحويل ال input الى حالة ال controlled بربطه ب state يعني استخدام شيفرة من هذا القبيل import React from 'react'; export default function test() { const [checked, setChecked] = useState(true);//حالة لتحديد وضعية الضغط const handleChange = (e) => { setChecked(!e.target.checked);//تغيير القيمة المنطقية }; return ( <div> <input onChange={handleChange} type="checkbox" checked={checked} /> </div> ); }

نعم يوجد history.listen وهي تساعدك لتعرف أن route قد تغير import React, { useEffect } from 'react'; import { useHistory } from 'react-router-dom'; const App = () => { const history = useHistory(); useEffect(() => { return history.listen((location) => { console.log(`You changed the page to: ${location.pathname}`); }); }, [history]); return <div>...</div>; }; طبعا يجب أن يكون المكون الذي يحتوي هذه الشيفرة في أعلى هرم المكونات

يمكنك أن تقوم بعمل حقل في لوحة التحكم يقوم بتعديل قيمة في جدول ما في قاعدة البيانات (جدول Settings على سبيل المثال)، وفي الموقع نفسه (أي في القالب المستخدم في الموقع) نقوم بإستخدام القيمة الموجودة في جدول settings، بهذا يمكنك التحكم في الكثير من المميزات الموجودة في الموقع من خلال لوحة التحكم عبر إنشاء حقل input لكل قيمة تريد التحكم بها وتخزينها في قاعدة البيانات وإستخدام هذه القيمة من قاعدة البيانات وإستخدامها في واجهة الموقع.

هناك إضافة لل Gatsby تقوم بعمل تعطيل لل route تسمى gatsby-plugin-static-site يمكنك تثبيتها كالتالي npm install @wardpeet/gatsby-plugin-static-site --save ثم قم بإضافتها لملف ال gatsby-config.js كالتالي plugins: [{ `@wardpeet/gatsby-plugin-static-site`, }]