تكليفات JavaScript Bootcamp من الدرس 169 إلى 178

[ 4 ] تكليفات خاصة ب [ AJAX And JSON ]

إنضم لكورسات الأكاديمية وإستفيد من الخصم الخاص في البداية من هنا
نوصي بكورس تعلم أساسيات البرمجة من أكاديمية Codezilla من هنا
إحترف التسويق وإدارة الأعمال مع الدبلومة الإحترافية وإحصل على خصم عن طريقنا من هنا
لحجز إستضافة من Hostinger والحصول على الخصم عن طريقي إتبع الشرح من هنا

من جوجل

المقاطع المطلوب مشاهدتها

الدروس من رقم 169 إلى رقم 178 من الدورة التعليمية الموجودة هنا

التكليف 01

  • قم بإنشاء ملف JSON يحتوي على قائمة من المقالات عددها 5 بإسم articles.json
  • المقال يحتوي على ال id وإسم كاتب المقال والقسم الخاص بالمقال وعنوان المقال والمحتوى الخاص به
  • يمكنك تسمية العناصر كما تريد بإتباع ما تعلمته سابقا ويمكنك وضع أي بيانات عشوائية

مساعدة

يمكنك الفصل بين كل JSON Object والآخر عن طريق علامة ال Comma “,” ووضعهم كلهم داخل Square Brackets [] شاهد المثال بالأسفل لتفهم الفكرة

التكليف 02

  • قم بعمل AJAX Call للوصول إلى ال JSON Object السابق
  • قم بالتأكد من أن ال Request تم بنجاح وتأكد من وجود ال Response Data
  • قم بطباعة ال Response في ال Console للتأكد من أن كل شيء سليم
  • قم بإستخدام ال Events الموجودة لطباعة رسالة Data Loaded بعد إنتهاء ال Response تماما

التكليف 03

  • قم بتحويل ال JSON Object السابق ل JavaScript Object وقم بتخزين البيانات في متغير بإسم mainData
  • قم بعمل Loop على جميع المقالات وتغيير القسم الخاص بالمقالات لقسم بإسم All
  • قم بطباعة محتوى متغير mainData في ال Console بعد التحديث
  • قم بتحويل ال JavaScript Object بعد عمل ما سبق إلى JSON Object وقم بتخزينه في متغير بإسم updatedData
  • قم بطباعة محتوى متغير UpdatedData في ال Console

التكليف 04

  • أكمل على ما سبق
  • قم بعمل Loop على جميع بيانات ال JSON Object السابق
  • قم بإنشاء div داخل الصفحة له id بإسم data
  • قم بطباعة البيانات داخل ال Div مثل البنية الموجودة في المثال بالأسفل

مساعدة

يمكنك إستخدام ال document.create أو إستعمال ال Template Literals لإنشاء العناصر مباشرة

تسليم ومراجعة الحلول

الحلول النموذجية هي هدية للداعمين يمكنك الإنضمام للداعمين لترى جميع الحلول من هنا

من جوجل

0 تعليقات


    اترك تعليقاً