Najah Alsaker
-
المساهمات
476 -
تاريخ الانضمام
-
تاريخ آخر زيارة
-
عدد الأيام التي تصدر بها
4
نوع المحتوى
ريادة الأعمال
البرمجة
التصميم
DevOps
التسويق والمبيعات
العمل الحر
البرامج والتطبيقات
آخر التحديثات
قصص نجاح
أسئلة وأجوبة
كتب
دورات
كل منشورات العضو Najah Alsaker
-
في البداية ساشرح لك ماهي وظيفة تطوير واجهات المستخدم التي تستخدم هذه اللغات الثلاثة ان صفحات الويب التي تقوم بزيارتها كل يوم على متصفح الانترنت مبينة بثلاث تقنيات اساسية وهم ال HTML CSS JS ولا يمكننا الاستغناء عن واحدة منهم ان اردنا ان تظهر الصفحة بشكل احترافي , واكبر مثال على ذلك هو صفحة الويب التي تشاهدها الان امامك دعني اعطيكي لمحة سريعة عن كل واحدة منهم HTML تعبر لغة ال html عن الهيكل الاساسي لبناء صفحة الويب ويمكننا اضافة النصوص والصور والفيديوهات وغيرها الكثير الى صفحتنا من خلالها عن طريق اضافة بعض الوسوم التي يمكن للمتصفح قرائتها وتفسيرها CSS تستخدم لغة ال css في انشاء تنسيقات لعناصر ال html , وهي اللغة المسؤولة عن اعطاء تصميمات لصفحات الويب ك الالوان والتنسيقات وجعلها متجاوبة مع كافة انواع الشاشات javascript تعتبر هذه اللغة حياة الموقع حيث انه يمكنك من خلالها اضافة تفاعلات للموقع الخاص بك وجعله غير ثابت او اعتيادي لم ارد ان اطل كثيرا بالشرح لأنني ساترك لك مقالات في اسفل التعليق تشرح لك بالتفصيل عن كل لغة ولكن هذا ما يحب ان تعرفه بشكل اساسي حاليا دعني اعطيك مثال عملي لانشاء عنصر ساعة كالصورة المرفقة كي تتوضح الفكرة لديك اكثر اولا ف لنبدأ بانشاء ملف index.html ونضع هذه الشيفرة بداخله <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Digital Clock</title> <style> /* ثم باضافة شيفرة ال css هنا اسفل هذا التعليق */ </style> </head> <body> <div class="clock"> <span id="hours">00</span>: <span id="minutes">00</span>: <span id="seconds">00</span> </div> <script> // هنا ثم باضافة كود الجافا سكربت اسفل هذا التعليق </script> </body> </html> هنا قمت بكتابة وسوم html للحصول على صف يحتوي على ارقام الساعة لتظهر النتيجة كالأتي ثم دعنا الان ان نضيف شيفرة ال CSS في المكان الذي حددته لك بالكود الماضي .clock { font-family: Arial, sans-serif; font-size: 48px; color: #fff; background-color: #008CBA; width: 250px; padding: 20px; border-radius: 50px; font-weight: bold; border: 5px solid #005566; } باستخدام تنسيقات ال css تمكنت من الحصول على هذا الشكل الذي اريده ولكن لهذا الوقت ان هذا العنصر ثابت لذلك حان الوقت الان لدور الجافا سكريبت لتقوم بجعله يتحرك ويقوم باظهار الساعة الفعلية لذلك دعنا نقوم باضافة الكود التالي في المكان المخصص له الذي قمت بحديده لك سابقا function updateTime() { const now = new Date(); const hours = String(now.getHours()).padStart(2, '0'); const minutes = String(now.getMinutes()).padStart(2, '0'); const seconds = String(now.getSeconds()).padStart(2, '0'); document.getElementById('hours').textContent = hours; document.getElementById('minutes').textContent = minutes; document.getElementById('seconds').textContent = seconds; } setInterval(updateTime, 1000); updateTime(); الأن ستظهر النتيجة كالتالي مثل ما نريدها تماما اظن انك اصبحت الان على دراية كاملة بطريقة عمل كل لغة ولماذا يجب علينا استخدام الثلاثة في نفس الوقت , بامكانك تطبيق المثال العملي الذي قمت بأعطائه لك اعلم ان هذه الاكواد صعبة الفهم حاليا بالنسبة لك لكن لا مشكلة ف انا اعطيتك اياها لترى الفرق فقط , ولتطوير نفسك في هذا المجال اكثر يمكنك التسجل في دورة تطوير واجهات المستخدم التابعة لأكاديمية حسوب من هنا حيث ستتمكن من خلالها فهم هذه الاكواد وحتى انشاءها بنفسك وهذه بعض المقالات التي تشرح لك هذه اللغات الثلاث بالتفصيل HTML CSS Javascript https://wiki.hsoub.com/JavaScript بالتوفيق لك
- 4 اجابة
-
- 1
-
-
في اغلب لغات البرمجة عندما تقوم باستخدام الحلقات ( ..... for while do/while ) اواستخدام الجمل الشرطية ( .... if else elseif) ف ان التركيبة الصحيحة للكود يجب ان تكون كالاتي : عند استخدام سطر واحد ضمن الحلقات او الشروط ف لا داعي لاستخدام الاقواس المعقوفة { } لانه سيقوم بقراءة شرط الحلقة ثم ينتقل الى او سطر فقط من جسم الحلقة ويعتبره تابع لها اما بالنسبة لباقي السطور فهي تعتبر خارج الحلقة for(الشرط) جسم الحلقة ; عند استخدام اكثر من سطر ضمن جسم الحلقات او الشروط فيجب عليك اضافة الاقواس المعقوفة { } لاخباره انه كل هذا السطور تابعة لهذه الحلقة او هذا الشرط لانه كما قلنا انه يقوم باعتبار السطر الاول فقط تابع للحلقة for(الشرط){ جسم الحلفة ; جسم الحلفة; جسم الحلقة ; } و لا مشكلة ايضا ان وضعت الاقواس المعقوفة { } عند استخدام سطر واحد بالجسم ولكنها اساسية عند استخدام اكثر من شرط
-
بما انني سورية واعلم عن ماذا تتحدث ف من وجهة نظري ب مجال البرمجة بالتحديد الشهادة الجامعية لا تهم كثيرا ف اكثر ما يهتمون له شركات التوظيف هو الخبرة والاحترافية بالعمل انا لست ضد فكرة الجامعة لانها تكسبك ثقافة في عدة مجالات وتطور من ذاتك ولكن بالنسبة للجامعة الافتراضية السورية بما انها تدرس على الانترنت ف انا افضل دورات اكادمية حسوب حيث انها مخصصة اكثر وتهدف الى تطويرك وتخريجك بشهادة معترفة بالاضافة للمشاريع العملية الموجود بها التي تعزز لك الخبرة وفهم البرمجة اكثر لذلك بدلا من دفع التكاليف الباهظة لتلك الجامعة وبالاخص انها ليس معترفة في كل الدول يمكنك استثمار ذلك في اكادمية حسوب وحضور الكورسات التي تشعر انها تمثلك بالبداية قم بالتسجيل بدورة تطوير واجهات المستخدم لانها البداية الاساسية للبدئ بأي لغة برمجية اخرى ومن خلال تسجيلك في اي من دورات حسوب ف سيتم فتح لك المسار الاول من جميع الدورات المتاحة في الاكادمية وبذلك ستسطيع اخذ فكرة عن جميع لغات البرمجة وكيفة العمل بها ثم الاختيار في ما بينهم لتوسيع معرفتك اكثر وتصبح Full stack developer اي مطور برمجيات شامل تستطيع العمل على تصميم كافة المواقع الاكترونية من الصفر الاحتراف ولا اظن ان هناك اي جامعة تقوم بتطويرك وتجهيزك لسوق العمل كما ستقوم اكادمية حسوب لذلك انصحك بأن لا تقم بتضييع وقتك ونقودك عليها بل ابدأ بتطوير نفسك الان باقل تكلفة ووقت ممكن بالاضافة الى ضمان لاسترداد اسثمارك من الاكادمية وتطويرك وتجهيزك لسوق العمل ملاحظة : هناك عرض في اكادمية حسوب لاخر الشهر الحالي وهو انك تسطيع التسجيل في دورتين بسعر دورة واحدة فقط لذلك كمبتدأ انصح بتسجيل الدورتين التالييتين : علوم الحاسب : لفهم الحاسب وعالم الانترنت اكثر تطوير واجهات المستخدم : وهي المفتاح الاول والاساسي لدخولك عالم البرمجة الواسع والشيق
-
قبل البدأ بأي مشروع في الحياة من المهم عمل دراسة له وتنظيم خطة مناسبة ليتم سير العمل عليها وذلك يفيدنا بتسهيل العمل وانشاء مشروع احترافي كامل ومنظم وبالنسبة لخطوات تحليل النظم ف باختصار شديد هي كالتالي تحديد الاهداف والمتطلبات : ويتم ذلك من خلال فهم الاساسيات والاهداف التي تتوقع من نظامك تنفيذه وعمل استبيانات للعملاء المتوقعة ليتم فهم المتطلبات التي يحتاجونها جمع المعلومات : في هذه الخطوة يتم تجميع جميع المعلومات حول المشاكل التي تواجه المستخدمين ليتم العمل عليها في الخطوة التالية تحديد المشكلة : بعد ان قمت بجمع المعلومات والاخذ بالاستبيانات ومشاكل العملاء الان عليك تحديد المشكلة الرئيسية ليتم العمل على حلها في الخطوة التالية تقديم الحلول : تقوم بهذه الخطوة بتقديم عدة اقتراحات وحلول لحل المشاكل التي تم تحديدها وكتابتها ليتم تقييمها في الخطوة التالية تقييم الحلول : هذه الخطوة تقوم بدراسة وتقييم الحلول السابقة من حيث الاسهل والافضل وايهما اكثر ملائمة لتحقيق الاهداف التي قمنا بتحديدها اختيار الحلول : بعد ان سجلنا تقييمات لكل الحلول التي اقترحناها الان سنقوم باختيار افضل حل ليتم العمل عليه في الخطوة التالي وضع خطة العمل : الان بعد ان اصبحت المشاكل واضحة امامنا وتم اختيار الحلول المناسبة يمكننا وضع خطة للعمل بناءا على هذا الاساس ومن المهم ايضا ان تضع خطة عمل بديلة ان حصل اية مشاكل او تعرقلات في الخطة الاولى تنفيذ الخطة : بالتأكيد ان وضع الخطة والتحليل ليس كافيا بدون البدء بالتنفيذ لذلك هذه اهم خطوة ان نقوم بتنفيذ خطة العمل التي وضعناها سابقا متابعة سيرة العمل : من المهم جدا متابعة سير العمل بعد تنفيذه حتى التأكد من ان الخطة تسير على ما يرام واكتشاف اية مشاكل او تحديثات قد تحدث لاحقا والسعي الدائم للتطوير حسب الظروف المحيطة والتطور الاكتروني السريع وبالتوفيق لك
-
تطوير الواجهات الامامية (Frontend) وتطوير الواجهات الخلفية (Backend) هما المصطلحان الأكثر شيوعًا في مجال تطوير الويب . هذه المصطلحات بالغة الأهمية لتطوير المواقع، ولكنها مختلفة تمامًا عن بعضها البعض. يحتاج كل جانب إلى التواصل والعمل بفعالية مع الآخر كجانب واحد لإنشاء وتحسين وظائف الموقع . سنتعرف بشكل مبسط على كلٍّ منهما، وكذلك الفرق بينهما. 1 - تطوير الواجهة الأمامية (Frontend development) : هو ذلك الجزء من موقع الويب الذي يتفاعل معه المستخدم مباشرة، ويشار إليه أيضًا باسم جانب العميل (Client Side). يتضمن كل ما يختبر المستخدمون مباشرة مثل : ألوان وأنماط النص، والصور، والرسوم البيانية والجداول، والأزرار، والألوان، قائمة التنقل. HTML و CSS و JavaScript هي اللغات المستخدمة لتطوير Frontend. يتم تنفيذ بهم الهيكل والتصميم والمحتوى وكل شيء يظهر على شاشات المتصفح عند فتح مواقع الويب أو تطبيقات الويب أو تطبيقات الهاتف المحمول من قبل مطوري الواجهات الأمامية (Frontend Developers). و يجب على المطور التأكد من أن الموقع يظهر بشكل صحيح على الأجهزة من جميع الأحجام، ولا ينبغي لأي جزء من موقع الويب أن يتصرف بشكل غير طبيعي بغض النظر عن حجم الشاشة. 2 - تطوير الواجهات الخلفية (Backend development) : الواجهة الخلفية (Backend) هي جانب الخادم (Server Side) للموقع. تقوم بتخزين البيانات وترتيبها، وتتأكد أيضًا من أن كل شيء على جانب العميل (Client Side) من موقع الويب يعمل بشكل جيد. وهو جزء من موقع الويب لا يمكنك رؤيته والتفاعل معه. ولا يكون هذا الجزء من البرمجيات على اتصال مباشر مع المستخدمين. يتم الوصول إلى الأجزاء والخصائص التي طورها المصممون الخلفيون (Backend) بشكل غير مباشر من قبل المستخدمين من خلال تطبيق الواجهة الأمامية. ومن اللغات المستعمله في ال (backend) PHP و Ruby و Python وكبداية عليك انت تعرف وتتعارف علي كليهما ولو بشكل بسيط لان الBackend و الFrontend مترابطين بشكل كبير بعضهما البعض فكل منهما يكمل الاخر . يمكنك تحصيل المزيد من المعلومات هنا :
-
لا يمكنك التحكم بحجم الصورة التي تضيفها بجانب عناصر القائمة لذلك يفضل اضافة صورة لها ابعاد مناسبة وصغيرة مع القائمة او يمكنك ذلك من خلال اتعباع طريقة اخرى ولكنها سوف تعطي نفس النتيجة تقريبا من خلال اضافة خلفية للعناصر ثم التحكم في تموضعها لتظهر كأنها الرمز الخاص بعنصر القائمة دعني اكتب لك الكود الخاص بملف ال style.css وسأشرح لك كل سطر ماهي وظيفته ul{ /* في البداية نلغي الستايل الخاص بالقائمة بهذه الطريقة */ list-style: none; } ul > li { /* في البداية ساقوم بتحديد الصورة التي تريدها على انها خلفية للعناصر */ background-image: url("images/book.jpg"); /* ثم وضعت هذا العنصر لامنع الخلفية من تكرار نفسها */ background-repeat: no-repeat; /* ثم وضعت هذا العنصر لتحديد مكان الصورة وجعلها تأخد محاذات للبسار*/ background-position: left ; /* ثم وضعت هذا العنصر لتحديد حجم الصورة يمكنك تغيير الحجم كما تريد*/ background-size: 30px; /* وفي النهاية وضعت حواشي للخلفية لكي تبتعد عن عنصر ال li */ padding:10px 0 10px 45px; /* 10px padding top 0 padding right 10px padding bottom 45px padding left */ }
-
اضافة الى الاجابات السابقة الوافية التي قدمها زملائي سأقوم باعطائك مثال عملي لتفهم الفكرة اكثر ف لنضع هذا الكود داخل ملف ال index.html <div class="container"> <div class="item">عنصر 1</div> <div class="item">عنصر 2</div> <div class="item">عنصر 3</div> </div> ولنبدأ بتعديله عن طريق ال grid اولا الذي يستخدم لتوزيع العناصر بسهولة ومرونة بين الصفوف والاعمدة .container { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px; } .item { background-color: #ddd; padding: 20px; } هذا الكود يقوم بتوزيع العناصر على 3 اعدة متساوية بفضل الخاصية grid-template-columns: 1fr 1fr 1fr; وان اردت تغييره الى صفوف ف يمكنك ذلك بطريقة بسيطة عبر تغيير هذه الخاصية للتالي : .container { display: grid; grid-template-rows: auto; /*هذا يعني ان العناصر تكون في سطر واحد */ gap: 10px; } .item { background-color: #ddd; padding: 20px; } وقمت باعطائه خلفية لتظهر الامور بشكل اوضح اي يمكننا الاستنتاج الان ان grid يستطيع التحكم بالعناصر بمرونة بين افقيا او عموديا اما بالنسبة ل flex فهو يقوم بعرف العناصر على نفس السطر الواحد ولا يفترض عرضهم بالتساوي على ملئ الشاشة بطريقة افتراضية بل يجب عليك انت تحديد ذلك دعنا نأخذ مثال عملي عن طريق هذا الكود .container { display: flex; justify-content: space-between; /* flex-direction: column; height: 300px; */ } .container .item { background-color: #ddd; padding: 20px; /* margin-bottom: auto; */ } فانه يعطينا العناصر على نفس السطر ايضا ولكن لاحظ اخلاف نتيجة التنسق هنا وبين الصورة السابقة وان قمت بتعليق الخاصية justify-content: space-between; ف سيقوم باظهارهم على الشكل التالي اي انها تقوم بوضع العناصر على سطر واحد ولكنها لا تجعل العناصر تمتد على ملئ الشاشة اما الأن ف دعنا نزيل التعليقات التي كانت موجودة في الكود السابق لنرى نتيجة ال flex في الوضع العامودي ليصبح كالتالي : .container { display: flex; justify-content: space-between; flex-direction: column; height: 200px; } .container .item { background-color: #ddd; padding: 20px; margin-bottom: auto; } لاحظ اننا قمنا باضافة العديد من الاسطر والتنسيقات لجعلها تظر بشكل عمودي عن طريق ال flex بينما عند استخدام ال grid كان ذلك بشكل اسهل ومختصر اكثر اذا في النهاية اصبحت على دراية كاملة بالفروقات وطريقة عمل كل منهم يمكنك الاختيار في ما بينهم حسب متطلبات المشروع الذي تعمل عليه وبالتوفيق لك
-
يمكنك عمل قائمة جانبية مرنة ومتجاوبة مع جميع الشاشات باستخدام ال html و css مع استخدام اطار العمل بوتستراب الذي سيقوم بستهيل العملية اكثر واختصار العناء الطويل من كتابة شيفرات كثيرة بالبداية دعني اعطيك لمحة سريعة عن اطار العمل bootstrap هو اطار عمل مفتوح المصدر يساعد في تصميم صفحات الويب من خلال توفير كلاسات جاهزة للتصميمات المنتشرة ويوفر تجاوب مرن مع مختلف انواع الشاشات هذه كانت لمحة بسيطة يمكنك التعرف عليه اكثر من خلال زيارة الموقع الرسمي ل بوتستراب من هنا او زيارة التوثيق الخاص ب بوتستراب المتوفر لدى اكاديمية حسوب من هنا اذا ل نبدا بالبداية قم بانشاء ملف index.html وقم باستدعاء bootstrap بداخله بهذه الطريقة <!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Bootstrap demo</title> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous"> </head> <body> <!--اضف الكود الخاص بك هنا --> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL" crossorigin="anonymous"></script> </body> </html> الان دعني اعطيك كود مخصص لعمل قائمة جانبية قم بنسخه ولصقه في صفحة ال index.html <button class="btn btn-primary" type="button" data-bs-toggle="offcanvas" data-bs-target="#offcanvasRight" aria-controls="offcanvasRight">Toggle right offcanvas</button> <div class="offcanvas offcanvas-end" tabindex="-1" id="offcanvasRight" aria-labelledby="offcanvasRightLabel"> <div class="offcanvas-header"> <h5 class="offcanvas-title" id="offcanvasRightLabel">Offcanvas right</h5> <button type="button" class="btn-close" data-bs-dismiss="offcanvas" aria-label="Close"></button> </div> <div class="offcanvas-body"> <!-- اضف الاكوادو الاضافات القادمة هنا --> </div> </div> هذا كود يقوم بانشاء زر وعند الضغط عليه يفتح لك قائمة جانبية يمكنك البحث عن تنسيقات قائمة جانبية اخرى ان لم تعجبك هذه من خلال البحث على كلمة Sidebar في التوثيق الرسمي ل bootstrap الذي ارفقت لك رابطه في بداية الاجابة اصبح لدينا الان قائمة جانبية تفتح وتغلق من خلال الضغط على ال button ولكنها فارغة دعنا ننشئ عناصر القائمة سويا عن طريق اضافة الكود التالي <ul class="list-group list-group-flush"> <li class="list-group-item disabled" aria-disabled="true">A disabled item</li> <li class="list-group-item"> <a href="#" class="text-decoration-none ">A second item </a></li> <li class="list-group-item"><a href="#" class="text-decoration-none ">A third item </a></li> <li class="list-group-item"><a href="#" class="text-decoration-none ">A fourth item </a></li> <li class="list-group-item"><a href="#" class="text-decoration-none ">And a fifth one </a></li> </ul> مكان اشارة المربع هذه "#" يمكنك اضافة رابط او مسار الصفحة الذي تريد لعنصر القائمة ان ينقلك عليها كما انه بامكانك زيادة عدد عناصر القائمة عن طريق تكرار الكود التالي بالعدد الذي تريده <li class="list-group-item"><a href="#" class="text-decoration-none "> item name </a></li> و ل اضافة ايقونات لعناصر القائمة يمكنك اتباع الطريقة التالية اولا نذهب الى موقع bootstrap icons من هنا نختار الايقونات التي تعجبنا ونقوم بالضغط عليها لنحصل على الكود الخاص بها الذي يشبه هذا <i class="bi bi-1-circle-fill"></i> ونقوم بتضمينه بداخل عناصر القائمة كالتالي : <li class="list-group-item"><i class="bi-alarm"></i><a href="#" class="text-decoration-none ">A second item </a></li> ولا تنسى تضمين bootstrap icons داخل ملف index.html في الوسم <head> لتتمكن من مشاهدة النتيجة <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.3.0/font/bootstrap-icons.css"> اما الان ف دعنا ننشئ ملف style.css لنقوم بتغيير الالوان والتنسيقات كما نريد ولا تنسى تضمينه داخل ملف index.html بداخل الوسم <head> ليتم قراءته كالتالي : <link rel="stylesheet" href="style.css"> والان لتغيير القليل من تنسيقات القائمة يمكنك اختيار ما تفضله من الكود التالي وكتابته داخل ملف ال style.css .offcanvas-body{ /* لتغيير لون خلفية القائمة */ background-color: #007bff; } .list-group-item { /* لتغيير لون خليفة عناصر القائمة */ background-color: #007bff; } .list-group-item a{ /* لتغيير لون النصوص */ color: #fff; } .list-group-item a:hover{ /* لتغيير لون النصوص عندما يتم تحويل المؤشر اليها */ color: #000; } .list-group-item.active{ /* لتغيير لون خلفية العنصر النشط */ background-color: #fff; } .list-group-item.active a{ /* لتغيير لون النصوص عنصر نشط */ color: #000; } .list-group-item.active a:hover{ /* لتغيير لون النصوص عندما يتم تحويل المؤشر اليها */ color: #fff; } اصبحت جميع الاساسيات الان بين يديك واصبح بامكانك تغيير التنسيقات وتصميمها كما تشاء وملاحظة اخيرة ان تنسيق الصفحة الافتراضي يكون من اليسار الى اليمين لذلك اذا اردت تغير محاذات جميع العناصر من اليمين الى اليسار كل ماعليك فعله هو التعديل بهذا الوسم <html lang="en"> داخل ال index.html ليصبح كالتالي <html lang="ar" dir="rtl"> بالتوفيق لك
- 2 اجابة
-
- 1
-
-
بعد ترجمة عبارات وورد بريس باستخدامloco translate كيف يمكنني مشاهدة التعديلات على القالب؟
- 2 اجابة
-
- 2
-
-
بحثت عن طريقة تعريب ملفات وورد بريس ووجدت انني يمكنني تعريبها باستخدام برنامج POEDIT ولكنني عندما قمت بتحميل ملفات القالب لم أجد الملف lang الذي أريده للتعريب من أين احصل عليه هذا القالب https://wordpress.org/themes/supplier/
- 1 جواب
-
- 1
-
-
ماهي الloder و plugen التي احتاجها لإضافة فيديو ما إلى مشروعي مع العلم انني استخدم webpack
- 1 جواب
-
- 2
-
-
ماقبل التوكن بدال كلمة السر ضلت نفس رسالة الخطا
-
شكرا لك لم أفهم ماذا تقصد بمعملية توثيق طلب الدفع ولكن لا أظن أنها تخصني لأنني استخدم النسخة المجانية ولقد قمت بعمل التعليمات بشكل صحيح متأكدة من ذلك كما اني أضفت أيضا التعليمات التي أعطيتني اياها وهذه النتيجة أيضا ظهر خطأ
- 9 اجابة
-
- 1
-
-
ماسبب عدم وجود الملفات داخل مستودع git مع أنها كانت موجودة سابقا ؟ تظهر هكذا كما في الصورة تظهر هكذا ايضا عند رفع اي مشروع جديد
- 9 اجابة
-
- 1
-
-
شكرت لك ولكن المشكلة عند ما اقوم بتنزيل الحزمة يظهر لي خطا ولا تتنزل Microsoft Windows [Version 6.1.7601] Copyright (c) 2009 Microsoft Corporation. All rights reserved. C:\coffee>npm i -g --force sass npm WARN using --force I sure hope you know what you are doing. npm ERR! code EEXIST npm ERR! path C:\Users\len\AppData\Roaming\npm\sass.ps1 npm ERR! Refusing to delete C:\Users\len\AppData\Roaming\npm\sass.ps1: node_modu les/sass/sass.js symlink target is not controlled by npm C:\Users\len\AppData\Ro aming\npm\node_modules\sass npm ERR! File exists: C:\Users\len\AppData\Roaming\npm\sass.ps1 npm ERR! Remove the existing file and try again, or run npm npm ERR! with --force to overwrite files recklessly. npm ERR! A complete log of this run can be found in: npm ERR! C:\Users\len\AppData\Roaming\npm-cache\_logs\2021-08-30T17_54_19_26 9Z-debug.log C:\coffee>sass --version 'sass' is not recognized as an internal or external command, operable program or batch file. C:\coffee>
-
امر التثبيت خاصتك لا يعمل وبالرغم من ذلك اغلقته وأعدت كتابة شيفرة التحويل من scssالى css ولم تعمل بقيت كالخطأ السابق امر التثبيت خاصتك لا يعمل وبالرغم من ذلك اغلقته وأعدت كتابة شيفرة التحويل من scssالى css ولم تعمل بقيت كالخطأ السابق
- 13 اجابة
-
- 1
-
-
الصورة الأولى عند تنفيذ الأمر الاذي أعطيتني ياه بينما الصورة الثانية هي عندما اريد تحويل الملفات من scssالى css
-
لا تعمل هذه الاوامر ولكنني قمت بتنزيل sass-loader فلماذا يجب تنزيل هذا Microsoft Windows [Version 6.1.7601] Copyright (c) 2009 Microsoft Corporation. All rights reserved. C:\coffee>sass src/scss/product1.scss src/css/product1.css 'sass' is not recognized as an internal or external command, operable program or batch file. C:\coffee>npm install -g node-sass npm ERR! Response timeout while trying to fetch https://registry.npmjs.org/node- sass (over 30000ms) npm ERR! A complete log of this run can be found in: npm ERR! C:\Users\len\AppData\Roaming\npm-cache\_logs\2021-08-30T16_02_25_30 6Z-debug.log C:\coffee>npm install -d node-sass npm info it worked if it ends with ok npm info using npm@6.14.4 npm info using node@v13.14.0 npm http fetch GET 200 https://registry.npmjs.org/node-sass 18730ms npm http fetch GET 200 https://registry.npmjs.org/node-sass/-/node-sass-6.0.1.tg z 66807ms npm timing stage:loadCurrentTree Completed in 90523ms npm timing stage:loadIdealTree:cloneCurrentTree Completed in 27ms npm timing stage:loadIdealTree:loadShrinkwrap Completed in 2640ms npm http fetch GET 200 https://registry.npmjs.org/get-stdin 1722ms npm http fetch GET 200 https://registry.npmjs.org/async-foreach 1974ms npm http fetch GET 200 https://registry.npmjs.org/get-stdin/-/get-stdin-4.0.1.tg z 606ms npm http fetch GET 200 https://registry.npmjs.org/async-foreach/-/async-foreach- 0.1.3.tgz 1803ms npm http fetch GET 200 https://registry.npmjs.org/stdout-stream 4007ms npm http fetch GET 200 https://registry.npmjs.org/stdout-stream/-/stdout-stream- 1.4.1.tgz 1314ms npm http fetch GET 200 https://registry.npmjs.org/node-gyp 8803ms npm http fetch GET 200 https://registry.npmjs.org/gaze 11643ms npm http fetch GET 200 https://registry.npmjs.org/sass-graph 14347ms npm http fetch GET 200 https://registry.npmjs.org/gaze/-/gaze-1.1.3.tgz 2940ms npm http fetch GET 200 https://registry.npmjs.org/sass-graph/-/sass-graph-2.2.5. tgz 897ms npm http fetch GET 200 https://registry.npmjs.org/true-case-path 21634ms npm http fetch GET 200 https://registry.npmjs.org/npmlog 43334ms attempt #2 npm http fetch GET 200 https://registry.npmjs.org/npmlog/-/npmlog-4.1.2.tgz 247m s npm http fetch GET 200 https://registry.npmjs.org/node-gyp/-/node-gyp-7.1.2.tgz 109484ms npm timing npm Completed in 213096ms npm ERR! cb() never called! npm ERR! This is an error with npm itself. Please report this error at: npm ERR! <https://npm.community> npm ERR! A complete log of this run can be found in: npm ERR! C:\Users\len\AppData\Roaming\npm-cache\_logs\2021-08-30T16_06_53_33 4Z-debug.log C:\coffee>
- 13 اجابة
-
- 1
-
-
اعدت تشغيله اكثر من مرة ولكن هل تقصد بمسؤول اي فتحه من داخل الملفات عبر كتابة cmd مكان مسار المشروع
- 13 اجابة
-
- 1
-
-
لقد قمت بتثبيت حزمة sass-loader وادارجها الى ملف index.js عبر الامر التالي import './scss/product1.scss'; بالاضافة الى انني اضفت الاضافة الى ملف webpack.config.js عبر الاوامر التالية test: /\.(sa|sc|c)ss$/, use: [ { loader: MiniCssExtractPulgin.loader, options:{ publicPath: '../' } }, 'css-loader' , 'sass-loader' ] }, ولايوجد اي خطا في الترمينال ولكن عندما اريد تحويل الملف من scss الى css يظهر لدي الخطا التالي ولا يتم انشاء الملف داخل dist Microsoft Windows [Version 6.1.7601] Copyright (c) 2009 Microsoft Corporation. All rights reserved. C:\coffee>sass src/scss/product1.scss src/css/product1.css 'sass' is not recognized as an internal or external command, operable program or batch file. C:\coffee>
- 13 اجابة
-
- 1
-
-
ظهر لي نفس الخطا مسبقا لذلك قمت بحذف المستودع وانشاء هذا المستودع الجديد ولكن نفس المشكلة
-
متاكدة منها ولكن انظلر يظهر لي الخطا عند اضافة الامر git remote add origin https://github.com/najah18/cof.git
-
استخدم نفس الطريقة الاعتيادية الموجودة بالموقع لرفع الملفات ولكنه بالرغم من ذلك لا يتم رفعها Microsoft Windows [Version 6.1.7601] Copyright (c) 2009 Microsoft Corporation. All rights reserved. C:\coffee>git init Reinitialized existing Git repository in C:/coffee/.git/ C:\coffee>git add . warning: LF will be replaced by CRLF in dist/css/product1.css. The file will have its original line endings in your working directory warning: LF will be replaced by CRLF in dist/css/style.css. The file will have its original line endings in your working directory warning: LF will be replaced by CRLF in dist/main.js. The file will have its original line endings in your working directory C:\coffee>git add . C:\coffee>git commit -m "first commit" [main 9738844] first commit 11 files changed, 16 insertions(+), 13 deletions(-) rewrite dist/contact.html (67%) rewrite dist/distributors.html (90%) rewrite dist/history.html (95%) rewrite dist/index.html (93%) rewrite dist/product1.html (95%) rewrite dist/product2.html (95%) rewrite dist/product3.html (91%) C:\coffee>git branch -M main C:\coffee>git remote add origin https://github.com/najah18/cof.git error: remote origin already exists. C:\coffee>git push -u origin main Username for 'https://github.com': najah18 Password for 'https://najah18@github.com': remote: Support for password authentication was removed on August 13, 2021. Plea se use a personal access token instead. remote: Please see https://github.blog/2020-12-15-token-authentication-requireme nts-for-git-operations/ for more information. fatal: Authentication failed for 'https://github.com/najah18/coffee.git/' C:\coffee>
- 5 اجابة
-
- 2
-
