Workshop й станції
TeachFORGE.ai
Workshop / HTML / CSS / JS
HTML / CSS / JS Станція
Будуйте живі вебчастини в багатопанельному просторі авторства — з етапами збірки разом, параметричними змінними й автономним експортом 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
- Етапи збірки разом — захоплення, крок і режим Презентувати
- Параметричні змінні для повторно використовуваного керування темою й значеннями
- Рамки попереднього перегляду пристроїв і додаткові бібліотеки на кшталт KaTeX
- Автономний експорт HTML, Просунутий JSON, спільний доступ, вбудовування й надсилання на Whiteboard
Як панелі стають сторінкою
Почніть із шаблону або редагуйте три панелі
Додайте етапи й параметричні змінні, коли урок їх потребує.
Запустіть живий або ручний попередній перегляд
Ізольований iframe показує сторінку так, як її зустрінуть ті, хто вчиться.
Покажіть етапи, експортуйте або надішліть наживо
Віднесіть результат на дошку, в питання або назовні як автономний HTML.
Одна сторінка. Кожна її версія.
Ця Станція підтримує параметричні змінні і етапи збірки разом: збережіть структуру сторінки, змініть тему й розкривайте конструкцію по порядку — замість підтримувати дванадцять трохи різних HTML-файлів.
Змінюйте під час викладання
Підлаштуйте параметричні значення або перейдіть до наступного етапу в режимі Презентувати.
Збережіть структуру, змініть тему
Той самий пакет сторінки завтра може показати інший акцент, набір даних або складність.
Викладайте збірку, не лише фініш
Етапи дають класу дивитися, як сторінка складається.
Залишайтеся близько до оцінювання
Збережіть портативний пакет JSON і повторно використовуйте в пізніших уроках або лабораторіях.
Потрібен швидкий фрагмент Run-and-консоль? Код Пісочниця — сестринська Станція для цього. HTML / CSS / JS — для авторських сторінок з етапами й експортом.
Готові сторінки, з яких почати
Відкрийте шаблон і переформуйте його під свій урок:
| Ділянка | Що можна відкрити |
|---|---|
| Основи | Порожня; картка профілю; майданчик Флексбокс |
| Збірка разом | Етапи кнопки; перемикач колірної теми |
| Інтерактив | Анімація полотна; інтерфейс вікторини; таблиця даних |
Допомога ШІ — на ваш лад
Потрібна перша чернетка? Скористайтеся ШІ як помічником — потім перегляньте, відредагуйте й схваліть, перш ніж щось потрапить до тих, хто вчиться.
Скопіювати підказку
Згенеруйте готову підказку й вставте її в чат-інструмент, яким уже користуєтеся.
Використовуйте власний GPU
Підключіть локальну кінцеву точку моделі в налаштуваннях і запускайте генерацію на обладнанні, яке контролюєте.
Використовуйте власний ключ API
Додайте ключ постачальника в налаштуваннях, оберіть модель і генеруйте зі свого облікового запису.
ШІ може помилятися. Саме тому вчитель лишається в циклі.
Віднесіть сторінку туди, де відбувається викладання
- Whiteboard — поставте на живу дошку й підлаштуйте перед класом
- Quest Ladder — вставте в питання й пояснення
- Virtual Lab — повторно використайте в інтерактивній лабораторній роботі
- Спільнота — поділіться тим, що створили, і спирайтеся на те, чим поділилися інші педагоги