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

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

  1. Mustafa Suleiman

    Mustafa Suleiman

    الأعضاء


    • نقاط

      7

    • المساهمات

      13209


  2. Najah Alsaker

    Najah Alsaker

    الأعضاء


    • نقاط

      5

    • المساهمات

      543


  3. عبدالرحمن محمد علي احمد

    • نقاط

      4

    • المساهمات

      22


  4. احمد مصطفى14

    احمد مصطفى14

    الأعضاء


    • نقاط

      3

    • المساهمات

      285


المحتوى الأكثر حصولًا على سمعة جيدة

المحتوى الأعلى تقييمًا في 02/12/24 في كل الموقع

  1. ما هى افضل مكتبات الترجمة في vue.js وكيف يمكننى تضمينها داخل مشروعي !
    3 نقاط
  2. هل من الممكن اظهار المقاله بكثر من لغة لتتناسب مع لغة الزائر ؟
    3 نقاط
  3. هل يجب ان اكون متمكن وقويا في لغات html,css,java scripr اثناء دوره بايثون او بعد الانتهاء للمساعده في العمل ام فقط معرفه الاساسياا
    2 نقاط
  4. مساء الخير بالنسبة لدورة javascript فهي من اكبر الدورات على الأكاديمية وفيها مجموعة كبيرة من المسارات وفيها فرونت وباك وموبايل و و و انا خلصت أول مسار وحالياً ماشي ببداية المسار الثاني السؤال الأول : هو هل يجب دراسة الكورس كامل ؟ هل دراسة الكورس كامل ستسبب الضياع ؟ هل يجب ان اقرر بالبداية المسار المناسب بعد المسار الأساسي وانتقل اليه ؟ السؤال الثاني : انا لغاية اللحظة ما بعرف الإختصاص الي حابب اشتغل فرونت او باك و حتى موبايل ابلكيشن كيف ممكن اعرف ؟ وكيف ممكن اختار ؟ وشكرا للجميع ..
    2 نقاط
  5. تضهر لي كتابة بالوني الاحمر
    2 نقاط
  6. استاز يمكن تكون زي كدا let arry = ['****','***','**','*'] for (let value of arry){ console.log(value) }
    2 نقاط
  7. انا بدأت من جديد في تعلم مجال البرمجة وسمعت انه يجب علي استخدام ال html , css ,java script لانشاء موقع على الانترنت هل يمكنكم توضيح الفرق بينهم ولماذا علي استعمالهم مع بعضهم وهل يمكنني استخدام لغة واحدة فقط ؟
    2 نقاط
  8. هل يوجد في لارافل باكج توفر الدول و المدن و الولايات او المراكز وتدعم اللغه العربيه
    1 نقطة
  9. #include <iostream> using namespace std; int calcspecial(int num1, int num2){ if(num1 == num2){ cout << "First = Second -> "; cout << num1 << " + " << num2 << " = " << num1 + num2 << endl; }else { if(num1 > num2){ cout << "First > Second -> "; cout << num1 << " - " << num2 << " = " << num1 - num2 << endl; }if(num1 < num2){ cout << "First < Second -> "; cout << num2 << " - " << num1 << " = " << num2 - num1 << endl; }} } int main() { cout << calcspecial(40, 40) << "\n"; // First = Second -> 40 + 40 = 80 cout << calcspecial(200, 50) << "\n"; // First > Second -> 200 - 50 = 150 cout << calcspecial(100, 300) << "\n"; // First < Second -> 300 - 100 = 200 return 0; }
    1 نقطة
  10. المشكلة هي أن الدالة في تعريفها تقوم بإرجاع عدد، بينما داخلها لا توجد أي قيمة مرجعة، كما أنك تقوم بطباعة النتيجة داخلها لذا لا تحتاج على إعادة الطباعة في ال main، و الأفضل أن تقوم بتعديل الدالة لتصبح void بالشكل التالي: #include <iostream> using namespace std; void calcspecial(int num1, int num2){ if(num1 == num2){ cout << "First = Second -> "; cout << num1 << " + " << num2 << " = " << num1 + num2 << endl; } else { if(num1 > num2){ cout << "First > Second -> "; cout << num1 << " - " << num2 << " = " << num1 - num2 << endl; } if(num1 < num2){ cout << "First < Second -> "; cout << num2 << " - " << num1 << " = " << num2 - num1 << endl; } } } int main() { calcspecial(40, 40); // First = Second -> 40 + 40 = 80 calcspecial(200, 50); // First > Second -> 200 - 50 = 150 calcspecial(100, 300); // First < Second -> 300 - 100 = 200 return 0; }
    1 نقطة
  11. عند استخدام خرائط Google maps: إدخال الحقول النصية تعمل على مايرام لكن عند إدخال ملف تختفي الخريطة <div class=" mb-3 col-md-6 "> <label class="form-label" for="contract">إدخال ملف </label> <input wire:model="contract" type="file" id="contract" required="" value="{{ old('contract') }}" name="contract" class="form-control" placeholder="الرجاء إدخال الملف "> @error('contract') <div class="text-danger px-2 showValidationError "> {{ $message }} </div> @enderror </div> هل يمكن حل المشكلة بهذه الدالة $this->dispatch('map_opend');
    1 نقطة
  12. بطبع يوجد طريقه اولا علينا معرفة للغة الجهاز الخاص بزائر ثما كتابة المقال باكثر من للغه مثال علي كود عند دخول المستخدم يتم ترجمة المقال علي حسب للغته ثما اذا كان يريد تغييرها يستطيع ذالك عن طريق الازرار الخاصه بكل للغه <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Multi-Language Article</title> <link rel="stylesheet" href="styles.css"> </head> <body> <div id="article"> <h1 id="title">Hello World!</h1> <p id="content">This is a sample article.</p> </div> <div id="language-buttons"> <button onclick="changeLanguage('en')">English</button> <button onclick="changeLanguage('fr')">French</button> <button onclick="changeLanguage('es')">Spanish</button> </div> <script src="script.js"></script> </body> </html> كود الجافا سكريبت function changeLanguage(language) { const titles = { 'en': 'Hello World!', 'fr': 'Bonjour le monde!', 'es': '¡Hola Mundo!' }; const contents = { 'en': 'This is a sample article.', 'fr': 'Ceci est un article d\'exemple.', 'es': 'Este es un artículo de muestra.' }; document.getElementById('title').textContent = titles[language]; document.getElementById('content').textContent = contents[language]; } يمكنك تجربة الكود من هنا
    1 نقطة
  13. عليك إذن دراسة المسار الأول من دورة تطوير واجهة المستخدم لتتعلم HTML, CSS, JS. ثم تعود لدورة جافاسكريبت وتقوم بدراسة أساسيات JS بشكل معمق أكثر، ثم تقوم بدراسة أساسيات React، ثم أساسيات Node.js ثم React Native.
    1 نقطة
  14. قرأت من شروط الحصول على شهادة من الاكادمية يجب اتمام اربع مسارات تعليمية ماذا تقصدون بذلك ؟ وكيف ارفع المشاريع ؟ و هل هي المشاريع التي اشتغلناها خلال الدورة ؟
    1 نقطة
  15. شكرا جزيلا على جوابك في حال قررت التخصص ب React Native هل بإمكانك نصحي بالترتيب والمسارات الصحيحة التي يجب علي دراستها بالكورس
    1 نقطة
  16. بالطبع لا، عليك تحديد ما تريده من الدورة تحديدًا، هل تريد أن تصبح مطور واجهة أمامية أم خلفية أم الاثنان معًا Full-stack. وطالما أنك لم تُحدد إذن عليك بالتجربة، صدقني قراءة 100 مقالة عن المجال المناسب لن تفيدك بقدر التجربة العملية، لذا لإختيار المسار البرمجي الذي ستبذل به أقصى جهدك، عليك بدراسة الدورة بالكامل لتفقد المجالات من واقع عملي. أيضًا هناك نقطة هامة ألا وهي إن كنت تنوي العمل بالشركات فعليك تفقد الوظائف في بلدك وما هي التنقيات المطلوبة وهل مجال الويب مطلوب أكثر أم مجال تطوير تطبيقات الهاتف وهل المطلوب Flutter أم React Native ألقي نظرة على الوظائف، وبالنسبة لمواقع العمل الحر عليك بتفقد المشاريع المعروضة في المنصة التي تنوي العمل عليها لتفقد التقنيات والمهارات المطلوبة بكثرة. وفي النهاية إن لم تستطع اتخاذ قرار، إذن من الأفضل تعلم مجال الواجهة الأمامية Font-End فهو سيفتح لك المجال لتعلم المجالات الأخرى ويعتبر أسهل نسبيًا والمفاهيم والمهارات التي ستتعلمها ستنتقل معك إلى المجالات الأخرى ويعتبر مجال جيد لدخول عالم البرمجة.
    1 نقطة
  17. بالطبع، لكن هل ستقوم بترجمة المقالات يدويًا أم تعرض نسخة مترجمة من المقالة بشكل آلي؟ عامًة تستطيع معرفة لغة الزائر من خلال واجهة navigator في جافاسكريبت، وكمثال: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content= "width=device-width, initial-scale=1.0"> <title> Get browser language preference </title> </head> <body> <div style="text-align: center;"> <h2 style="color: green;"> Hsoub </h2> <h3> Click the below button to get the language preference. </h3> <button id="myBtn"> Get Preferred language </button> <p id="result"></p> </div> <script> const myBtn = document. getElementById('myBtn') function getLanguages() { const langs = navigator.languages; const result = document. getElementById('result'); result.innerHTML += `The Preferred languages are: <b>${langs}</b>`; } myBtn.addEventListener('click', getLanguages); </script> </body> </html> عند الضغط على الزر سيظهر لك اللغات اللغات المفضلة لدى المستخدم في المتصفح وعرضها، وبالتالي تستطيع استخدام قيمة navigator.languages لعرض المقالة باللغة المفضلة لدى الزائر. لكن هناك مشكلة وهو إن كان المستخدم يستخدم اللغة الإنجليزية كلغة مفضلة أولى له في المتصفح، بينما هو من بلد عربي فسيتم عرض المقالة باللغة الإنجليزية له، لذا من الأفضل عرض المقالة باللغة المناسبة لبلد الزائر وذلك من خلال عنوان الـ IP ونحصل عليه بواسطة Geolocation API. لكن لن تحصل على ذلك إن لم يوافق المستخدم على مشاركة بيانات موقعه.
    1 نقطة
  18. 1 نقطة
  19. شكرا بشمهندس مصطفي شكرا بشمهندس ياسر
    1 نقطة
  20. الرجاء ذكر اللغات والتقنيات التي تستخدمها بالموقع الخاص بك لمساعدتك بشكل افضل
    1 نقطة
  21. مقالات اكاديمية حسوب جميعها باللغة العربية الفصحة ولكن يمكنك ترجمتها من خلال اضافة google translate الى متصفحك وترجمة المقالة للغة التي تريدها عبر اتباع الخطوات التالية : ادخل الى الرابط التالي https://chromewebstore.google.com/detail/ترجمة-google/aapbdbdomjkkjkaonfhkkikfgjllcleb?pli=1 وقم بتنزيل الاضافة ثم قم بالضغط على ترجمة للغة العربية بالصفحة الخاصة بالمقالة هذا اذا كنت تقصد عن مقالات اكاديمية حسوب اما ان كنت تقصد انه لديك موقع يعرض مقالات وتريد ترجمته فالرجاء تحديد اللغات التي تعمل بها لمساعدتك اكثر
    1 نقطة
  22. السلام عليكم هل يمكنني العمل كباكاند ام علي ان اكون fullstack
    1 نقطة
  23. هذه قائمة بافضل المكتبات الخاصة بالترجمة Vue I18n يمكنك زيارة الموقع الرسمي الخاص بهذا المكتبة من هنا Vuex-i18n يمكنك زيارة الموقع الرسمي الخاص بهذا المكتبة من هنا vue-i18next يمكنك زيارة الموقع الرسمي الخاص بهذا المكتبة من هنا vue-gettext يمكنك زيارة الموقع الرسمي الخاص بهذا المكتبة من هنا هذه قائمة بافضل المكتبات الخاصة بالترجمة يمكنك زيارة موقع كل منها والتعرف على خصائصها واختيار الانسب بالنسبة لك ول احتياجات موقعك واتباع الخطوات اللازمة لتضمينها وبالنسبة لي افضل واسهل مكتبة هي vue-i18n , ساعلمك كيف تقوم بتضمينها في مشروعك عبر اتباع الخطوات التالية: الخطوة الاولى : بالبداية سنقوم بتثبيت هذا الحزمة عن طريق npm npm install vue-i18n الخطوة الثانية : قم بانشاء ملف main.js وقم بتضمينها بداخله كالتالي : import Vue from 'vue'; import VueI18n from 'vue-i18n'; Vue.use(VueI18n); الخطوة الثالثة : نقوم بتحديد لغة التطبيق واللغة التي نريد العمل عليها كالتالي : export default new VueI18n({ language locale: 'en', //اللغة الافتراضية هنا fallbackLocale: 'ar', // اللغة التي تريد الترجمة اليها messages: { en: { // الترجمات الانحليزية }, ar: { // الترجمات العربية }, }, }); الخطوة الرابعة : اضافة الترجمات عن طريق انشاء مفتاح ل كل قيمة من خلال الكائن messages كالتالي : messages: { en: { greeting: 'Hello!', welcome: 'Welcome to hsoub academy .', }, ar: { greeting: 'مرحبا ', welcome: ' اهلا وسهلا بك في اكاديمية حسوب ', }, }, هذه باختصار طريقة التضمين والترجمة وان كان لديك عدد كبير من الترجمات يمكننا الترجمة في ملفات منفصلة وذلك يجعل تنظيمها وادارتها وطريقة الوصول اليها اسهل بكثير لذا دعني اعطيك هذه الطريقة اولا : قم بانشاء ملفين en.json (للغة العربية ) ar.json ( للغة الانجليزية ) ثم قم باضافة الترجمات التي تريدها بنفس الطريقة المعتادة عن طريق اضافة مفتاح واسناد قيمة له { greeting: 'مرحبا ', welcome: ' اهلا وسهلا بك في اكاديمية حسوب ', } والأن لنقم باستدعاء هذه الملفات داخل الملف الاساسي main.js كالتالي : import en from './locales/en.json' import es from './locales/es.json' واضافتها للكائن messages كالتالي messages: { en, ar } بالتوفيق لك
    1 نقطة
  24. يوجد Vue-i18n وتتميز بالتالي: مكتبة شائعة وموثوقة توفر وظائف ترجمة شاملة. تدعم الترجمة القائمة على المكونات والمفاتيح. سهلة الاستخدام مع واجهة برمجة تطبيقات واضحة. توفر ميزات متقدمة مثل التعدد اللغوي الديناميكي وترجمة السمات. بجانب مكتبات أخرى مثل Vue-ns وvue-intl. وتستطيع التوجه للمستند الرسمي لكل مكتبة وتفقد طريقة الاستخدام وكمثال ذلك هو المستند الرسمي لمكتبة Vue-i18n: https://kazupon.github.io/vue-i18n/introduction.html
    1 نقطة
  25. حسنا، توجد عدة مكتبات للترجمة في Vue.js، وتختلف في الميزات والاستخدام لهذا فالاختيار يعتمد على احتياجات مشروعك ومستوى التكامل المطلوب، بعض المكتبات الشهيرة: Vue I18n: وهي المكتبة الرسمية للترجمة في Vue.js. VeeValidate: بالإضافة إلى التحقق من البيانات، توفر VeeValidate أيضا دعما للترجمة لرسائل التحقق. Vue-Translate: تقدم وظائف بسيطة للترجمة. Vue-Multilanguage: توفر طريقة بسيطة لإضافة دعم للغات متعددة داخل التطبيق. ولتضمين أيٍ من هذه المكتبات في مشاريعنا، يمكن اتباع هذه الخطوات: تثبيت المكتبة: من خلال استخدام npm أو yarn لتثبيت المكتبة التي نرغب في استخدامها. على سبيل المثال:، `npm install vue-i18n` من أجل تثبيت Vue I18n. ولاستيرادها في المشروع: نتوجه إلى ملف الدخول الرئيسي للتطبيق (مثل main.js)، ثم نقوم بتضمين المكتبة عن طريق استيرادها. استخدامها في مكونات Vue: نقوم بتكوين واستخدام مكتبة الترجمة وفقا للتوثيقات والأمثلة المقدمة من قِبل المكتبة. هذا مثال على كيفية استيرادها في المشروع: import Vue from 'vue'; import VueI18n from 'vue-i18n'; Vue.use(VueI18n); وهذا مثال آخر على كيفية استخدامها في مكونات Vue: على سبيل المثال نقوم بإنشاء ملف للرسائل المترجمة مثل `messages.js` ونملؤه بالرسائل لكل لغة: // messages.js export default { en: { greeting: 'Hello!', welcome: 'Welcome to my Vue.js app.' }, ar: { greeting: 'مرحبًا!', welcome: 'مرحباً بك في تطبيقي Vue.js.' } }; بعدها نباشر في تكوين الترجمة، في ملف `main.js`، نقوم بتكوين VueI18n وتحميل الرسائل المترجمة: import Vue from 'vue'; import VueI18n from 'vue-i18n'; import messages from './messages'; Vue.use(VueI18n); const i18n = new VueI18n({ locale: 'en', // اللغة الافتراضية fallbackLocale: 'en', // اللغة الاحتياطية messages, // الرسائل المترجمة }); new Vue({ i18n, render: h => h(App) }).$mount('#app'); كما يمكن استخدام الترجمة في مكونات Vue الخاصة بنا عن طريق فلاتر معينة (filters) أو دوال خاصة بالترجمة. وهنا مثال على استخدامها في قالب: <template> <div> <p>{{ $t('greeting') }}</p> <p>{{ $t('welcome') }}</p> </div> </template>
    1 نقطة
  26. في Vue.js، تتوفر عدة مكتبات لترجمة النصوص المتعددة اللغات، من بينها Vue I18n و Vuetify و Vue Translate، و يعتبر Vue I18n من أشهر هذه المكتبات، حيث توفر إمكانيات فعالة لترجمة النصوص بسهولة وإدارة اللغات المتعددة. Vuetify توفر دعما مدمجا لترجمة النصوص عبر خدمة i18n، مما يجعلها خيارا مناسبا لمن يستخدم هذه المكتبة لتصميم واجهة المستخدم، أما بالنسبة لمكتبة Vue Translate، فهي مكتبة مستقلة توفر وظائف ترجمة النصوص المبنية على Vue.js. لتضمين أي من هذه المكتبات في مشروعك في Vue.js، يتطلب الأمر عادة تثبيت المكتبة المناسبة باستخدام npm أو yarn، ثم استيرادها في ملفات مشروعك، وتكوينها وفقا لاحتياجات مشروعك. ها هو مثال على كيفية استخدام مكتبة Vue I18n في تطبيق Vue.js:في الملف main.js (أو أي ملف رئيسي آخر)، يمكنك استيراد Vue و VueI18n وتكوين المكتبة كما يلي: import Vue from 'vue'; import VueI18n from 'vue-i18n'; import App from './App.vue'; Vue.use(VueI18n); const i18n = new VueI18n({ locale: 'en', // اللغة الافتراضية messages: { en: { greeting: 'Hello!' }, fr: { greeting: 'Bonjour!' }, ar: { greeting: 'مرحباً!' } } }); new Vue({ el: '#app', i18n, render: h => h(App) }); ثم، في ملف مكون Vue (مثل App.vue)، يمكنك استخدام المكونات التي تحتوي على نصوص يجب ترجمتها. على سبيل المثال: <template> <div> <h1>{{ $t('greeting') }}</h1> </div> </template> <script> export default { name: 'App', mounted() { // يمكنك تغيير اللغة في وقت التشغيل this.$i18n.locale = 'fr'; // تغيير اللغة إلى الفرنسية } } </script> هنا يتم تحديد مكتبة Vue I18n وتكوينها في الملف main.js. ثم يتم استخدام النص المترجم في مكون Vue (App.vue) باستخدام $t('greeting') حيث يتم ترجمة النص وفقا للغة المحددة في المكتبة.
    1 نقطة
  27. في البداية ساشرح لك ماهي وظيفة تطوير واجهات المستخدم التي تستخدم هذه اللغات الثلاثة ان صفحات الويب التي تقوم بزيارتها كل يوم على متصفح الانترنت مبينة بثلاث تقنيات اساسية وهم ال 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 بالتوفيق لك
    1 نقطة
  28. يمكنني توضيح الفرق بين HTML وCSS وJavaScript، ولماذا يُفضل استخدامهم معًا في تطوير مواقع الويب. 1. HTML : - HTML هي لغة توصيف النصوص التي تُستخدم لبناء هيكل صفحة الويب. - تُستخدم العناصر (tags) في HTML لتحديد مكونات الصفحة مثل العناوين والفقرات والصور وروابط الهايبرلنك والجداول والنماذج، إلخ. - HTML يوفر الإطار الأساسي للصفحة ويُعتبر أساسيًا لبناء أي موقع على الإنترنت. 2. CSS (Cascading Style Sheets): - CSS تُستخدم لتحسين شكل وتنسيق صفحة الويب التي تم إنشاؤها بواسطة HTML. - تسمح CSS بتعيين مظهر العناصر المحددة، مثل تغيير الألوان والخطوط والهوامش والتباعد بين العناصر. - يمكن استخدام CSS لتحقيق تصميم جميل وجذاب لصفحات الويب، وتفعيل تجاوبية الموقع لتكيفه مع مختلف أحجام الشاشات. 3. JavaScript: - JavaScript هي لغة برمجة تُستخدم لجعل صفحة الويب ديناميكية وتفاعلية. - يُستخدم JavaScript لإضافة وظائف مثل التفاعل مع المستخدم، تحميل المحتوى دون إعادة تحميل الصفحة، التحقق من الإدخالات في نماذج الاستمارة، وإجراءات أخرى تتعلق بالبرمجة. - يمكن استخدام JavaScript للتفاعل مع مكونات HTML وتحديث الصفحة بناءً على إجراءات المستخدم. لماذا يُفضل استخدامهم معًا: - HTML يُعتبر الهيكل الأساسي للصفحة، CSS يقوم بتنسيقها وجعلها جذابة، وJavaScript يُضيف التفاعل والديناميكية. - تكامل هذه اللغات يسمح للمطور ببناء صفحات وتطبيقات ويب شاملة وفعالة. - استخدام الثلاثة يُمكّن من تحقيق تجربة مستخدم أفضل وتفاعلية. هل يمكن استخدام لغة واحدة فقط؟ - نعم، يمكنك استخدام لغة واحدة فقط إذا كنت تقوم بمشروع صغير أو إذا كنت تستخدم أدوات وإطارات عمل (frameworks) تتيح لك فعل ذلك. على سبيل المثال، يمكنك استخدام إطار عمل مثل React أو Vue.js لتطوير تطبيقات ويب ديناميكية باستخدام JavaScript فقط. ومع ذلك، عند توسيع مشروعك، ستجد أن استخدام HTML، CSS، وJavaScript سيمكنك من الاستفادة من الإمكانيات الكاملة لتطوير موقع ويب متكامل. - اما اذ كنت تريد تعلم html او css فيجب تعلمهم معا
    1 نقطة
  29. ان ال html و ال css هى ليست لغات برمجة هى عبارة عن لغة توصيف (markup language) . تستخدم ال html في انشاء هيكل الصفحة فقط من عناصر و نصوص . أما ال css تستخدم فقط لتعديل تصميم وشكل واماكن العناصر اللتى تم انشائها باستخدام ال html استخدام ال html و ال css فقط لا يفيد حاليا الا اذا اردت ان تنشئ موقع ثابت (static) غير متغير من شخص الى اخر وهو غير مطلوب كثيرا. اما ال javascript فهى لا غنى عنها حاليا حيث تمكنك من التلاعب بالعناصر فى الصفحة وجعل الموقع اكثر ديناميكية من حذف وتعديل واضافه عناصر و نصوص حتى بعد تحميل الصفحة . فيجب عليك استخدام الثلاثة اذا اردت ان تكون مطور واجهات امامية (front end) . اما اذا لم تكن تريد ان تتعامل مع ال html وال css فيمكنك من ان تصبح مطور واجهات خلفية (back end) تتعامل من السيرفرات وقواعد البيانات فيمكنك مذاكرة لغة برمجة php و اى اطار عمل خاص بها سواء ووردبريس او لارافيل
    1 نقطة
  30. بشكل بسيط وبدون تعقيد، تلك اللغات هي اللغات الأساسية لمواقع الويب والمبني عليها أي تقنية أخرى خاصة بالويب (المكتبات والإطارات الخاصة بالواجهة الأمامية). HTML نستخدمها لبناء هيكل الصفحة، أي تخيلي معي جسم السيارة نفسه (الهيكل المعدني). بعد ذلك نحن بحاجة إلى طلاء ذلك الهيكل وتنسيقه وتجميله صحيح؟ إذن نستخدم لغة CSS. لكن السيارة لن تتحرك بدون محرك صحيح؟ إذن نحن بحاجة إلى استخدام لغة جافاسكريبت وهي لغة برمجة الويب، ومن خلالها نضيف الديناميكية للموقع أي تنفيذ أمر معين عند النقر على زر ما وتغيير محتوى جزء من الصفحة بناءًا على أمر معين أو حدث معين وهكذا، أي التفاعل مع المستخدم، فالموقع بدون تلك اللغة لا يفهم ماذا يعني أن المستخدم ضغط على الزر؟ وبالتالي علينا استخدام ما سبق سويًا، لكن ليس بالضرروة استخدام جافاسكريبت، طالما أننا لا نحتاج إلى وجود ميزات برمجية في الموقع أي أوامر نكتبها يفهمها المتصفح ويقوم بأمر معين. لفهم الأمر انظر للصورة التالية: حيث توضح الصورة ما الذي تضيفه كل لغة عند استعمالها في بناء الموقع، لاحظ شكل الموقع من خلال HTML فقط، ثم أضفنا CSS، لكن الموقع هو شكل فقط حاليًا ونحتاج إلى إضافة تفاعلية له لتنفيذ أمر ما حسب ما نريد، إذن نستخدم جافاسكريبت لاحظ الأزرار والتحكم والحركة بناءًا على تفاعل المستخدم مع الموقع.
    1 نقطة
  31. أظن أن ما تبحث عنه هو مكتبة Laravel-world، فهي توفر قائمة بالدول والولايات والمدن والعملات والتواريخ الزمنية وتُدمج المكتبة البيانات مع نماذج Eloquent عبر قاعدة البيانات وتوفر واجهات ووظائف مساعدة وطرق API. تفقد أيضًا مكتبة Laravel Countries قد تفيدك.
    1 نقطة
  32. لا للاسف لا يوجد بيانات مجمعة لمراكز المدن . يمكنك البحث عن المراكز الخاصة بالدولة التى تريدها منفصلة و لكنك ستجد صعوبة فى العثور عليها
    1 نقطة
  33. نعم يوجد لكنها ليست package هى عبارة عن ملف sql خاص بقاعدة البيانات يمكنك تشغليه على السيرفر الخاص بك ويصبح لديك جدول خاص بالدول وجدول خاص بالمدن وهى تدعم اللغه العربية والانجليزية والفرنسية https://github.com/arabnewscms/countries-and-cities-list-with-three-language/tree/master يمكنك تحميل ملف countries_db.sql ورفعه على السيرفر الخاص بك او يمكنك تحميل مجلد laravel_version وهو يحتوى على ملفات ال migrations و ال seeders و تشغيلهم عن طريق ال command الخاص بال artisan php artisan migrate php artisan db:seed --class=CitySeeder php artisan db:seed --class=CountrySeeder
    1 نقطة
  34. نعم تعرف هذه المنصات بمواقع (No-Code) مواقع No-Code هي منصات وأدوات تسمح للمستخدمين ببناء تطبيقات الويب والمواقع الإلكترونية دون الحاجة إلى كتابة أي كود برمجي. يتم ذلك من خلال استخدام واجهات سهلة الاستخدام تعتمد على السحب والإفلات (Drag-and-Drop) وتحرير النصوص والاختيار من بين قوالب الجاهزة. المميزات الرئيسية لمواقع No-Code: 1. توفر واجهات سهلة الاستخدام تتيح للمستخدمين بناء التطبيقات والمواقع بسرعة وبدون الحاجة إلى مهارات برمجية. 2. يتيح استخدام السحب والإفلات والقوالب الجاهزة تسريع عملية التطوير وتقليل الوقت اللازم لإطلاق التطبيقات والمواقع. 3. تقليل التكاليف المرتبطة بتطوير التطبيقات والمواقع الإلكترونية عن طريق الحاجة إلى فريق برمجة. 4. رغم أنها تعتمد على القوالب والأدوات الجاهزة، إلا أن معظم منصات No-Code توفر خيارات للتخصيص والتعديل حسب احتياجات المستخدم. السلبيات الرئيسية لمواقع No-Code: 1. بعض هذه الأدوات قد تقلل من قدرتك على التحكم الدقيق في تصميم موقعك، وذلك بسبب القيود المفروضة على الأدوات المتاحة لك والتي قد تحد من إمكانياتك في تنفيذ أفكارك بالطريقة التي تريدها. 2. تؤدي استخدام بعض الأدوات القاعدة على السحب والإفلات إلى إنتاج كود غير فعّال أو زائد، مما قد يؤثر على أداء الموقع وزيادة أوقات التحميل. 3. ستواجهه صعوبة في دمج مواقع الويب التي تم إنشاؤها باستخدام أدوات السحب والإفلات مع تقنيات أخرى أو مكتبات مثل ReactJS أو ElectronJS بسبب تناقض الأساليب والتقنيات. 4. من الصعب في بعض الحالات فهم الكود المولد من الأدوات التي تستخدم السحب والإفلات، مما يجعل من الصعب إجراء التعديلات أو إصلاح الأخطاء فيما بعد. هذه مواقع No-Code ستساعدك في بناء موقعك Wix : توفر Wix واجهة سحب وإفلات (Drag-and-Drop) تسمح للمستخدمين بسهولة تخصيص تصميم الموقع باستخدام مجموعة متنوعة من القوالب والعناصر. Weebly : وفر Weebly أدوات سهلة الاستخدام لتخصيص تصميم الموقع وإضافة ميزات مثل النماذج والمتاجر الإلكترونية والمدونات وغيرها. Squarespace : توفر Squarespace أدوات بناء موقع تسمح بالتخصيص الشامل للمواقع بما في ذلك الصفحات والمدونات والمتاجر الإلكترونية. Elementor (WordPress Plugin) : Elementor هو إضافة لمنصة WordPress تسمح بإنشاء صفحات الويب باستخدام واجهة سحب وإفلات. انصحك اذا كنت تريد بناء موقع قوي وتخصصه علي حسب احتياجك ستحتاج الي تعلم تطوير الوجهات الاماميه وهنا تاتي دور اكاديمية حسوب التي تقدم كورس تطوير وجهات الاماميه مع شهادة معتمده
    1 نقطة
  35. اكرمك الله وازادكم من علمه
    1 نقطة
  36. ما فهمته أنك تريد اضافة الكلمة بعد عملية الانتقال لصفحة المقال العشوائي بإمكانك اضافة الكلمة بطريقة نصية بعد الانتقال إلي الصفحة window.addEventListener("load", function () { if (!window.location.href.includes("?abdo")) { window.location.href += "?abdo"; } }); ويكون هذا الكود داخل صفحة المقال العشوائي سيتم إضافته بعد تحميل الصفحة ولكن إذا كنت تريد إضافته قبل عملية الإنتقال للصفحة ولابد أن يكون في الرابط لكى تتم عملية تحميل المقال بإمكانك اضافة الكلمة بالدالة `replace` كما أشار أخى ياسر أو استخدام الطريقة النصية بالطريقة النصية قبل عملية الإنتقال للصفحة تكون كالأتى function showLucky(e) { var t = e.feed; var n = t.entry || []; var r = t.entry[0]; for (var i = 0; i < r.link.length; ++i) { if (r.link[i].rel == "alternate") { var href = r.link[i].href; href += "?abdo"; window.location.href = href; } } } }
    1 نقطة
  37. المشكلة في الكود الخاص بك أنه عند الضغط على زر فتح المقالات عشوائيا، يتم فتح المقالة بشكل عشوائي من الموقع، لضبط الأمر، يجب تعديل الكود الحالي بحيث يقوم بإضافة الكلمة المطلوبة في نهاية رابط المقالة المفتوحة. هذا يمكن تحقيقه من خلال تعديل الدالة التي تفتح المقالة عشوائيا، بحيث تقوم بإضافة الكلمة المحددة في نهاية الرابط قبل توجيه المتصفح إليه. هناك طريقتين للقيام بذلك: استخدام الدالة `replace`: من خلال استبدال الرابط الحالي برابط جديد يحتوي على الكلمة المطلوبة في نهاية الرابط. استخدام العمليات النصية: بحيث يتم إضافة الكلمة المطلوبة بشكل مباشر إلى نهاية الرابط. بعد تحديد الطريقة المرغوبة، يمكن تطبيق التغييرات على الكود بحيث يقوم بإضافة الكلمة المطلوبة في نهاية الرابط بعد فتح المقالة عشوائيا. مثلا لو استخدمنا الطريقة الأولى، يمكن استخدام الدالة replace لتحويل الرابط الموجود بحيث تضيف الكلمة المطلوبة في نهاية الرابط. في هذه الحالة، سنقوم بإضافة الكلمة "abdo?" في نهاية الرابط بهذا الشكل: function showLucky(e) { var t = e.feed; var n = t.entry || []; var r = t.entry[0]; for (var i = 0; i < r.link.length; ++i) { if (r.link[i].rel == "alternate") { var href = r.link[i].href; href = href.replace(/\?$/, "?abdo?"); window.location = href; } } }
    1 نقطة
  38. نعم، يمكنك طباعة الفورم ككل بما في ذلك التكس بوكس والجروب بوكس وجميع المحتويات باستخدام الأدوات المتاحة في C#، فمثلا يمكنك استخدام PrintDocument Class أو أدوات التقارير المتاحة في Visual Studio أو حتى استخدام ()Console.WriteLine لطباعة البيانات على الشاشة أو في ملف نصي. كما يمكن استخدام مكتبات الطباعة الخارجية مثل iTextSharp أو DevExpress لإنشاء ملفات PDF أو XPS تحتوي على محتوى الفورم. وكمثال فقط للشرح سأستخدم PrintDocument Class لشرح كيفية طباعة الفورم ككل. هذا المثال سيشمل إنشاء فورم ببعض العناصر مثل التكس بوكس والجروب بوكس، وسنقوم بطباعة محتويات الفورم على ورقة. سيكون بهذا الشكل: using System; using System.Drawing; using System.Drawing.Printing; using System.Windows.Forms; public class PrintFormExample : Form { private TextBox textBox; private GroupBox groupBox; private Button printButton; private PrintDocument printDocument; public PrintFormExample() { textBox = new TextBox(); textBox.Text = "This is a TextBox"; groupBox = new GroupBox(); groupBox.Text = "This is a GroupBox"; groupBox.Controls.Add(new Label { Text = "Label inside GroupBox", Location = new Point(10, 20) }); printButton = new Button(); printButton.Text = "Print Form"; printButton.Click += new EventHandler(PrintButton_Click); printDocument = new PrintDocument(); printDocument.PrintPage += new PrintPageEventHandler(PrintDocument_PrintPage); Controls.Add(textBox); Controls.Add(groupBox); Controls.Add(printButton); } private void PrintButton_Click(object sender, EventArgs e) { PrintDialog printDialog = new PrintDialog(); printDialog.Document = printDocument; if (printDialog.ShowDialog() == DialogResult.OK) { printDocument.Print(); } } private void PrintDocument_PrintPage(object sender, PrintPageEventArgs e) { Bitmap bitmap = new Bitmap(ClientSize.Width, ClientSize.Height); DrawToBitmap(bitmap, new Rectangle(0, 0, ClientSize.Width, ClientSize.Height)); e.Graphics.DrawImage(bitmap, 0, 0); } [STAThread] static void Main() { Application.EnableVisualStyles(); Application.Run(new PrintFormExample()); } } هنا قد قمت بإنشاء فورم بسيط يحتوي على TextBox و GroupBox وزر Print Button. عند النقر على زر "Print Form"، يتم فتح مربع حوار الطباعة لاختيار الطابعة، ثم يتم طباعة محتويات الفورم على الورقة. داخل PrintDocument_PrintPage event handler، نقوم برسم محتويات الفورم على Graphics كما لو كانت على الشاشة ويتم هذا الأمر باستخدام DrawToBitmap لتحويل محتويات الفورم إلى Bitmap ثم رسمها على ورقة الطباعة المحددة.
    1 نقطة
  39. وعليكم السلام! نعم، يمكنك عمل طباعة للفورم في C# باستخدام مكتبة PrintDocument . فيما يلي مثال بسيط يوضح كيفية إعداد الطباعة لفورم: using System; using System.Drawing; using System.Drawing.Printing; using System.Windows.Forms; public class PrintExample : Form { private PrintDocument printDocument1 = new PrintDocument(); private Button printButton = new Button(); private TextBox textBox = new TextBox(); private GroupBox groupBox = new GroupBox(); public PrintExample() { printDocument1.PrintPage += new PrintPageEventHandler(printDocument1_PrintPage); printButton.Text = "Print Form"; printButton.Click += new EventHandler(printButton_Click); textBox.Text = "Text to be printed."; textBox.Location = new Point(10, 10); groupBox.Text = "Group Box Content"; groupBox.Location = new Point(10, 50); groupBox.Size = new Size(200, 100); Controls.Add(printButton); Controls.Add(textBox); Controls.Add(groupBox); } private void printButton_Click(object sender, EventArgs e) { PrintDialog printDialog = new PrintDialog(); printDialog.Document = printDocument1; if (printDialog.ShowDialog() == DialogResult.OK) { printDocument1.Print(); } } private void printDocument1_PrintPage(object sender, PrintPageEventArgs e) { // Draw the text from the TextBox e.Graphics.DrawString(textBox.Text, textBox.Font, Brushes.Black, new PointF(100, 100)); // Draw the contents of the GroupBox DrawGroupBox(groupBox, e.Graphics, new PointF(100, 150)); } private void DrawGroupBox(GroupBox groupBox, Graphics g, PointF point) { // Draw the GroupBox border g.DrawRectangle(Pens.Black, point.X, point.Y, groupBox.Width, groupBox.Height); // Draw the GroupBox text g.DrawString(groupBox.Text, groupBox.Font, Brushes.Black, point.X + 5, point.Y - groupBox.Font.Height); // Offset the point for controls within the GroupBox point.X += 10; point.Y += 20; // Draw the controls inside the GroupBox foreach (Control control in groupBox.Controls) { control.DrawToBitmap(new Bitmap(control.Width, control.Height), new Rectangle(0, 0, control.Width, control.Height)); g.DrawImage(control.BackgroundImage, point); point.Y += control.Height + 5; } } [STAThread] static void Main() { Application.EnableVisualStyles(); Application.Run(new PrintExample()); } }
    1 نقطة
  40. متاح ذلك من خلال PrintDocument Class لإنشاء تقرير يعكس محتوى الفورم، أو استخدام أدوات مثل Crystal Reports أو ReportViewer Control في Visual Studio لإنشاء تقارير مخصصة، وتصميم التقرير بحيث يعرض جميع العناصر التي ترغب في طباعتها بما في ذلك التكس بوكس والجروب بوكس والبيانات. أو بالإعتماد على Console.WriteLine() لطباعة البيانات على الشاشة أو في ملف نصي. مع تثبيت مكتبة طباعة خارجية مثل iTextSharp أو DevExpress لإنشاء مستند PDF أو XPS يحتوي على محتوى الفورم.
    1 نقطة
  41. كيف يعمل التابع splice في جافاسكربت؟
    1 نقطة
  42. السلام عليكم , هل Webflow يغنيني عن تعلم html و css ؟ وفي حال غير صحيح , ماذا يفيدني تعلم Webflow ؟ في الحقيقة اواجه بعض الحيرة هل اكمل تعلم html و css أو أكتفي بتعلم Webflow .
    1 نقطة
  43. لا ، لا يمكن لـ Webflow أن يحل محل تعلم HTML و CSS. لكنه يمكن أن يسرع من عملية إنشاء صفحات ويب متقدمة. بصفة عامة ، يفعل Webflow ما يلي: يوفر واجهة مرئية drag-and-drop لإنشاء الصفحات ، بدلاً من كتابة الكود يدويًا. يولد رموز HTML و CSS وبنية صفحة ويب كاملة تلقائيًا بناءً على التصميم الذي قمت بإنشائه. يمكنك تصدير الكود المولد أو نشر الصفحة مباشرة على موقع ويب. على الرغم من أن هذا يوفر طريقة سريعة لإنشاء صفحات جميلة ، إلا أنك لا تزال بحاجة لفهم كيفية عمل HTML و CSS للسيطرة التامة على ما تنشئه. يجب عليك تحديد هدفك النهائي أو الغرض من تعلم Webflow . لذلك لديك خياران رئيسيان: تعلم HTML و CSS إذا كنت تريد بناء وتعديل مواقع بنفسك أو تعلم مجال ال web والإحتراف استخدام Webflow إذا كانت المهمة بسيطة أو تريد تصميم مواقع بسيطبدون الدخول في مرحلة ال coding.
    1 نقطة
  44. شاكر لحسن الإجابة أفهم منك أن أعمل بتدرج وهو تعلم مبدئيا html و css وتعمق في أسس التصميم ثم الإنتقال الى Webflow صحيح ؟
    1 نقطة
  45. Webflow هو منشئ مواقع الويب المتقدم الذي يتطلب بعض المعرفة الأساسية في التصميم والتطوير. قد يكون هناك صعوبة في التعلم للمبتدئين الذين ليس لديهم خبرة في هذه المجالات. بالإضافة إلى ذلك ، قد تكون تكلفة استخدام Webflow أعلى من بعض المنشئات الأخرى ، مما يجعلها أقل جاذبية للمبتدئين. Webflow يوفر CMS قويًا يسمح للمستخدمين بالكثير من الحرية الإبداعية. و يتيح Webflow أداة إنشاء مواقع ويب مرئية و مرنة للغاية، بالإضافة إلى دعم HTML و CSS و JavaScript ، مما يسمح للمستخدمين بإنشاء مواقع ويب معقدة ومخصصة. CMS هو اختصار لـ "نظام إدارة المحتوى" وهو نظام يسمح للمستخدمين بإنشاء وإدارة المحتوى الرقمي. فهم العلاقة بين HyperText Markup Language (HTML) و Cascading Style Sheets (CSS) هو أمر حاسم عند بناء المواقع. HTML يشكل هيكل ومحتوى الموقع ، في حين أن CSS يصمم المحتوى. Webflow يولد هذا الكود أثناء تصميمك. في نهاية المطاف ، Webflow لا يغنيك عن تعلم HTML و CSS ، لأن فهم هذه التقنيات مهم لفهم كيفية عمل Webflow. ومع ذلك ، فإن تعلُّم Webflow قد يساعدك في إنشاء مواقع الويب بشكل أسرع وأكثر كفاءة من خلال استخدام أدوات التصميم المرئية المرنة للغاية.
    1 نقطة
×
×
  • أضف...