Workshop اور اسٹیشنز
TeachFORGE.ai
Workshop / HTML / CSS / JS
HTML / CSS / JS Station
کئی پین والی تصنیف جگہ میں لائیو ویب ٹکڑے بنائیں — بلڈ-الاںگ مراحل، پیرامیٹرک متغیرات، اور جب صفحہ TeachForge سے باہر چاہیے تو آزاد HTML برآمد کے ساتھ۔
AI مسودہ تیار کر سکتا ہے۔ آپ فیصلہ کرتے ہیں کہ کلاس کیا دیکھے۔
HTML / CSS / JS کیا ہے
HTML / CSS / JS کئی پین ویب تصنیف Station ہے۔ مارک اپ، انداز، اور اسکرپٹس ساتھ لکھیں، سینڈ باکس iframe میں صفحہ دیکھیں، اور — جب چاہیے — آزاد HTML فائل برآمد کریں جو TeachForge سے باہر استعمال ہو۔
تدریس میں یہ اہم ہے کیونکہ ویب مہارت تب سمجھ آتی ہے جب سیکھنے والے نتیجہ فوراً دیکھیں۔ انداز بدلیں، بلڈ-الاںگ مرحلہ بڑھائیں، یا چھوٹا انٹرایکٹو صفحہ دکھائیں — لائیو، کچھ ڈپلائے کیے بغیر۔
اساتذہ HTML / CSS / JS کیوں استعمال کرتے ہیں
لائیو ویب ڈیموز
HTML، CSS، اور JavaScript کو حقیقی وقت میں ساتھ برتاؤ کرتے دکھائیں۔
بلڈ-الاںگ سبق
مراحل کیپچر کریں اور انہیں مرحلہ وار Present کریں تاکہ کلاس تعمیر کی پیروی کرے۔
پیرامیٹرک تھیمز
ہر CSS قدر ہاتھ سے ڈھونڈنے کے بجائے کنٹرولز سے رنگ اور متغیرات چلائیں۔
آزاد ہینڈ آؤٹس
Station سے باہر استعمال کے لیے ایک HTML فائل برآمد کریں۔
TeachForge پر HTML / CSS / JS ایک Workshop Station ہے — تدریسی صفحات کے لیے بنا، صرف فوری کوڈ اسنپٹس کے لیے نہیں۔
HTML / CSS / JS اسٹیشن کے اندر
باقی Workshop کی طرح مانوس تصنیف کا انداز ملتا ہے — ایک کے بجائے تین پین۔
- HTML، CSS، اور JS ایڈیٹرز تیز پین سوئچنگ کے ساتھ
- لائیو یا دستی تازہ کاری سینڈباکسڈ iframe پیشنظری میں
- مراحل ساخت — کیپچر، مرحلہ اور Present موڈ
- پیرامیٹرک متغیرات قابلِ استعمالِ مجدد تھیم اور ویلیو کنٹرولز کے لیے
- ڈیوائس پیش منظر فریمز اور اختیاری لائبریریز جیسے KaTeX
- آزاد HTML برآمد، Advanced JSON، شیئر، ایمبیڈ، اور Whiteboard بھیجنا
پینز صفحہ کیسے بنتے ہیں
ٹیمپلیٹ سے شروع کریں یا تینوں پین ترمیم کریں
جب سبق چاہے تو مراحل اور پیرامیٹرک متغیرات شامل کریں۔
Live یا Manual پیش منظر چلائیں
سینڈ باکس iframe صفحہ ویسا دکھاتا ہے جیسا سیکھنے والے ملیں گے۔
اسٹیجز پیش کریں، ایکسپورٹ کریں، یا براہِ راست بھیجیں
نتیجہ بورڈ پر، سوال میں، یا آزاد HTML کے طور پر باہر لے جائیں۔
ایک صفحہ۔ اس کا ہر ورژن۔
یہ Station معاونت کرتا ہے پیرامیٹرک متغیرات اور بلڈ-الاںگ مراحل: صفحہ کی ساخت رکھیں، تھیم بدلیں، اور تعمیر ترتیب سے ظاہر کریں — بارہ قدرے مختلف HTML فائلیں سنبھالنے کے بجائے۔
تدریس کے دوران بدلیں
پیرامیٹرک اقدار ایڈجسٹ کریں یا Present موڈ میں اگلے مرحلے پر جائیں۔
ساخت رکھیں، تھیم بدلیں
وہی صفحہ پیکج کل دوسرا رنگ، ڈیٹا سیٹ، یا مشکل دکھا سکتا ہے۔
تعمیر سکھائیں، صرف اختتام نہیں
مراحل کلاس کو صفحہ جڑتا دیکھنے دیتے ہیں۔
تشخیص سے قریب رہیں
پورٹیبل JSON پیکج محفوظ کریں اور بعد کے سبق یا لیبز میں دوبارہ استعمال کریں۔
اس کے بجائے فوری Run-and-console اسنپٹ چاہیے؟ Code Sandbox اس کے لیے بہن بھائی Station ہے۔ HTML / CSS / JS تصنیف شدہ صفحات مراحل اور برآمد کے ساتھ ہے۔
شروع کرنے کے لیے تیار صفحات
ٹیمپلیٹ کھولیں اور اسے اپنے سبق کے لیے نئی شکل دیں:
| Area | آپ کیا کھول سکتے ہیں |
|---|---|
| بنیادیں | خالی؛ پروفائل کارڈ؛ Flexbox پلے گراؤنڈ |
| بلڈ-الاںگ | بٹن اسٹیجز؛ کلر تھیم سوئچر |
| تعاملی | کینوس اینیمیشن؛ Quiz UI؛ ڈیٹا ٹیبل |
AI مدد، آپ کے انداز میں
پہلا مسودہ چاہیے؟ AI کو معاون بنائیں — پھر جائزہ لیں، ترمیم کریں، اور منظور کریں اس سے پہلے کہ کچھ سیکھنے والوں تک پہنچے۔
پرامپٹ کاپی کریں
تیار پرامپٹ بنائیں اور اسے اسی چیٹ ٹول میں چسپاں کریں جو آپ پہلے سے استعمال کرتے ہیں۔
اپنا GPU استعمال کریں
اپنی ترتیبات میں مقامی ماڈل اینڈ پوائنٹ جوڑیں اور اس ہارڈویئر پر جنریشن چلائیں جسے آپ کنٹرول کرتے ہیں۔
اپنی API کلید استعمال کریں
ترتیبات میں فراہم کنندہ کی کلید شامل کریں، ماڈل چنیں، اور اپنے اکاؤنٹ سے جنریٹ کریں۔
AI غلط ہو سکتا ہے۔ اسی لیے استاد لوپ میں رہتا ہے۔
صفحہ وہاں لیں جہاں تدریس ہوتی ہے
- Whiteboard — اسے لائیو بورڈ پر رکھیں اور کلاس کے سامنے ایڈجسٹ کریں
- Quest Ladder — اسے سوالات اور وضاحتوں میں ڈالیں
- Virtual Lab — انٹرایکٹو لیب ورک میں دوبارہ استعمال کریں
- Community — جو بنایا شیئر کریں، اور دوسرے اساتذہ کی شیئرنگ پر تعمیر کریں