Bootstrap Code Play

تعلّم تصميم مواقع الويب المتجاوبة مع دروس Bootstrap التي يمكنك تعديلها ومعاينتها. يربط Bootstrap Code Play بين الشروحات، وأمثلة الشفرة البرمجية، وبيئة تجريبية لتتمكن من استكشاف تأثير تغيير بنية الصفحة.

اقرأ، عدّل، عاين

اختر موضوعًا، واقرأ كيفية عمله، ثم انقر على "جرّبه" لفتح مثاله في المحرر. غيّر فئة، أو عدّل المحتوى، أو أضف عنصرًا. افتح المعاينة لفحص النتيجة، ثم ارجع إلى الشفرة لتجربة أخرى.

تعلّم أساسيات التصميم

تدرّب على الشبكات المتجاوبة، والطباعة، والأزرار، والتنبيهات، والجداول، والنماذج. استكشف مكونات مثل البطاقات، وأشرطة التنقل، والقوائم المنسدلة، والحوارات في مسارات التعلّم المناسبة. تتضمن الدروس الإرشادية خطوات وتحديات وأخطاء شائعة لمساعدتك على فهم الشفرة بدلًا من مجرد نسخها. تجمع دروس المشاريع المفاهيم معًا في أمثلة مثل قسم التسعير ولوحة تحكم مُصغّرة.

اختر مسارًا تعليميًا

ادرس مسار Bootstrap 5.3.8 المرفق، أو استكشف Bootstrap 4.6.2 و3.4.1 للمشاريع القديمة. المسارات القديمة لم تعد مدعومة، وهي مُتاحة للتعلم والترقية. يوجد مسار Bootstrap 6 alpha تجريبي؛ تتطلب معاينته اتصالاً بالإنترنت وبرنامج WebView حديث.

واصل التدريب

ابحث عن المواضيع أو تصفح حسب الفئة. ضع علامة على الدروس المكتملة واطلع على عدد مرات إكمال كل إصدار. افتح بيئة التطوير لتجاربك الخاصة على HTML، واحفظ ملفًا، ثم ارجع إليه من خلال "الملفات المحفوظة".

حرّر باستخدام أدوات مفيدة

استخدم تمييز الصيغة، والتراجع والإعادة، والبحث والاستبدال، والانتقال إلى سطر محدد أثناء العمل على الأمثلة. يحفظ خيار "حفظ باسم" نسخة منفصلة، ​​ويرسل خيار "مشاركة الكود" نص المحرر عبر خيارات المشاركة المتاحة.

يُقدّم التطبيق للطلاب والمتعلمين الذين يعتمدون على التعلم الذاتي والمطورين الذين يُعيدون النظر في تصميمات المواقع المتجاوبة، تجربة عملية: اقرأ الشرح، وأجرِ تعديلاً بسيطاً، ثمّ تفحّص النتيجة.

يحتوي التطبيق على إعلانات. تتطلب الأمثلة التي تُشير إلى مصادر خارجية اتصالاً بالإنترنت؛ وقد يختلف توافر هذه المصادر.