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

السلام عليكم ورحمة الله وبركاته تحيه طيبه وبعد احاول عمل عمليتين في نفس الوقت بمعنى في وقت واحد / العملية الاولى من نوع ادخال insert وبعد الادخال هذا احتاج الى جلب id اخر id طبعا بيكون الخاص ب هذا الادخال في نفس الوقت استعمله بيكون كالتالي : لدي كود اضافة بيانات مقسم الى قسمين يتم اضافة بيانات في جدولين مختلفات واحتاج الى ربط البيانات في الجدول الثاني ب نفس id اول جدول الذي سيتم ادراج البيانات فيه في بداية الامر . كيف يمكن عمل ذلك بحيث نعمل ادخال بعدها جلب اخر معرف لهذا الادخال ؟ ام الامر لا يمكن فعله من خلال هذا الطريقة؟

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

الخريطة في نظري تبدو كقطعة فنية وكل المذكور فيها من تكنولوجيات أشياء يجب النظر فيها ولو بغرض التجريب فقط لأنه قد تستهويك تكنولوجيا على حساب الاخرى وهذا يعود للتفضيل الشخصي لكل منا وسأحاول التلخيص في التعليق وأقسمه الى أشياء في رأيي اجباري تعلمها وأشياء لن تحتاجها في بداية المشوار . الأشياء التي يجب تعلمها والتركيز عليها: javascript npm(حبذا لو استبدلتها ب yarn ) node ecmascript express mysql mongodb frontend framwork git الأشياء التي ذكرت فوق أنت تقريبا ستحتاجها 100% في كل مشاريع الويب الخاصة بك الأشياء الخاصة بمشاريع معينة typescript socket io معاملات اللحظية redis قاعدة بيانات تستخدم لل cache في السرفر rabbitmq جدولة متقدمة graphql بديل ال rest api اذا كانت نيتك اصطياد عمل في شركة فحتما يصبح ال testing من الاجباريات

نعم يوجد 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>; }; طبعا يجب أن يكون المكون الذي يحتوي هذه الشيفرة في أعلى هرم المكونات

السبب الوحيد لحدوث خطأ من هذا القبيل هو أن إصدار node غير متوافق مع إصدار node-sass. تحقق من نسخة node لديك node -v ثم ثبت نسخة node sass متوافقة معه.

لقد قمت بإنشاء مكون React ومن المفترض أن يقوم بتحديث التنسيقات الخاصة به عند تمرير الصفحة. كود المكون كالتالي: let componentStyle = { backgroundColor: 'white' }; window.addEventListener('scroll', (event) => { componentStyle.backgroundColor = 'black'); }); return ( <div style={componentStyle}></div> ); لكن هذا الكود لا يعمل على الإطلاق، وأعتقد أن السبب هو أن React لا يعلم أن المتغير componentStyle قد تغير وبالتالي لا يتم عمل render للمكون مرة أخرى، وبالطبع حاولت أن أخزن هذه القيمة في state وتعديلها من خلال setState ولكن هذا الأمر يجعل عملية التمرير إلى الأسفل بطيئة للغاية، هل يوجد حل آخر غير هذا الأمر؟

هنا انت تحاول تعمل mutate لل object هذا سيسبب خطأ window.addEventListener('scroll', (event) => { componentStyle.backgroundColor = 'black'); }); للوصول لمبتغاك حاول اتباع الشيفرة في الاسفل import { useEffect, useState } from 'react'; function App() { const [bg, setBg] = useState('white'); useEffect(() => { window.addEventListener('scroll', (event) => { setBg('red'); }); return () => { window.removeEventListener('scroll', (event) => { setBg('red'); }); }; }, []); return ( <div style={{ backgroundColor: bg }} > .... </div> ); } export default App;

توفر axios دعم ل jest بدون أي مكاتب خارجية: import * as axios from "axios"; // عمل طلبات وهمية لجميع المستويات, get, put, delete and post: jest.mock("axios"); // ... get test("good response", () => { axios.get.mockImplementation(() => Promise.resolve({ data: {...} })); // ... }); test("bad response", () => { axios.get.mockImplementation(() => Promise.reject({ ... })); // ... }); وحتى يمكننا تحديد parameters: axios.get.mockImplementation((url) => { if (url === 'www.example.com') { return Promise.resolve({ data: {...} }); } else { //... } }); يمكنك القراءة أكثر من التوثيق الذي يحوي التغييرات لآخر إصدار: jestjs/mock-functions

