اذهب إلى المحتوى

عبدالباسط ابراهيم

الأعضاء
  • المساهمات

    4888
  • تاريخ الانضمام

  • تاريخ آخر زيارة

  • عدد الأيام التي تصدر بها

    11

كل منشورات العضو عبدالباسط ابراهيم

  1. نعم هناك طريقة ستقوم فيها بكتابة handler واحد لجميع عناصر ال input وهي كالتالي handleChange (e) { this.setState({ [e.target.name]: e.target.value }); } تقوم هذه الطريقة بتغيير ال state لل input الذي قام بإستدعاء الدالة لذلك إذا تم تغيير قيمة ال password مثلاً ستم تنفيذ الدالة السابقة كالتالي handleChange (evt) { this.setState({ password: "باسورد" }); } ولكن بالنسبة لل state ستحتاج لإضافة جميع عناصر ال input
  2. يمكنك استخدام try and catch للتحكم في البرنامج سواء في حالة حدوث خطأ أو في حالة النجاح كالتالي try{ // يتم تنفيذ الكود هنا في حالة النجاح } catch{ // يتم تنفيذ الكود هنا في حالة الفشل } وفي حالة المثال الخاص بك يمكن أن يكون الكود كالتالي try{ $user = new User; $user->fields = $value; $user->save(); } catch(\Exception $e){ echo $e->getMessage(); }
  3. توفر لك الجافا أو بالتحديد ال JDK مجموعة كبيرة من الكلاسات والدوال الجاهزة لتوفر عليك كتابة الكثير من الكود أو مثلاً بدلاً من كتابة دالة تقوم بإرجاع العدد الأكبر في مصفوفة من البداية توفر لك الجافا دالة جاهزة تسمى max وهي دالة للكلاس Math وتقوم بإرجاع الرقم الأكبر كالتالي ببساطة Math.max(12.123, 12.456) بالطبع هناك العديد من الدوال المختلفة لأداء مهما مختلفة ويجب بالطبع تعلم الدوال التي ستنفعك في العمل
  4. لا يتغير محتوى الصفحة لأنك تظل في المكون people أو (" / ") لماذا ؟ لأن المسار "profile/" يحتوي على ال "/" وبالتالي router بإستدعاء ال "/" ولذلك تحتاج لإستخدام الخاصية exact كالتالي import React from "react"; import ReactDOM from "react-dom"; import { Router, Route } from "react-router"; import { BrowserRouter, Router } from 'react-router-dom'; //react لا تنسى إستدعاء import People from "./components/People"; import Profile from "./components/Profile"; ReactDOM.render(( <BrowserRouter> <Route exact path="/" component={People} /> <Route path="/profile" component={Profile} /> </BrowserRouter> ), document.getElementById('root'))
  5. لا يمكننا استخدام ال redirect في ال function كما فعلت لأنها كائن أو component وجب أن تستعمل ك component ولذلك نحتاج في هذا الموقف أن نستخدم ال hook ال useHistory أو ال history.push بما أنك تستخدم الإصدار الأخير كالتالي import { useHistory } from "react-router-dom"; //في الأعلى hook يجبإستدعاء هذا ال async handleForm(event) { event.preventDefault(); const username = this.state.user.username; const email = this.state.user.email; const password = this.state.user.password; const confirmPassword = this.state.user.confirmPassword; const formData = { username, email, password, confirmPassword }; axios.post('/register', formData, { headers: {'Accept': 'application/json'} }) .then((response) => { this.setState({ errors: {} }); // <Redirect to="/" /> بدلاً من ذلك //let history = useHistory(); history.push('/')functional component إذا كنت تستخدم this.props.history.push('/'); }).catch((error) => { const errors = error.response.data.errors ? error.response.data.errors : {}; errors.summary = error.response.data.message; this.setState({ errors }); }); }
  6. تحتاج لتعلم البرمجة وإن كنت تسأل عن الدورات الموجودة في حسوب فيمكنك أن تجد جميع الدورات هنا وقم بقراءة جميع المعلومات عن كل دورة لتعرف ماذا تحتاج ولكن قبل ذلك قم بقراءة الإجابات على هذا السؤال لتعرف كيف تبدأ في البرمجة أما بالنسبة للمعرفة باللغة الإنجليزية بالطبع لا تحتاج أن تكون اللغة لديك متقنة لأن الشرح باللغة العربية ومفهوم ولكن ربما تحتاج لتعلم اللغة وليس التعمق فيها مستقبلاً للتعمق في البرمجة
  7. بالطبع ذلك قرار صحيح حيث تعتبر ال functional component أفضل من ال class component والإختلاف ببساطة بينهم هو أن في functional component تقوم بإستخدام دوال جاهزة مثل useState بدلاً من الخواص كما في ال class component ولذلك فائدة في سهولة الإستخدام والقدرة الكبيرة للتطوير نظراً لتنظيم الكود ويمكنك أيضاً بناء custom hooks أما بالنسبة لما يجب عليك التركيز عليه هو طريقة استخدام ال functional component عموماً وأيضاً يجب التركيز على ال hooks وأشهرها ال useState و ال useEffect
  8. هذه الخدمة jsonplaceholder تدعم ال get, post, delete, put ولكن لا تقوم بحفظها على السيرفر أي أنه يمكنك عمل POST وسينتج لك response يحتوي على البينات التي قمت بإضافتها ولكن إذا قمت بعدها بعمل get لن تظهر لك هذه البيانات لأنها لا تحفظ على السيرفر ويمكنك التأكد من ذلك في الموقع الخاص بال api من هنا
  9. المشكلة كما شرح المدرب محمد أنه تم وضع ال header وال method بداخل كائن آخر وهذا غير صحيح وبدلاً من إزالة هذا الكائن يمكن حل هذه المشكلة باستخدام ال spread operator وهو (...) وهو يقوم بنشر محتويات الكائن كالتالي fetch(api.posts.link, ...obj) // spread operator تم إستخدام ال .then((response) => response.json()) .then((responseData) => { console.log(responseData); }).done();
  10. ربما يكون ذلك في البداية لأنك لم تتعرف حتى الآن على الكثير من الطرق لحل مشكلة معينة ولكن مع بناء العديد من المشاريع ستتمكن من حل مشكلة معينة أو تنسيق عنصر معين بطريقة غير التي استخدمها المدرب وبالمناسبة ذلك طبيعي مع أي شخص تعلم البرمجة إذا المطلوب منك متابعة بناء المشاريع مع المدرب ولكن يجب أن تفهم ما يقوم به المدرب ومع الوقت حاول استخدام طرق مختلفة عن المدرب
  11. تختلف قاعدة البيانات من firebase عن ال mysql تماماً حيث تعتبر ال firebase database من النوع ال non relational database(sql) وال mysql تعتبر من ال (nosql)relational database و لا توجد ما يسمى بالعلاقات في ال firebase (ليس تماماً) كما في ال mysql ولذلك يكون هناك بعض السهولة في التعامل مع هذا النوع من قواعد البيانات ومن مميزات ال nosql القدرة العالية على التوسع والقابلية للزيادة بدون تكلفة عالية ويمكنك المقارنة بين ال relational database و ال non relational database لمعرفة المزيد أما بالنسبة للوصول للبيانات فبدلاً من العلاقات في ال relational database يتم وضع جميع البيانات المطلوبة فيما يسمى collection فمثلاً يوجد مستخدم و منتج و طلب يتم الوصول للبيانات كالتالي يتم وضع أغلب المعلومات عن المستخدم والمنتج في الطلب وبذلك لن تحتاج للعلاقات ولكن لكل نوع عيوب ومميزات ويمكنك إختيار النوع الذي يخدم أهدافك
  12. جميل جداً أن تتعلم الشئ الذي تحبه وتسعى وراء التعمق فيه ولكن مجال البرمجة كبير ويحتاج للتخصص ولكن قبل التخصص يفضل تعلم أساسيات علوم الحاسوب و بالنسبة لتعلم التفكير المنطقي فلا يوجد ما يسمى بأفضل طريقة أو لغة لتعلم التفكير المنطقي فهذه مهارة يمكنك إكتسابها بتعلمك للبرمجة عموماً فلا تقلق من مسألة التفكير المنطقي وللخوض في دراسة البرمجة يمكنك أن تجد إجابة على هذا السؤال في الإجابات علي السؤال التالي ولا تشغل بالك بالأسئلة مثل هل أنا مؤهل لتعلم البرمجة وما إلى ذلك فقط قم بالبدأ بالتعلم ويجب الإهتمام بالأساسيات بالتوفيق لك
  13. أولاً لا أحد يستطيع الإجابة على هذا السؤال بشكل دقيق حيث يعتمد هذا السؤال على العديد من المتغيرات مثل الوقت المخصص كل يوم للتعلم الخبرة البرمجية لديك فهل لديك خبرة في البرمجة وهل لديك خبرة عن ال backend عموماً مدى إستيعابك للشرح فتختلف لعدة عوامل أيضاً ولكن سأعطيك فترة تقريبية ربما تزيد أو تنقص وسأفترض أن ليس لديك أي خبرة برمجية بإستثناء المتطلبات لهذه الدورة وأيضاً التعلم يومياً ل 3 ساعات تقريباً يمكنك إنهاء هذه الدورة فيما لا يقل عن الشهر (وربما تزيد أو تنقص) وذلك للخروج بأكثر إستفادة من الدورة لذلك الخلاصة هي أنك لا تشغل بالك بهذا السؤال أبداً واعمل على الخروج بأكثر قدر من الإستفادة
  14. ماذا تقصد بنقل الكود ؟ ولكتابة الكود من الصفر ينبغي عليك تعلم البرمجة وكما قلت في تصميم واجهات المستخدم ينبغي عليك تعلم الأساسيات: HTML ،CSS ،JavaScript HTML هي لغة الترميز المستخدمة لوصف المحتوى على صفحة الويب وكيفية هيكلته — فكر في العناوين والنقاط واالروابط. CSS هو الكود الذي يمثل كيفية تصميم محتويات صفحة الويب وتوضيحها. من خلال تغيير كود CSS لصفحة الويب، يمكنك التحكم في الخطوط المستخدمة وتغيير الألوان والصور ووضع محتوى الصفحة لتحقيق أقصى تأثير. JavaScript – لغة برمجة تستخدم للتحكم ديناميكياً في المحتوى على صفحة الويب. يتيح لك JavaScript جعل المواقع تفاعلية – يتم تشغيل جميع تطبيقات الويب والخرائط التفاعلية وصور التمرير والفيديو الديناميكياً بواسطة JavaScript. هذه الأساسيات يمكنك من خلال بناء أي واجهة مستخدم ولكن لتسريع وجعل العمل أكثر إنتاجية تحتاج لتعلم بعض المكتبات والأدوات المختلفة مثل bootstrap و jquery و webpack وما إلى ذلك
  15. يمكنكي استخدام ال set أو ال dict.fromkeys كما في هذه الإجابة
  16. هناك عدة طرق ولكن أشهر هذه الطرق التالي استخدام set حيث سيتم إنشاء set وأثناء إنشاء ال set يتم مسح العناصر المكررة كالتالي mylist = ["a", "b", "a", "c", "c"] mylist = list( set(mylist) ) أو استخدام ال dict.fromkeys وهذه الطريقة تقوم بإنشاء directory وأثناء إنشائه يتم مسح العناصر المكررة تلقائياً كالتالي mylist = ["a", "b", "a", "c", "c"] mylist = list( dict.fromkeys(mylist) ) الفرق أن الطريقة الأولى لا تحافظ على ترتيب العناصر ولكن الطريقة الثانية تحافظ علي الترتيب
  17. من الطبيعي أن تتأخر أول المشاريع لك ولكن هناك بعض النصائح التي تجعل عملية الحصول على المشاريع سهلة نوعاً ما ستجدها في الإجابات على هذا السؤال لا تيأس ولا تتوقف عن التقدم للعمل ولكن قبل التقدم للعمل فكر كيف تقنع العميل للعمل معك وتعتبر هذه المهارة لا تقل أهمية عن المهارة التي تعمل بها وبالتوفيق لك
  18. يمكنك عمل ذلك عن طريق خطوتين كالتالي يمكنك أخذ قيمة من المستخدم حفظ هذه القيمة في متغير وذلك عن طريق الدالة ()input string = input() توليد list من القيمة التي قام المستخدم بإدخالها عن طريق الدالة ()list theList = list(string)
  19. لا وجود لخاصية style لل button في ال react native ولكن هناك طريقة أخرى تمكنك من إضافة التنسيق لعنصر ال button وهي عن طريق ال touchableOpacity أو ال touchableHighlight كالتالي <TouchableOpacity style={{ backgroundColor: '#AEF', color: '#000', borderRadius: 6 }}> <Button title="Log In" onPress={() => authenticate({ username, password})}/> </TouchableOpacity>
  20. يعتمد إختيار إسلوب بناء الموقع على المميزات أو شكل الموقع الذي تحتاجه فبمجرد معرفة الخصائص والمميزات لكل إسلوب سواء ال multi page app (الطريقة التقليدية) أو ال single page app (العمل ب react) ستعرف الإسلوب المناسب لك وذلك في حالة أن لك حرية الإختيار اما في حالة كان العميل يريدك العمل بإسلوب معين ستحتاج للعمل بما يختاره لك وسأقوم بوضع بعض المميزات لل single page مميزات ال single page app سرعة وتجاوب الموقع تكون عالية فصل ال backend عن ال frontend مما يتيح لك فرصة ربط ال backendبأي تطبيق آخر تجربة مستخدم أفضل حيث يتم تحديث البيانات بدون إعادة تحميل الموقع ويعمل على الهاتف بشكل أفضل عيوب ال single page app ليس الأفضل لل seo لذك إذا كنت تهتم بال seo فالإختيار الأفضل هو MPA مع أنه يمكنك تحسين ال seo لل SPA لذلك يعتمد على الأهداف من المشروع والإتفاق مع ال backend developer أيضاً
  21. يمكنك تخطي هذه التقنية فهي فلا ترتبط بال frontend حيث تعتبر هذه التقنية أداة لبناء تطبيقات الهاتف لمختلف المنصات وتعتبر ليست بالصعبة فهي تعتمد على ال react وستضيف إليك الكثير وزيادة فرص العمل لك وبالمناسبة تطبيق ال facebook على الهاتف تم بنائه باستخدام هذه التقنية لذلك أنا أرى أنها فرصة جيدة لك لتعلمها وإن كنت لا تريد تعلمها الأن قم بتخطيها ثم الرجوع إليها لاحقاً ولكن لا تضيع فرصة تعلمها
  22. يمكنك الإطلاع على الإجابات في هذا السؤال حيث تم الإجابة على سؤالك
  23. سأحاول شرح هذه المصطلحات بإختصار لتبسيط المصطلح props وتعني ال خصائص وتقوم بتمرير البيانات من المكون الأب إلى المكون الأبن كالتالي class ParentComponent extends Component { render() { return ( <ChildComponent name="First Child" />//prop هنا هي name ال ); } } const ChildComponent = (props) => { return <p>{props.name}</p>; //يتم استخدامها بهذا الشكل }; //الناتج سيكون كالتالي <p>First Child</p> state و useState نقوم بوضع البيانات الخاصة بالمكون بها ويقوم react بتتبع القيمة في حالة تغيرها الفرق بينهما أن لكل منهما طريقة استخدام مختلفة و state تستخدم في ال class-based أما ال useState تستخدم في ال functional useEffect تستخدم لتنفيذ مهمة معينة عن حدوث تغيير في قيمة متغير معين fetch هي الوسيلة الحديثة لعمل http request مشابه لل ()jQuery.ajax وهي خاصة بال javascript هذا تبسيط للمصطلحات يمكنك الأن التعمق في هذه المصطلحات حيث بها الكثير من التفاصيل
  24. بالإضافة للطريقة بالأعلى حيث تم استخدام ال javascript يمكنك عمل ذلك باستخدامcss فقط من خلال ال input:focus كالتالي <style> #id2{ display: none;// مخفي input هذا ال } #id1:focus #id2{ display: block; //id2 سيظهر ال input عند الضغط على هذا ال } </style> <body> <input id="id1"/> <input id="id2"/> </body> يمكنك عمل ما تريد بال css فقط بدون التدخل من الجافاسكربت
  25. هل لون العنصر two يبدو باللون الأبيض ؟ إذا كان كذلك تحتاج لوضع تنسيق العنصر two كالتالي .flex .two{ } لأن في التنسيق الأول تم إستخدام .flex و div (تم إستخدام class و عنصر ) بينما في التنسيق الثاني تم إستخدام .two فقط (تم إستخدام class فقط ) إذاً التنسيق الأول له الأولوية وبالتالي سيتم تنفيذ التنسيق الأول أما إذا كان للتنسيقات نفس الأولوية سيتم تنفيذ التنسيق الأخير
×
×
  • أضف...