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

Mustafa Suleiman

الأعضاء
 عرض الملف الشخصي  تصفح المحتوى

  • المساهمات

    10082

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

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

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

    303

 نوع المحتوى 

ريادة الأعمال

البرمجة

التصميم

DevOps

التسويق والمبيعات

العمل الحر

البرامج والتطبيقات

آخر التحديثات

قصص نجاح

أسئلة وأجوبة

كتب

دورات

كل منشورات العضو Mustafa Suleiman

  1. Mustafa Suleiman
    في البداية يجب إنشاء اتصال بقاعدة البيانات باستخدام مكتبة PDO وتوفير معلومات الاتصال بقاعدة البيانات مثل اسم المستخدم وكلمة المرور واسم قاعدة البيانات ومضيف قاعدة البيانات. $servername = "اسم_الخادم"; $username = "اسم_المستخدم"; $password = "كلمة_المرور"; $dbname = "اسم_قاعدة_البيانات"; try { $conn = new PDO("mysql:host=$servername;dbname=$dbname", $username, $password); $conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION); echo "تم الاتصال بنجاح"; } catch(PDOException $e) { echo "فشل الاتصال: " . $e->getMessage(); } ثم تحديد الجداول التي تحتاج إلى إجراء الإضافة إليها، ولنفترض وجود جدولين: "users" و "doctors". ثم استعادة البيانات التي ترغبين في إضافتها إلى جداول المستخدمين والأطباء باستخدام المتغيرات لتخزين القيم المستلمة من الصفحة الخاصة بالمشرف كالتالي: $username = $_POST['اسم_المستخدم']; $password = $_POST['كلمة_المرور']; $role = $_POST['الدور']; الآن لنجري عملية الإدخال في كل جدول بالإعتماد على الاستعلامات المعدة مسبقًا (Prepared Statements) لتأمين قاعدة البيانات من هجمات SQL Injection وتسهيل عملية الإدخال. try { // إضافة إلى جدول المستخدمين $stmt = $conn->prepare("INSERT INTO users (username, password) VALUES (:username, :password)"); $stmt->bindParam(':username', $username); $stmt->bindParam(':password', $password); $stmt->execute(); // إضافة إلى جدول الأطباء إذا كان الدور طبيبًا if ($role == 'طبيب') { $stmt = $conn->prepare("INSERT INTO doctors (username) VALUES (:username)"); $stmt->bindParam(':username', $username); $stmt->execute(); } echo "تمت الإضافة بنجاح"; } catch(PDOException $e) { echo "حدث خطأ أثناء الإضافة: " . $e->getMessage(); } ولا تنسي إغلاق الإتصال بقاعدة البيانات بعد الانتهاء من العمليات. $conn = null; // إغلاق الاتصال بقاعدة البيانات
  2. Mustafa Suleiman
    إذا أردت نصيحتي، فعليك بدورة تطوير التطبيقات باستخدام جافاسكريبت، حيث يتم فيها التركيز على تعلم لغة جافاسكريبت بشكل كبير وأيضًا ستتعلم الإطارات والمكتبات الخاصة باللغة وإمكانية تعلم تطوير المواقع وتطبيقات الهاتف المحمول وبرامج سطح المكتب. وذلك لن يتوفر لك في دورة تطوير واجهات المستخدم، والتي بالمناسبة تستطيع دراسة المسار الأول منها والذي يشرح أساسيات HTML, CSS,JS وjQuery ثم التطبيق وبناء موقع شخصي، وبذلك تكون قد جمعت بين الأمرين، وتستطيع الاستزادة أيضًا من مصادر أخرى على جوجل ويوتيوب.
  3. Mustafa Suleiman
    السؤال من المفترض أن يكون عن الفرق بين px و remو em وسأشرح لك الفرق بينهم والاستخدام المناسب لكل منهم. px (بكسل) px هي وحدة قياس ثابتة تعتمد على دقة الشاشة. تحدد قيمة بكسل حجم العنصر بنسبة مباشرة لعدد البكسلات المستخدمة. استخدام px مناسب في حالة رغبتك في تحديد حجم محدد وثابت للعنصر بشكل دقيق، مثل تحديد عرض صورة محدد بعرض محدد. rem (جذر النسبة المئوية) rem هي وحدة قياس تعتمد على حجم الجسم (root)، أي حجم الخط المعرف على العنصر الجذري (html) في الصفحة. تسمح وحدة rem بتعيين حجم العناصر بنسبة مئوية من الحجم الجذري أي حجم الخط في الجذر root وهو عنصر <html> الحاوي لكل الصفحة وحجم الخط الإفتراضي للصفحة هو 16px. واستخدام rem مناسب عندما ترغب في تطبيق تغييرات الحجم بنسبة مئوية واحدة على جميع العناصر داخل الصفحة، مما يتيح تحقيق تكيف جيد للشاشات المختلفة. ومن الأفضل استخدام rem من أجل تحقيق تجاوب للصفحة على الشاشات المختلفة وتجنب استخدام px إلا في حالات محددة. em em هي وحدة قياس تعتمد على حجم العنصر الذي يحتوي عليه النص. تحدد وحدة em حجم العنصر بنسبة مئوية من حجم النص الحالي للعنصر الأب وليس الجذر. استخدام em مناسب عندما ترغب في تعيين حجم العناصر بنسبة مئوية من حجم النص المحيط به، مما يسمح بتكيف أحجام العناصر بناءًا على حجم النص المستخدم فيها. وستجد هنا المزيد من الشرح: وحدات الأحجام للخطوط في تصميم الويب (PX مقابل EM و REM) شرح rem وem من موسوعة حسوب https://wiki.hsoub.com/CSS/length
  4. Mustafa Suleiman
    الأمر بسيط عليك بفصل النص عن الصورة بتضمين النص داخل عنصر مثل span ثم تنسيقه على أنه block من أجل أن يأتي على سطر منفصل وليس بجانب الصورة وقمت بتحسين أيضًا بتحسين الكود وإضافة أيقونات من خلال مكتبة font-awesome وإليك الكود النهائي بعد التعديل: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Books selling</title> <link rel="stylesheet" href="Book store.css"> <link rel="stylesheet" href="css/all.min.css"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" integrity="sha512-iecdLmaskl7CVkqkXNQ/ZH/XLlvWZOJyj7Yy7tcenmpD1ypASozpmT/E0iPtmFIB46ZmdtAc9eNBvH0H/ZpiBw==" crossorigin="anonymous" referrerpolicy="no-referrer" /> </head> <body> <div class="parent"> <div class="header"> <p><i class="fa-solid fa-phone"></i> call us</p> <p><i class="fa-solid fa-house"></i> home</p> <p><i class="fa-solid fa-magnifying-glass"></i> search</p> </div> <div class="main-content"> <P><img src="https://placehold.co/200x200" alt="" class="img-box"><br><span>العلوم</span></P> <P><img src="https://placehold.co/200x200" alt="" class="img-box"><br><span>الدراسات</span></P> <P><img src="https://placehold.co/200x200" alt="" class="img-box"><br><span>اللغة العربية</span></P> </div> <div class="footer"> <p>thank you</p> </div> </div> </body> </html> CSS .parent { width: 100%; display: grid; grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(7, 150px); gap: 10px; background: yellow; grid-template-areas: "head head head" "content content content" "content content content" "content content content" "content content content" "content content content" "content content content" "content content content" "foot foot foot"; } .parent div { background: violet; } .header { grid-area: head; background: blue; display: flex; padding-left: 15px; gap: 15px; } .main-content { grid-area: content; background: red; padding-left: 15px; display: flex; flex-wrap: wrap; gap: 10px; } .main-content p { display: flex; flex-direction: column; align-items: center; } .main-content img { margin-bottom: 10px; } .footer { grid-area: foot; background: green; }
  5. Mustafa Suleiman
    ما المشكلة أو السؤال؟ أرجو توضيح المطلوب تنفيذه أو المشكلة التي تواجهيها.
  6. Mustafa Suleiman
    هل السؤال متعلق بأحد الدورات؟ أرجو منك التعليق أسفل فيديو الدورة من أجل مساعدتك بشكل أفضل. وطرح الأسئلة العامة هنا في قسم أسئلة البرمجة. وعامًة undefined تعني أن المتغير لم يتم تعيين قيمة له بعد، وعندما يتم إنشاء متغير دون تعيين قيمة له، فإن قيمته الافتراضية ستكون undefined. أيضًا عندما تستدعي دالة أو تقوم بإرجاع قيمة من دالة دون تعيين قيمة لها، فإن القيمة التي تعود بها الدالة ستكون undefined. وعند الوصول إلى خاصية غير موجودة في كائن، فإن القيمة التي ستحصل عليها ستكون undefined. مثال: let z; console.log(z); // النتيجة ستكون undefined وقد يختلط الأمر عليك بين undefined وnull. وnull تعني أن المتغير قد تم تعيينه بقيمة فارغة أو أنه لا يشير إلى أي شيء وتستخدم null في الغالب عندما نود إعطاء متغير قيمة فارغة أو إزالة القيمة الحالية الموجودة في المتغير. وفي حالة استدعاء دالة وتحتاج إلى تمرير وسيطة (argument) لا تحمل أي قيمة، تستطيع تعيين قيمة null لتلك الوسيطة. مثال: let y = null; console.log(y); // النتيجة ستكون null أي أن الفرق بينهما يكمن في الاستخدام الدلالي.، حيث أن الـ undefined hستخدم عندما لا تتوفر قيمة معينة، بينما الـ null يُستخدم عندما تكون هناك حاجة لتعيين قيمة فارغة أو إزالة القيمة الحالية لمتغير معين.
  7. Mustafa Suleiman
    أرجو منك وضع الأسئلة الخاصة بالدورات أسفل الفيديو الخاص بالسؤال ليتم مساعدتك بشكل أفضل، ستجد تعليقات أسفل الفيديو، وطرح الأسئلة العامة هنا في قسم أسئلة البرمجة. والمشكلة لديك أنك استخدمت نسخة bootstrap-grid.rtl.min.css بدلاً من bootstrap.rtl.min.css. وفي حال استخدام النسخة الصحيحة من bootstrap ستعمل الأصناف لديك بدون مشكلة. حيث أن ملف bootstrap.rtl.min.css هو ملف الأساس لإطار عمل Bootstrap ويحتوي على مجموعة شاملة من التنسيقات والأنماط للعناصر المختلفة في صفحة الويب، ويتضمن نظام الشبكة الأساسي (grid system) الخاص بـ Bootstrap، الذي يستخدم نمط الشبكة الأساسي المبني على نظام العواميد (columns) والصفوف (rows) لتنظيم العناصر في صفحة الويب بشكل سهل ومرن. أما ملف bootstrap-grid.rtl.min.css، فهو ملف اختياري يتضمن فقط نظام الشبكة في Bootstrap دون التنسيقات الأخرى، وإذا كنت تريد استخدام نظام الشبكة فقط من Bootstrap دون إضافة أي تنسيقات أخرى، فاستخدام هذا الملف.
  8. Mustafa Suleiman
    حاول تحديث ملف روابط التنصل الخاص بك، ثم إنتظار فترة تتراوح ما بين أسبوع إلى شهر، ولكن لا مشكلة إذا لم يتم إزالة تلك الروابط، فجوجل لن تقوم بأخذ تلك الروابط في الحسبان عند تقييم موقعك. وستجد أن كل فترة هناك ورابط عديمة القيمة تأتي إلى موقعك، فعليك بالتنصل منها وإبقاء المفيد منها فقط، وأيضًا عليك بمحاربة ذلك ببناء محتوى طويل ومفيد للزائرين وليس محتوى ضعيف وقصير، خاصًة في حال عدم وجود روابط قوية لموقعك، وأيضًا الإشارة في المقالات لديك لمواقع خارجية ذات سلطة وتقييم عالي حيث أن المواقع المشبوهة لا تشير إلى تلك الموقع، وبالتالي ستتحسن نظرة جوجل لموقعك، وأيضًا لكي يتم ربط نشاط موقعك بنشاط تلك الموقع القوية والمؤثرة في مجال موقعك مثل مجال التقنية مثلاً. أي يجب توفير رابط واحد يشير إلى موقع خارجي مثل Microsoft أو أي رابط قوي آخر تستشهد به في مقالك. ومجال موقعك هو مجال خدمي، أي ستجد منافسة كبيرة به لذلك يجب تعيين شخص متخصص لتحسين الـ SEO لموقعك وبناء روابط.
  9. Mustafa Suleiman
    لا تشتت نفسك الآن، اعرف فقط ما عليك تعلمه أي ضع مسار تعليمي لك والتزم به لفترة 6 أشهر على الأقل، والطبع ستحتاج إلى تعلم إطار او مكتبة للواجهة الأمامية من أجل تصبح مطور واجهات أمامية محترف وتجد فرصة وظيفة في سوق العمل. لكن قبل تعلم React أو Angular عليك بإلقاء نظرة على الوظائف في بلدك، هل يوجد فرص لمطوري React بمستوى Entry Level أو Junior فإذا لم تجد ابحث عن وظائف Angular وفي الغالب ستجد أنه يوجد فرص لـ Angular أكثر من React بالنسبة للمبتدئين لكون React تتطلب خبرة أكثر من Angular حيث أن Angular بها قيود وقواعد عن كيفية تنفيذ المشاريع لكونه إطار عمل، بينما React هي مكتبة وتسطيع تنفيذ المشاريع بأكثر من طريقة ويجب تعلم كيفية الربط واستخدام المكتبات الأخرى بجانب React. ولكي تجد فرص كمطور React، عليك ببناء مشاريع كاملة متوسطة الحجم، أي أكثر من مشروع وليس فقط الإكتفاء بالمشاريع التي يتم توفيرها في الدورات مثل دورة تطوير التطبيقات باستخدام لغة JavaScript في أكاديمية حسوب، والتي يوجد بها أكثر من مشروع لوضعه في معرض أعمالك، لكن يجب تنفيذ المزيد وبأفكار مختلفة وبذلك تصبح بمستوى Junior وليس Entry Level. حيث أن Entry Level تعني شخص يعلم الأساسيات ويستطيع كتابة الكود لكن ليس لديه خبرة بكيفية تنفيذ المشاريع، أي لديه عند إنتهائك من مسار تعليمي أنت بذلك تصبح Entry Level. بينما بعد فترة 6 أشهر أخرى مثلاً ونفذت خلالها مشاريع أنت الآن في مستوى Junior لكن بشرط الإجتهاد خلال تلك الفترة فمن المفترض أن Junior تعني خبرة سنة لكن تستطيع الإجتهاد والحصول على خبرة خلال 6 أشهر سواء بتنفيذ المشاريع بمفردك أو العمل الحر، وهناك أمر هام وهو أن فترة دراستك لمسار تعليمي وهي 6 أشهر لا تعتبر خبرة فالبعض يخطيء في ذلك، بل ما بعدها هي مرحلة اكتساب الخبرة من خلال تنفيذ المشاريع والتعلم من الأخطاء وتعلم تقنيات جديدة والتعمق في اللغات والتقنيات التي تستخدمها من خلال المشاريع.
  10. Mustafa Suleiman
    هل تقصد تصميم واجهة مستخدم؟ بخصوص الواجهة التي أشرت إليها في الصورة فهى بسيطة، تستطيع تنفيذها باستخدام HTML, CSS, JS. أما الواجهات المعقدة نسبيًا، فيتم تصميمها أولاً باستخدام أدوات مثل Figma أو Adobe XD، أما إذا كانت بسيطة فيتم تصميمها مباشرًة باستخدام الكود كما ذكرت. وعليك بتحويل ذلك القالب إلى XHTML من أجل استخدامه كقالب لمنصة بلوجر، وتستطيع البحث عن "دورة تصميم قالب بلوجر من الصفر " وستجد شرح وافي لكيفية فعل ذلك. وبخصوص تعلم لغات الواجهة الأمامية فإليك المصادر التالية: دروس HTML دروس CSS https://wiki.hsoub.com/الصفحة_الرئيسية
  11. Mustafa Suleiman
    الخطأ يعني طريقة GET لا تدعم عملية الإرسال (POST) ولن تستطيع استخدام GET لإضافة عناصر جديدة إلى قاعدة البيانات، بل يتم استخدام طريقة POST بدلاً من ذلك. ومثلاً إذا كنت تستخدم لغة جافاسكريبت فإليك مثال بالإعتماد على مكتبة axios لإرسال طلب إضافة: // استيراد المكتبة اللازمة لإجراء طلبات الشبكة import axios from 'axios'; // بيانات العنصر الجديد الذي سيتم إضافته إلى قاعدة البيانات const newItem = { name: 'اسم العنصر', description: 'وصف العنصر' }; // إجراء طلب POST لإضافة العنصر إلى قاعدة البيانات axios.post('رابط الخادم/المسار', newItem) .then(response => { console.log('تمت إضافة العنصر بنجاح!', response.data); }) .catch(error => { console.error('حدث خطأ أثناء إضافة العنصر:', error); }); وإذا كنت تستخدم لغة PHP فإليك مثال: <?php // بيانات العنصر الجديد الذي سيتم إضافته إلى قاعدة البيانات $newItem = array( 'name' => 'اسم العنصر', 'description' => 'وصف العنصر' ); // معلومات الاتصال بقاعدة البيانات $servername = 'اسم خادم قاعدة البيانات'; $username = 'اسم مستخدم قاعدة البيانات'; $password = 'كلمة مرور قاعدة البيانات'; $dbname = 'اسم قاعدة البيانات'; // إنشاء اتصال بقاعدة البيانات $conn = new mysqli($servername, $username, $password, $dbname); // التحقق من نجاح الاتصال if ($conn->connect_error) { die('فشل الاتصال بقاعدة البيانات: ' . $conn->connect_error); } // استعلام SQL لإضافة العنصر إلى قاعدة البيانات $sql = "INSERT INTO اسم_جدول_قاعدة_البيانات (اسم_العمود_1, اسم_العمود_2) VALUES ('" . $newItem['name'] . "', '" . $newItem['description'] . "')"; // تنفيذ الاستعلام والتحقق من نجاحه if ($conn->query($sql) === TRUE) { echo 'تمت إضافة العنصر بنجاح!'; } else { echo 'حدث خطأ أثناء إضافة العنصر: ' . $conn->error; } // إغلاق الاتصال بقاعدة البيانات $conn->close(); ?> وبالطبع عليك استبدال "اسم_خادم_قاعدة_البيانات" و "اسم_مستخدم_قاعدة_البيانات" و "كلمة_مرور_قاعدة_البيانات" و "اسم_قاعدة_البيانات" و "اسم_جدول_قاعدة_البيانات" و "اسم_العمود_1" و "اسم_العمود_2" بالقيم المناسبة وفقًا لبيئة قاعدة البيانات لديك، وأيضًا تعديل الاستعلام SQL وفقًا لهيكل جدول قاعدة البيانات.
  12. Mustafa Suleiman
    في البداية أرجو منك طرح السؤال أسفل فيديو الدورة الخاص به (في التعليقات) ليتم مساعدتك بشكل أفضل، وطرح الأسئلة العامة هنا في قسم أسئلة البرمجة. وعليك بقراءة رسالة الخطأ فهى تخبرك بسبب المشكلة في الكثير من الأحيان وهي "Identifier 'Person’ has already been declared" وتعني أنك قد قمت بتعريف متغير أو معرف بالاسم "Person" مرتين في نفس النطاق (scope) في الكود. وذلك صحيح، حيث أنك في النطاق العالمي أي خارج الدوال والكائنات، قمت بتعيين دالة باسم Person في النطاق العالمي، ثم بالأسفل قمت بإعلان متغير باسم Person وذلك غير صحيح، حيث أنه أصبح هناك معرفان باسم Person في النطاق العالمي الآن. ولذلك عليك بتغيير اسم المتغير Person إلى person أو person1. ولاحظ أن متغير person يختلف عن Person لكونه يبدأ بحرف p صغير، لكون لغة جافاسكريبت حساسة للحروف case-sensitive. لكن من الأفضل استخدام person1 لكي لا تشتت نفسك ويسهل قراءة الكود.
  13. Mustafa Suleiman
    الحل الأفضل بالفعل هو الإعتماد على docker ومن المفترض أنه إذا قمت بتصدير المشروع الذي يتكون من Django وReact وMySQL باستخدام Docker وقمت بتشغيله بنجاح على نظامك الخاص، فإنه ينبغي أن يعمل بشكل سليم على نظام العميل أيضًا، طالما تم استيراد Docker Image وتشغيله بشكل صحيح. وعند تلقي العميل ملف Docker المضغوط (.tar) الذي أرسلته، عليه باتباع الخطوات التالية لتشغيله: أولاً يحتاج العميل إلى تثبيت Docker وذلك متوفر من خلال الموقع الرسمي: https://www.docker.com/products/docker-desktop/ وبعد ذلك عليه استيراد Docker Image الموجود في ملف الضغط باستخدام الأمر التالي في واجهة الأوامر، بشرط أن يكون Docker مثبتًا وتشغيله بنجاح: docker load -i path/to/your/docker_image.tar حيث path/to/your/docker_image.tar هو المسار الكامل إلى ملف Docker Image المضغوط الذي تم تلقيه. وبمجرد استيراد نسخة Docker بنجاح، بإمكان للعميل تشغيل Docker Container باستخدام الأمر التالي: docker run -p 3000:3000 my_project:latest وبالطبع استبدل "my_project:latest"، باسم ملف الـ Docker الذي تم استيراده. ولاحظ في الأمر تم توجيه المنفذ 3000 داخل الحاوية إلى المنفذ 3000 على جهاز العميل، وبالتالي، سيستطيع العميل الوصول إلى التطبيق عن طريق استخدام http://localhost:3000 في المتصفح.
  14. Mustafa Suleiman
    في البداية تحتاج إلى استيراد الحزمة المطلوبة من React و Yup و axios وتعيين الدوال المستخدمة بشكل صحيح، ولديك أخطاء أخرى في الكود هي كالتالي: هناك خطأ في استخدام الدوال المتعلقة بـ useState، حيث يجب عليك كتابة useState بدلاً من usestate، أيضًا يجب إزالة المسافة بين set و errors في السطر الأول من الدالة. ولا يجب وضع كود الـ export بداخل الدالة بل خارجها. هناك خطأ في استخدام الدوال المتعلقة بـ useFormik، والصحيح هو أن تكون initialValues و validationSchema و onSubmit خارج الكائن وليس داخله. في دالة register، تقوم بإرسال البيانات إلى رابط الـ API ولكن لم تقم بالتعامل مع الرد المستلم. يجب أن تحقق إذا كانت العملية ناجحة (data.message === 'success') وتتبع الخطوات المناسبة بناءً على ذلك. يجب أن يكون لديك دالة handleSubmit تستدعي دالة formik.handleSubmit. عليك استخدام onChange بدلاً من onchange في العناصر النمطية لـ HTML. والكود بعد تصحيح الأخطاء سيكون بالشكل التالي: import React, { useState } from "react"; import { useFormik } from "formik"; import * as Yup from "yup"; import axios from "axios"; const schema = Yup.object({ email: Yup.string().required("Email is required").email("Not valid email"), password: Yup.string() .required("Password is required") .matches(/^[A-Z][a-z0-9]{4,8}$/, "Invalid password format"), }); export default function Login() { const [errors, setErrors] = useState([]); const navigate = useNavigate(); const [statusError, setStatusError] = useState(""); const formik = useFormik({ initialValues: { email: "", password: "", }, validationSchema: schema, onSubmit: sendRegisterData, }); async function sendRegisterData(values) { try { const { data } = await axios.post( "https://preicous-bass-tights.cyclic.app/auth/login", values ); console.log(data); if (data.message === "success") { setErrors([]); setStatusError(""); navigate("/login"); console.log("welcome"); } else { setErrors(data.err[0]); } } catch (err) { setStatusError(err.response.data.message); } } return ( <div className="container mt-5 pt-5"> <form className="w-50 m-auto text-center" onSubmit={formik.handleSubmit}> <div className="mb-3"> <label htmlFor="exampleInputEmail1" className="form-label"> Email address </label> <input type="email" className="form-control" id="exampleInputEmail1" value={formik.values.email} onChange={formik.handleChange} name="email" aria-describedy="emailhelp" /> </div> <div className="mb-3"> <label htmlFor="exampleInputName" className="form-label"> Name </label> <input type="text" className="form-control" id="exampleInputName" name="name" /> </div> <div className="mb-3"> <label htmlFor="exampleInputPassword1" className="form-label"> Password </label> <input type="password" className="form-control" id="exampleInputPassword1" name="password" value={formik.values.password} onChange={formik.handleChange} /> </div> </form> </div> ); }
  15. Mustafa Suleiman
    ما فهمته أنك تريدين إرسال البيانات إلى كل من جدول التشخيص وجدول المرضى في قاعدة البيانات باستخدام PHP، صحيح؟ ستحتاجي إذن للقيام بالتالي: تعريف المتغيرات التي تحمل القيم التي تم جمعها من النموذج HTML الخاص بك، مثل $doctor_id و $nut_id و $p_id و $date وغيرها من المتغيرات. استخدمي جملة SQL INSERT INTO لإدخال البيانات في جدول التشخيص باستخدام الاستعلام $sql، ثم تنفيذ هذا الاستعلام باستخدام mysqli_query(). استخدمي جملة SQL INSERT INTO لإدخال البيانات في جدول المرضى باستخدام الاستعلام $sql2، وتنفيذ ذلك الاستعلام أيضًا باستخدام mysqli_query(). وإليك الكود بعد بعد تنفيذ ما سبق: if (isset($_POST['save'])) { $doctor_id = $_SESSION["D_id"]; $nut_id = $_POST['nut_id']; $p_id = $_POST['pat_id']; $date = $_POST['date']; $diabetess = $_POST['diabetess']; $fats_checkup = $_POST['fats_checkup']; $hypertension = $_POST['hypertension']; $dia_description = $_POST['dia_description']; $med_description = $_POST['med_description']; $dia_id = $_POST['dia_id']; // Check if the allergy checkbox is checked if (isset($_POST['allergy-check']) && $_POST['allergy-check'] == 's1') { $allergy = $_POST['allergy_area']; } else { $allergy = ''; } if (isset($_POST['state'])) { $states = $_POST['state']; } if (isset($_POST['if_need_admitting']) && $_POST['if_need_admitting'] == 'yes') { $dormitory = $_POST['dormisory']; $number_room = $_POST['number_room']; } // Insert the patient data into the diagnosis table $sql = "INSERT INTO diagnosis (doctor_id, nutrition_id, patient_id, date, diabetess, state, fats_checkup, hypertension, allergy, dia_description, med_description) VALUES ('$doctor_id', '$nut_id', '$p_id', '$date', '$diabetess', '$states', '$fats_checkup', '$hypertension', '$allergy', '$dia_description', '$med_description')"; // Insert the patient data into the admit table $sql2 = "INSERT INTO admit (dia_id, nut_id, dormitory, room) VALUES ('$dia_id', '$nut_id', '$dormitory', '$number_room')"; $result = mysqli_query($conn, $sql); $result2 = mysqli_query($conn, $sql2); // تحقق من نتائج التنفيذ if ($result && $result2) { // تمت الإضافة بنجاح إلى كلا الجدولين echo "تمت إضافة البيانات بنجاح."; } else { // حدث خطأ أثناء إضافة البيانات echo "حدث خطأ أثناء إضافة البيانات."; } } وعليك بتعديل المتغير $conn في mysqli_query($conn, $sql) و mysqli_query($conn, $sql2) ليكون متغير الاتصال الصحيح بقاعدة البيانات.
  16. Mustafa Suleiman
    الإجابة ببساطة هي نعم في حال كنت مصمم وليس مبرمج واجهات أمامية UI\UX. ويجب أن تصحح مفهومك عن أمرًا ما، وهو في حالة أنك تريد أن تصبح مطور واجهات أمامية فعليك بعدم تشتيت نفسك بالأدوات والمنصات المختلفة، والتركيز على تعلم اللغات الأساسية وهي HTML, CSS, JS وبالأخص التركيز على JS لكونها لغة البرمجة الأولى لك، والتطبيق على مشاريع بمفردك وخاصًة المشاريع التي تركز على جافاسكريبت وذلك بعد تعلم HTML وCSS والتطبيق عليهما أيضًا. أما منصات الـ Low code والـ No code فهي مخصصة للمشاريع البسيطة والغير ديناميكية كالتي يمكن بنائها عن طريق إطارات ومكتبات الواجهة الأمامية مثل React. ومنصة Webflow هي منصة No code بمعنى السحب والإلقاء من أجل بناء الواجهة بدون كتابة كود، وهي لها استخدامتها ويوجد لها مشاريع على مواقع العمل الحر الأجنبية ولا مشكلة في ذلك. لكن يتم استخدامه بكثرة من قبل مصممي الواجهة الأمامية UI\UX حيث يوفرون تصميم للواجهة مع إمكانية تصميم الموقع وتسليمه للعميل من خلال Webflow وذلك لكونه لا يتطلب كتابة كود. أما أنت فتخصصك هو مبرمج واجهة أمامية وليس مصمم، مع أنك قادر على التصميم بنسبة معينة وهو ليس من إختصاصك، لكنك إختصاصك هو تخصيص الموقع وإضافة الميزات التي تريدها بدون أي قيود كالتي توجد في Webflow. ولا يوجد مشكلة في تعلم المنصة لزيادة مهاراتك وما أنت قادر على تقديمه للعملاء عند العمل على مواقع العمل الحر، وأيضًا تستطيع إنشاء موقع وعرض الفكرة أو التصميم المبدأي بشكل سريع قبل كتابة الكود في حال لم تريد استخدام أداة مثل Figma. وأنصحك بقراءة النقاش التالي:
  17. Mustafa Suleiman
    هل تقصد ملخصات نصية؟ لا يتوفر ذلك حاليًا، والمتوفر فقط هي الملفات الخاصة بكل مسار في حال لزم ذلك. وأيضًا رابط لمستودع المشروع به الكود النهائي للمشروع وذلك في المسارات الخاصة بالمشاريع العملية. وإذا أردت ملخص للغة أو إطار معين أو مكتبة تستطيع البحث عن cheat sheet ثم اسم اللغة مثلاُ وليكن js إذا ستبحث عن cheat sheet for js وستجد ملخصات مثل التالي: https://htmlcheatsheet.com/js/ http://cheatsheets.shecodes.io/javascript وأيضًا يوجد موسوعة حسوب وبها شرح لأغلب اللغات والمكتبات: https://wiki.hsoub.com/الصفحة_الرئيسية وأنصحك بالإطلاع على التالي:
  18. Mustafa Suleiman
    بعد الإنتهاء من الدورة وإجتياز الإختبار والحصول على الشهادة فهناك فترة 6 أشهر من موعد اجتيازك للامتحان سيتم مساعدتك فيها للحصول على عمل، وذلك بإرشادك لتحسين السيرة الذاتية الخاصة بك وتحسين معرض الأعمال لديك وكيفية التقديم على وظائف سواء من خلال العمل الحر أو وظيفة. وحتى بعد استكمال الدورة والحصول على شهادة تستطيع طرح الأسئلة هنا بعد البحث، وسيتم مساعدتك من قبل الجميع. أولاً عليك بتحديد ما هي الوظيفة التي تريدها، وأنت اخترت مجال تطوير الواجهة الأمامية، وهنا عليك بالتركيز على اللغات الأساسية HTML, CSS,JS وخاصًة JS حيث أنها لغة البرمجة الأولى لك وستجد في المسار الأول لدورة تطوير التطبيقات باستخدام جافاسكريبت شرح إضافي للأساسيات أنصحك بالإطلاع عليها. بعد ذلك ستجد مشاريع على مواقع العمل الحر وهم مستقل وخمسات تتطلب المهارات التي تعملتها وهي HTML, CSS,JS بجانب Bootstrap وjQuery ولكن تلك المشاريع المنافسة عليها محتدة بعض الشيء، وما تعلمته هو هام جدًا وهو الأساس بلا شك ويجب تعلمه في البداية. ولكن سيتعين عليك أن تعلم إطار عمل أو مكتبة مثل React أو Angular أو Vue.js، وذلك ضروري لكي يتم قبولك في وظيفة بالشركات ومن غير إطار العمل من الصعب إيجاد وظيفة بدوام كامل. وتستطيع تحديد الإطار أو المكتبة المطلوبة في سوق العمل لديك من خلال البحث عن وظائف Front-End على مواقع مثل LinkedIn وIndeed وغيرها تبعًا للمواقع الشهيرة في بلدك. أي عليك تحديد هل تريد العمل على مواقع العمل الحر أو تريد وظيفة، من أجل تحديد اللغات والمهارات المطلوبة التي يجب عليك تعلمها، ألقي نظرة على المشاريع أو متطلبات الوظيفة وستفهم ما عليك تعلمه. وأنصحك بالإطلاع على التالي: وستجد في مدونة مستقل دليل للمستقلين: https://blog.mostaql.com/tag/mostaql-freelancers-guide/
  19. Mustafa Suleiman
    الرسالة تعني أن المتغير $nmaes غير معرف ويتم تمرير قيمة null إلى دالة array_pad() وأيضًا اسم المتغير غير صحيح فهو names. أي يجب تعريف المتغير $names وتمرير قيمة مصفوفة إليه قبل استخدامه في دالة array_pad() بتحديد المصفوفة التي ترغب في تعبئتها وتمريرها كمعامل أول للدالة array_pad() كالتالي: $names = ['John', 'Sarah', 'Michael']; وستتمكن الآن من تنفيذ الكود بنجاح دون أي أخطاء، حيث ستقوم array_pad() بتعبئة المصفوفة $names بقيمة 'Hello' لتصل إلى طول 10 عناصر، ومن ثم ستتم طباعة المصفوفة المعبأة باستخدام print_r(). والكود النهائي هو: $names = ['John', 'Sarah', 'Michael']; echo '<pre>'; print_r(array_pad($names, 10, 'Hello')); echo '</pre>';
  20. Mustafa Suleiman
    أولاً عليك إنشاء قالب HTML لعرض النموذج على الواجهة الأمامية للموقع (website باستخدام قالب النموذج المدمج في Odoo أو تخصيص قالب خاص بك، وتصميم النموذج وتضمين الحقول اللازمة مثل name و partner_id و partner_mobile وما إلى ذلك، وتأكد من تعيين الأسماء الصحيحة للحقول وإضافة البيانات اللازمة للتحقق من صحة المدخلات. ثم بناء وحدة (module) مخصصة لإدارة عملية التسجيل على النموذج في الواجهة الأمامية، عن طريق إنشاء ملف Python جديد بالاسم الذي ترغب فيه، مثلاً controllers.py. وفي الملف controllers.py، قم بتعريف وحدة التحكم الخاصة بك واستيراد الوحدات اللازمة كالتالي: from odoo import http from odoo.http import request ولا تنسى تعريف المسار (route) الذي سيتم استخدامه لعرض النموذج ومعالجة بياناته، بواسطة الديكوريتور http.route لتحديد المسار وطريقة الوصول (GET أو POST) والوظائف المرتبطة به كالتالي: class MaintenanceReceiptController(http.Controller): @http.route('/maintenance/receipt', type='http', auth='public', website=True, methods=['GET', 'POST']) def maintenance_receipt_form(self, **kw): # عرض النموذج ومعالجة بياناته return http.request.render('your_module.template_name', {}) والآن تعريف دالة لمعالجة بيانات النموذج عند الإرسال واستخدامها لاستلام البيانات المرسلة من النموذج وإنشاء سجل جديد في نموذج maintenance.receipt: class MaintenanceReceiptController(http.Controller): @http.route('/maintenance/receipt', type='http', auth='public', website=True, methods=['GET', 'POST']) def maintenance_receipt_form(self, **kw): if request.httprequest.method == 'POST': # استلام البيانات من النموذج name = kw.get('name') partner_id = kw.get('partner_id') partner_mobile = kw.get('partner_mobile') partner_main = kw.get('partner_main') building_name = kw.get('building_name') unit_name = kw.get('unit_name') # إنشاء سجل جديد في maintenance.receipt receipt = request.env['maintenance.receipt'].sudo().create({ 'name': name, 'partner_id': partner_id, 'partner_mobile': partner_mobile, 'partner_main': partner_main, 'building_name': building_name, 'unit_name': unit_name, }) # يمكنك تنفيذ أي إجراءات إضافية هنا return http.request.render('your_module.template_name', {}) والآن نأتي لخطوة تعريف قالب (template) لعرض النموذج ورسالة تأكيد بعد تسجيل البيانات بنجاح، بالإعتماد على قالب HTML لإظهار رسالة تأكيد أو إعادة توجيه المستخدم إلى صفحة أخرى، وتستطيع استخدام الديكوريتور http.route لتحديد القالب المستخدم كما يلي: class MaintenanceReceiptController(http.Controller): @http.route('/maintenance/receipt', type='http', auth='public', website=True, methods=['GET', 'POST']) def maintenance_receipt_form(self, **kw): if request.httprequest.method == 'POST': # استلام البيانات من النموذج name = kw.get('name') partner_id = kw.get('partner_id') partner_mobile = kw.get('partner_mobile') partner_main = kw.get('partner_main') building_name = kw.get('building_name') unit_name = kw.get('unit_name') # إنشاء سجل جديد في maintenance.receipt receipt = request.env['maintenance.receipt'].sudo().create({ 'name': name, 'partner_id': partner_id, 'partner_mobile': partner_mobile, 'partner_main': partner_main, 'building_name': building_name, 'unit_name': unit_name, }) # رسالة تأكيد أو إعادة توجيه المستخدم إلى صفحة أخرى return http.request.render('your_module.template_success', {}) return http.request.render('your_module.template_name', {}) واستبدل 'your_module.template_name' باسم قالب النموذج لديك و'your_module.template_success' باسم قالب الرسالة التأكيدية. وأخيرًا تسجيل وحدة التحكم الخاصة في ملف __manifest__.py لتمكينها في Odoo بإضافة اسم الملف واسم الوحدة ومسار الملفات وأي تبعيات أخرى.
  21. Mustafa Suleiman
    أرفق مجلد المشروع لتفقد المشكلة.
  22. Mustafa Suleiman
    يجب تعيين خاصية charset، حيث أن خاصية charset في Nodemailer تُستخدم لتعيين ترميز الحروف للنصوص الموجودة في البريد الإلكتروني لتعيين ترميز الحروف بشكل صحيح مهم لضمان عرض النصوص بشكل صحيح في البريد الإلكتروني، والسبب هو أن ترميز UTF-8 يدعم العديد من اللغات، بما في ذلك العربية. ونستخدم تلك الخاصية في كائن options كالتالي: const nodemailer = require("nodemailer"); const mailOptions = { from: "sender@example.com", to: "recipient@example.com", subject: "This is an email with Arabic text", text: "هذا هو نص بريد إلكتروني باللغة العربية", charset: "utf-8" }; nodemailer.sendMail(mailOptions, (error, success) => { if (error) { console.log(error); } else { console.log("Email sent successfully!"); } }); وقد يفيدك تحديد خاصية encoding إلى utf-8 مع أنك لست بحاجة إلى ذلك فهى محددة إفتراضيًا إلى utf-8. وتستطيع تفقد جميع الخصائص من خلال المستند الرسمي: https://nodemailer.com/message وإذا استمرت المشكلة فحاول تجربة استخدام مكتبات أخرى بدلاً من Nodemailer ومنها: SendGrid Mailgun SMTP.js
  23. Mustafa Suleiman
    الخطأ من نوع SQL syntax أي هناك خطأ في كتابة كود SQL بشكل غير صحيح، عليك بالتحقق من تنسيق الجملة وضمان أنها تتوافق مع قواعد اللغة SQL والتنسيق الصحيح لقواعد البيانات الخاصة بك. وإليك بعض النقاط التي يجب مراعاتها: يجب أن جميع القيم محاطة بعلامات اقتباس صحيحة، فإذا كانت القيم هي نصوص، فعليك بإحاطتها بعلامات اقتباس واحدة أو علامتي اقتباس مزدوجة، كالتالي: '2019-03-06' التأكد من أن جميع القيم الرقمية غير فارغة وتحتوي على أرقام صحيحة. التحقق من أن الفواصل بين القيم في الجملة القيمة صحيحة ومفصولة بفواصل قائمة كالتالي: 'value1', 'value2', 'value3' يجب أن تكون الأعمدة في جدول قاعدة البيانات محددة بشكل صحيح وتتوافق مع ترتيب القيم في الجملة. استخدام وظيفة التحقق من الأخطاء في PHP للكشف عن أي أخطاء في جملة الاستعلام الخاصة بك، مثل mysqli_error(). وإليك مثال لكتابة استعلام SQL: $sql = "INSERT INTO table_name (column1, column2, column3, column4, column5, column6) VALUES ('value1', '2019-03-06', '2', 'can_walk', '30', '66')"; واستبدلي"table_name" بالاسم الصحيح للجدول الذي تريد إدخال البيانات إليه، وأيضًا "column1" وما يليها بأسماء الأعمدة الصحيحة في الجدول.
  24. Mustafa Suleiman
    المطلوب هو كتابة اسم التطبيق ووصف له باللغة العربية لكن عليك كتابة ذلك بناءًا على القواعد الخاصة بمتجر آبل، وستجدها من خلال الرابط التالي وأنصحك بقرائتها بالكامل لتجنب الكثير من المشاكل: https://developer.apple.com/app-store/review/guidelines/#:~:text=App names must be limited,specific to the metadata type. والقواعد بخصوص اسم التطبيق (App Name) هي: يجب أن يكون اسم التطبيق فريدًا وغير مكرر. ينبغي تعيين كلمات رئيسية تصف تطبيقك بدقة. يجب تجنب تضمين علامات تجارية لشركات أخرى أو أسماء تطبيقات شهيرة أو معلومات حول الأسعار أو عبارات غير ذات صلة بهدف استغلال النظام. قواعد الوصف (Description): يجب أن يكون الوصف واضحًا وموجزًا، ويشرح فوائد وميزات التطبيق. يجب تجنب تضمين الأسعار أو المصطلحات أو الوصف الذي لا يتعلق بنوع البيانات المحدد. يمكن استخدام عناوين فرعية (subtitles) لتوفير سياق إضافي للتطبيق، ولكن يجب أن تتبع قواعد المحتوى القياسية وعدم تضمين محتوى غير لائق أو إشارة إلى تطبيقات أخرى أو تقديم مزاعم غير قابلة للتحقق. وبالطبع يجب أن يكون الاسم والوصف مماثل للنسخة الإنجليزية من التطبيق. وإليك مثال لتوضيح الأمر بناءًا على تلك القواعد: اسم التطبيق (App Name): FitnessTracker وصف التطبيق (App Description): "تطبيق FitnessTracker هو شريكك الرقمي لتحقيق أهداف اللياقة البدنية. قم بتتبع نشاطك الرياضي والتمارين اليومية ومراقبة تقدمك بسهولة، يوفر التطبيق واجهة بسيطة وسهلة الاستخدام لتسجيل السعرات الحرارية، ومسافات المشي والجري، والوقت المستغرق في التمارين، بإمكانك تحليل بياناتك وتتبع تطورك على مدار الأسابيع والشهور احصل على تحفيز مستمر من خلال تحديات ومكافآت مشوقة، جرّب تطبيق FitnessTracker اليوم واجعل لياقتك أفضل."
  25. Mustafa Suleiman
    أنت تريد أن تصبح مطور واجهات أمامية صحيح؟ وأقصد بمطور هنا ليس مصمم بل مطور حيث أن المصمم لا يحتاج أصلا ً إلى تعلم HTML,CSS,JS بل قد يتعلم ذلك لزيادة مهاراته وقيمته في سوق العمل ويصبح UI developer. لكن أنت تريد تحويل التصاميم إلى كود وتطوير الواجهة أي مبرمج، ولذلك أنت بحاجة إلى تعلم لغة برمجة وهي جافاسكريبت ولا غنى عن التعمق في جافاسكريبت وتعلم كل الأساسيات ثم التطبيق على المشاريع للمبتدئين وستجدها من خلال البحث على يوتيوب ولا تنزعج إذا وجدت أشياء جديدة لم تتعلمها في تلك المشاريع فهو المطلوب أصلاً أن تتعلم أشياء جديدة وخلق تحدي لك وزيادة معلوماتك. وبعد الإنتهاء تستطيع الإنتقال إلى مشاريع متقدمة من أجل زيادة معرفتك بلغة جافاسكريبت، لكن أولاً يجب التركيز بشدة على الأساسيات، أي دراسة الأساسيات في دورة تطوير واجهات المستخدم أولاً ثم الإنتقال إلى الأساسيات الموجودة في دورة جافاسكريبت. ثم تنتقل إلى اليوتيوب وابحث عن مشاريع جافاسكريبت للمبتدئين وطبق على أكثر من مشروع وابحث واقرء في حال واجهتك مشاكل لكن فكر أولاً في حل قبل البحث، وفي حال تعثر عليك تنفيذ المطلوب، قم بمشاهدة الشرح في الفيديو ولا مشكلة في ذلك فأنت ما زلت تتعلم لكن بعد المحاولة أولاً. وبعد ذلك عد لدورة تطوير واجهات المستخدم لاستكمالها وتنفيذ المشاريع العملية التي بها وهي إنشاء المواقع.
×
×
  • أضف...