لايمكن تغيير قيمة المكونات بعد الإنشاء إلا عن طريق تغيير الحالة. يجب علينا في هذه الحالة عمل مستمع أحداث و ربطه ب componentDidMount بعمل bind ب this و سوف تصبح الشيفرة: componentDidMount: function() { window.addEventListener('scroll', this.handleScroll); }, componentWillUnmount: function() { window.removeEventListener('scroll', this.handleScroll); }, handleScroll: function(event) { let componentStyle = { backgroundColor: 'white' }; if (..) this.setState({ componentStyle.backgroundColor = 'black' }); }, أو يمكنك تطبيق الدالة التي تغير اللون بتطبيق مستمع حدث التمرير مباشرة على العنصر: <ScrollableComponent onScroll={this.handleScroll} />

سنعمل على حساب عدد الصور التي تم تحديدها، أي استدعاء الدالة _onAddImageClick حسب فهمي للشيفرة فاستدعائها يتكرر مع كل تحديد للصورة. يمكنك تعريف متغير قبل الدالة، وعلينا زيادته ب 1 بعد كل استدعاء أي: var _imageCounter = 0; ^^^^^^^^^^^^^^^^^^ Future _onAddImageClick(int index, int type) async { if (images != null) setState(() { _imageCounter ++; ______^^^^^^^^^^^^^^^^ // ignore: deprecated_member_use _imageFile = ImagePicker.pickImage( source: type == 1 ? ImageSource.camera : ImageSource.gallery, imageQuality: 50, ); getFileImage(index); }); } وفي الحلقة: for(int i=0;i < _imageCounter ;i++) ^ ^^^^^^^^^^^^^ أصغر تماما لكي لا نجلب صورة إضافية

ارغب برفض الزر الضغط عليه اكثر من مرة في Flutter لضمان عدم تنفيز الأمر أكثر من مرة .

عمل رائع في تعلم كل هذه التقنيات، أعتقد أنك الآن تستطيع أن تقوم ببناء مشروع من الصفر (متجر إلكتروني أو مدونة على سبيل المثال)، وإن لم تفعل هذا بعد فقد حان الوقت لكي تقوم بالتطبيق على ما تعلمته في شكل مشروع واحد كبير يحتوي على كل التقنيات التي تعلمتها. ليس شرطًا أساسيًا أن تتعلم الـ testing ويمكنك القيام بأي مشروع بدون إستخدامه على الإطلاق، لكنه سيسهل عليك الكثير من العمل، لأنك ستقوم بعمل ملفات صغيرة تقوم بتجربة مكونات المشروع وتوافقها مع بعضها البعض، وهذا سيوفر عليك عناء التجربة اليديوية وإصلاح الأخطاء في كل مرة وهذا الأمر يستغرق الكثير من الوقع خصوصًا في المشاريع الكبيرة، بالنسبة لأنواع الـ testing فيوجد أنواع أخرى غير unit testing و integration testing وعندما تبدأ في تعلم وإستخدام أحد المكتبات للقيام بذلم مثل jest على سبيل المثال ستتعرف على باقي الأنواع ومتى تستخدم كل نوع منهم. الكاش أو الملفات المؤقتة هي بيانات يتم تخزينها في الذاكرة العشوائية في الغالب، لكي يتم الوصول إليها بشكل سريع بدلًا من البحث في ملايين السجلات في قاعدة البيانات على سبيل المثال، ويتم بشكل واسع في المشاريع الضخمة والمشاريع التي تحتوي على حجم بيانات كبير للغاية، ومثله مثل الـ testing ليس عليك تعليمه في البداية وليس شرطًا لكي تبدأ في عمل مشروع جديد. جدولة المهام يقصد به تنفيذ كود معين في وقت محدد مسبقًا، على سبيل المثال، إرسال رسالة بريد إلكتروني إلى المستخدمين في أول كل شهر تذكرهم بتجديد الإشتراك. الـ microservice أو كما يعرف بـ microservice architecture هي طريقة لتنظيم وتقسيم الكود ليكون: يمكن صيانتها واختبارها بدرجة عالية كل المكونات تكون المتباعدة (أي لا يعتمد بعضها على بعض) يمكن نشر كل المكونات بشكل مستقل تتيح بنية الـ microservice التسليم السريع والمتكرر والموثوق للتطبيقات الكبيرة والمعقدة. كما أنه يمكّن المنظمة أو الشركة من تطوير مجموعة التكنولوجيا والتقنيات الخاصة بها. كل أسلفت في البداية، يمكنك أن تبدأ الآن في إنشاء مشروع جديد، لكي تطبق على ما تعليمته بشكل سليم، وبعد إنتهاء المشروع يمكنك أن تقوم بتحسينه وتطبيق مميزات أخرى مثل الـ testing والـ caching والـ task Scheduling .. إلخ

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