Workshop والمحطات
TeachFORGE.ai
Workshop / HTML / CSS / JS
HTML / CSS / JS Station
ابنِ قطع ويب حية في مساحة تأليف متعددة الألواح — مع مراحل بناء متتابع ومتغيرات بارامترية وتصدير HTML مستقل عندما تحتاج الصفحة خارج TeachForge.
يمكن للذكاء الاصطناعي أن يعدّ مسودة. أنت من يقرر ما تراه الصف.
ما هي HTML / CSS / JS
HTML / CSS / JS محطة تأليف ويب متعددة الألواح. تكتب العلامات والأنماط والسكربتات جنبًا إلى جنب، وتعاين الصفحة في iframe معزول، و—عندما تحتاج—تصدّر ملف HTML مستقلًا يمكنك استخدامه خارج TeachForge.
هذا مهم في التدريس لأن مهارات الويب تصبح مفهومة عندما يرى المتعلّمون النتيجة فورًا. غيّر نمطًا، أو تقدّم مرحلة بناء متتابع، أو اعرض صفحة تفاعلية صغيرة — مباشرة، دون نشر أي شيء.
لماذا يستخدم المعلّمون HTML / CSS / JS
عروض ويب مباشرة
أظهر HTML وCSS وJavaScript وهي تعمل معًا في الزمن الحقيقي.
دروس البناء المتتابع
التقط مراحل وقدّمها خطوة بخطوة حتى يتابع الصف البناء.
سمات بارامترية
قد الألوان والمتغيرات بعناصر التحكم بدل البحث عن كل قيمة CSS يدويًا.
نشرات مستقلة
صدّر ملف HTML واحدًا للاستخدام خارج المحطة.
على TeachForge، HTML / CSS / JS محطة Workshop — بُنيت لصفحات التدريس، لا لمقتطفات شفرة سريعة فقط.
داخل محطة HTML / CSS / JS
مثل بقية Workshop، تحصل على إيقاع تأليف مألوف — بثلاثة ألواح بدل واحد.
- محررات HTML وCSS وJS مع تبديل سريع للألواح
- تحديث مباشر أو يدوي إلى معاينة iframe معزولة
- مراحل البناء — وضع التقاط وخطوة وPresent
- متغيرات بارامترية لعناصر تحكم سمة وقيم قابلة لإعادة الاستخدام
- إطارات معاينة الجهاز ومكتبات اختيارية مثل KaTeX
- تصدير HTML مستقل، وAdvanced JSON، ومشاركة وتضمين وإرسال إلى Whiteboard
كيف تصبح الألواح صفحة
ابدأ من قالب أو حرّر الألواح الثلاثة
أضف مراحل ومتغيرات بارامترية عندما يحتاجها الدرس.
شغّل معاينة Live أو Manual
يُظهر iframe المعزول الصفحة كما يلتقيها المتعلّمون.
اعرض المراحل، صدّر، أو أرسل مباشرة
خذ النتيجة إلى السبورة، أو إلى سؤال، أو إلى HTML مستقل.
صفحة واحدة. كل نسخة منها.
تدعم هذه المحطة متغيرات بارامترية و مراحل البناء المتتابع: احتفظ ببنية الصفحة، وغيّر السمة، واكشف البناء بالترتيب — بدل صيانة اثني عشر ملف HTML مختلفة قليلًا.
غيّره أثناء التدريس
اضبط القيم البارامترية أو انتقل إلى المرحلة التالية في وضع العرض.
أبقِ الهيكل، غيّر السمة
يمكن لحزمة الصفحة نفسها أن تُظهر لونًا أو مجموعة بيانات أو صعوبة مختلفة غدًا.
علّم البناء، لا النهاية فقط
تتيح المراحل للصف مشاهدة الصفحة وهي تكتمل.
ابقَ قريبًا من التقييم
احفظ حزمة JSON القابلة للنقل وأعد استخدامها في دروس أو مختبرات لاحقة.
تحتاج مقتطف تشغيل ووحدة تحكم سريعًا بدلًا من ذلك؟ Code Sandbox هي المحطة الشقيقة لذلك. HTML / CSS / JS للصفحات المؤلَّفة ذات المراحل والتصدير.
صفحات جاهزة للبدء منها
افتح قالبًا وأعد تشكيله لدرسك:
| Area | ما يمكنك فتحه |
|---|---|
| الأساسيات | فارغ؛ بطاقة ملف شخصي؛ ملعب Flexbox |
| البناء المتتابع | مراحل الأزرار؛ مبدّل سمة اللون |
| تفاعلية | تحريك اللوحة؛ واجهة Quiz؛ جدول بيانات |
مساعدة الذكاء الاصطناعي بطريقتك
تحتاج مسودة أولى؟ استخدم الذكاء الاصطناعي مساعدًا — ثم راجع وعدّل ووافق قبل أن يصل أي شيء للمتعلمين.
انسخ الموجه
أنشئ موجهًا جاهزًا والصقه في أداة الدردشة التي تستخدمها بالفعل.
استخدم وحدة معالجة الرسومات الخاصة بك
اربط نقطة نهاية لنموذج محلي في إعداداتك وشغّل التوليد على عتاد تتحكم به.
استخدم مفتاح API الخاص بك
أضف مفتاح المزوّد في الإعدادات، واختر النموذج، وولّد بحسابك.
يمكن أن يخطئ الذكاء الاصطناعي. ولهذا تحديدًا يبقى المعلّم في الحلقة.
خذ الصفحة حيث يحدث التدريس
- Whiteboard — ضعه على السبورة المباشرة وعدّله أمام الصف
- Quest Ladder — ضعه في الأسئلة والشروح
- Virtual Lab — أعد استخدامه داخل عمل المختبر التفاعلي
- Community — شارك ما بنيتَ، وابنِ على ما شاركه معلّمون آخرون