Workshop och stationer
TeachFORGE.ai
Workshop / HTML / CSS / JS
HTML / CSS / JS Station
Bygg live webbstycken i ett flerrutig författarutrymme — med build-along-steg, parametriska variabler och fristående HTML-export när du behöver sidan utanför TeachForge.
AI kan ta fram ett utkast. Du avgör vad klassen ser.
Vad HTML / CSS / JS är
HTML / CSS / JS är en flerrutig webbförfattar-Station. Du skriver markup, stilar och skript sida vid sida, förhandsvisar sidan i en sandlådad iframe och — när du behöver det — exporterar en fristående HTML-fil du kan använda utanför TeachForge.
Det spelar roll i undervisningen eftersom webbfärdigheter blir begripliga när elever ser resultatet direkt. Ändra en stil, kliva ett build-along-steg eller visa en liten interaktiv sida — live, utan att deploya något.
Varför lärare använder HTML / CSS / JS
Live webbdemoer
Visa HTML, CSS och JavaScript som beter sig tillsammans i realtid.
Build-along-lektioner
Fånga steg och Presentera dem steg för steg så att klassen följer konstruktionen.
Parametriska teman
Styr färger och variabler med kontroller i stället för att jaga varje CSS-värde för hand.
Fristående utdelningar
Exportera en HTML-fil för användning bortom Stationen.
På TeachForge är HTML / CSS / JS en Workshop-Station — byggd för undervisningssidor, inte bara för snabba kodsnuttar.
Inne i HTML / CSS / JS Station
Som i resten av Workshop får du en bekant författarrytm — med tre rutor i stället för en.
- HTML-, CSS- och JS-redigerare med snabb rutorväxling
- Live eller Manuell uppdatering till en sandlådad iframe-förhandsvisning
- Build-along-steg — fånga, kliva och Present-läge
- Parametriska variabler för återanvändbara tema- och värdekontroller
- Enhetsförhandsvisningsramar och valfria bibliotek som KaTeX
- Fristående HTML-export, Advanced JSON, dela, bädda in och skicka till Whiteboard
Hur rutor blir en sida
Börja från en mall eller redigera de tre rutorna
Lägg till steg och parametriska variabler när lektionen behöver dem.
Kör Live eller Manuell förhandsvisning
Den sandlådade iframen visar sidan som elever skulle möta den.
Presentera steg, exportera eller skicka det live
Ta resultatet till Whiteboarden, in i en fråga eller ut som fristående HTML.
En sida. Varje version av den.
Den här Stationen stöder parametriska variabler och build-along-steg: behåll sidstrukturen, variera temat och avslöja konstruktionen i ordning — i stället för att underhålla tolv nästan identiska HTML-filer.
Ändra det medan du undervisar
Justera parametriska värden eller kliva till nästa steg i Present-läge.
Behåll strukturen, variera temat
Samma sidpaket kan visa en annan accent, dataset eller svårighetsgrad i morgon.
Undervisa bygget, inte bara slutresultatet
Steg låter klassen se hur sidan växer fram.
Håll dig nära bedömningen
Spara det portabla JSON-paketet och återanvänd det i senare lektioner eller labb.
Behöver du en snabb Run-and-console-snutt i stället? Code Sandbox är systerStationen för det. HTML / CSS / JS är för författade sidor med steg och export.
Färdiga sidor att starta från
Öppna en mall och forma om den för din lektion:
| Area | Vad du kan öppna |
|---|---|
| Foundations | Blank; Profile Card; Flexbox Playground |
| Build-along | Button stages; Colour Theme Switcher |
| Interactive | Canvas Animation; Quiz UI; Data Table |
AI-hjälp, på ditt sätt
Behöver du ett första utkast? Använd AI som assistent — granska, redigera och godkänn sedan innan något når eleverna.
Kopiera prompten
Skapa en färdig prompt och klistra in den i chattverktyget du redan använder.
Använd din egen GPU
Anslut en lokal modellendpoint i dina inställningar och kör generering på hårdvara du styr.
Använd din egen API-nyckel
Lägg till din leverantörsnyckel i inställningarna, välj modell och generera med ditt eget konto.
AI kan ha fel. Det är precis därför en lärare stannar kvar i loopen.
Ta sidan dit undervisningen sker
- Whiteboard — lägg det på den live Whiteboarden och justera det framför klassen
- Quest Ladder — lägg in det i frågor och förklaringar
- Virtual Lab — återanvänd det i interaktivt labbarbete
- Community — dela det du byggt, och bygg vidare på det andra pedagoger delat