Workshop at Mga Istasyon
TeachFORGE.ai
Workshop / Code Sandbox
Istasyon ng Code Sandbox
Sumulat at magpatakbo ng JavaScript, Python, at HTML na may instant na output — ligtas na lugar para magpakita ng code nang live at magtago ng mga halimbawang mabubuksan muli.
Maaaring mag-draft ang AI. Ikaw ang magpapasya kung ano ang makikita ng klase.
Ano ang Code Sandbox
Ang Code Sandbox ay browser code runner para sa pagtuturo. Sumulat ng JavaScript o Python (sa pamamagitan ng Pyodide) at tingnan agad ang output ng console, o patakbuhin ang preview ng dokumentong HTML — pindutin ang Run, panoorin ang resulta, itago ang halimbawa para sa susunod.
Mahalaga ito dahil namamatay ang demo kapag nakaharang ang setup. Dito, ang punto ay ang snippet at ang output, hindi ang pag-install ng toolchain sa harap ng hindi mapakaling klase.
Bakit ginagamit ng mga guro ang Code Sandbox
Mga instant na demo sa JS at Python
Ipakita ang script at output ng console nang hindi umaalis sa Workshop.
Mga visual ng algorithm sa HTML
Mga template ng sorting at canvas na ginagawang nakikita ang proseso, hindi lang nai-print.
Mabilis na snippet ng data
Maliit na script ng pagsusuri kapag kailangan mo agad ng kuwento ng numero.
Mga mini na interaktibong pagsusulit
Mga HTML starter na maaari mong hubugin para sa maikling retrieval activity.
Sa TeachForge, ang Code Sandbox ang kapatid na Run-and-console ng HTML / CSS / JS — piliin ang Sandbox para sa snippet; piliin ang HTML / CSS / JS para sa staged na pagsulat ng pahina.
Sa loob ng Istasyon ng Code Sandbox
Tulad ng iba pang bahagi ng Workshop, pinagsasama-sama ng Istasyon ang pinagmulan at resulta — na may sadyang hakbang na Run.
- Mga language pill para sa JavaScript, Python (Pyodide), at HTML
- Run-to-preview na may output ng console o resulta ng HTML iframe
- Mga template na naka-filter ayon sa wika upang tumugma ang starter sa mode na pinili mo
- I-download ang source kapag gusto mo ang file sa iyong device
- I-save bilang language + code JSON para sa muling paggamit na mabubuksan kahit saan
- Pagbabahagi at chrome ng Workshop na consistent sa iba pang Istasyon
Paano nagiging resulta ang snippet
Pumili ng wika at mag-load ng template o mag-type ng code
Panatilihing sapat na maliit ang halimbawa upang maituro sa isang hinga.
Pindutin ang Run
Naglo-load ang Python ng Pyodide kapag kailangan; agad ang preview ng JS at HTML.
I-save, i-download, o muling gamitin
Itago ang snippet para sa susunod na grupo, o dalhin ang ideya sa mas buong Istasyon sa ibang pagkakataon.
Isang snippet. Bawat bersyon nito sa aralin.
Sadyang magaan ang Code Sandbox: ang muling paggamit ay mula sa mga template ng wika at naka-save na language + code JSON, hindi mula sa malaking parametric na katalogo. Iyon ang punto — mabilis na demo na mabubuksan muli, hindi pangalawang Istasyon sa pagsulat ng pahina.
Baguhin ito habang nagtuturo ka
I-edit ang isang linya, pindutin ang Run, at ipakita kung ano ang nagbago.
Panatilihin ang halimbawa, iba-ibahin ang hamon
Makikita ng klase bukas ang iisang balangkas na may mas mahirap na twist.
Manatiling portable
I-download ang source o muling buksan ang JSON saan ka man magturo sa susunod.
Umakyat kapag kailangan
Lumipat sa HTML / CSS / JS kapag mas mahalaga ang yugto, theme, at standalone na export kaysa Run.
Kung kailangan mo ng build-along na yugto at parametric na variable ng pahina, buksan ang HTML / CSS / JS. Ang Code Sandbox ang mabilis na runner.
Mga handang snippet na pagsisimulan
Magbukas ng template ng wika at hubugin:
| Lugar | Ano ang mabubuksan mo |
|---|---|
| JavaScript | Hello World; Data Analysis; Recursion Explorer; Geometry Calculator |
| Python | Hello World; Number Theory |
| HTML | Interactive Canvas; Sorting Visualiser; Interactive Quiz |
Tulong ng AI, sa iyong paraan
Kailangan ng unang draft? Gamitin ang AI bilang katulong — pagkatapos ay suriin, i-edit, at aprubahan bago makarating sa mga mag-aaral.
Kopyahin ang prompt
Gumawa ng handang prompt at i-paste ito sa chat tool na ginagamit mo na.
Gamitin ang sarili mong GPU
Ikonekta ang isang local model endpoint sa iyong mga setting at patakbuhin ang generation sa hardware na kontrolado mo.
Gamitin ang sarili mong API key
Idagdag ang iyong provider key sa mga setting, piliin ang modelo, at mag-generate gamit ang sarili mong account.
Maaaring magkamali ang AI. Iyon mismo ang dahilan kung bakit nananatili ang guro sa loop.
Dalhin ang snippet kung saan nagaganap ang pagtuturo
- Whiteboard — ilagay ito sa live na board at i-adjust sa harap ng klase
- Quest Ladder — ilagay ito sa mga tanong at paliwanag
- Virtual Lab — muling gamitin sa loob ng interaktibong gawain sa lab
- Komunidad — ibahagi ang iyong ginawa, at bumuo sa ibinahagi ng ibang mga educator