Workshop y Stations
TeachFORGE.ai
Workshop / Code Sandbox
Code Sandbox Station
Escribe y ejecuta JavaScript, Python y HTML con salida instantánea — un lugar seguro para demostrar código en vivo y conservar ejemplos que puedes reabrir.
La IA puede redactar un borrador. Tú decides qué ve la clase.
Qué es Code Sandbox
Code Sandbox es un ejecutor de código en el navegador para enseñar. Escribe JavaScript o Python (vía Pyodide) y ve la salida de la consola al instante, o ejecuta una vista previa de documento HTML — pulsa Run, observa el resultado, conserva el ejemplo para la próxima vez.
Importa porque las demos mueren cuando la configuración se interpone. Aquí el punto es el fragmento y la salida, no instalar una cadena de herramientas frente a una clase inquieta.
Por qué los docentes usan Code Sandbox
Demos instantáneas de JS y Python
Muestra un script y su salida de consola sin salir del Workshop.
Visuales de algoritmos en HTML
Plantillas de ordenamiento y canvas que hacen visible el proceso, no solo imprimible.
Fragmentos rápidos de datos
Pequeños scripts de análisis cuando necesitas una historia numérica rápido.
Mini cuestionarios interactivos
Inicios HTML que puedes adaptar para una actividad corta de recuperación.
En TeachForge, Code Sandbox es el hermano Run-and-console de HTML / CSS / JS — elige Sandbox para fragmentos; elige HTML / CSS / JS para autoría de páginas por etapas.
Dentro de la Code Sandbox Station
Como el resto del Workshop, la Station mantiene cerca el código fuente y el resultado — con un paso Run deliberado.
- Píldoras de lenguaje para JavaScript, Python (Pyodide) y HTML
- Run-to-preview con salida de consola o un resultado iframe HTML
- Plantillas filtradas por lenguaje para que los inicios coincidan con el modo que elegiste
- Descargar código fuente cuando quieres el archivo en tu dispositivo
- Guardar como JSON de lenguaje + código para reutilización y reapertura en cualquier lugar
- Compartir y chrome del Workshop coherente con las demás Stations
Cómo un fragmento se convierte en resultado
Elige un lenguaje y carga una plantilla o escribe código
Mantén el ejemplo lo bastante pequeño para enseñarlo de un aliento.
Pulsa Run
Python carga Pyodide cuando hace falta; JS y HTML se previsualizan de inmediato.
Guarda, descarga o reutiliza
Conserva el fragmento para el siguiente grupo, o lleva la idea a una Station más completa más tarde.
Un fragmento. Todas sus versiones de lección.
Code Sandbox es deliberadamente ligero: la reutilización viene de plantillas de lenguaje y del JSON guardado de lenguaje + código, no de un gran catálogo paramétrico. Ese es el punto — demos rápidas que puedes reabrir, no una segunda Station de autoría de páginas.
Cámbialo mientras enseñas
Edita una línea, pulsa Run y muestra qué cambió.
Mantén el ejemplo, varía el reto
La clase de mañana puede encontrar el mismo esqueleto con un giro más difícil.
Mantente portable
Descarga el código fuente o reabre el JSON dondequiera que enseñes después.
Escala cuando haga falta
Pasa a HTML / CSS / JS cuando las etapas, los temas y la exportación independiente importen más que Run.
Si necesitas etapas de construcción guiada y variables paramétricas de página, abre HTML / CSS / JS. Code Sandbox se queda como el ejecutor rápido.
Fragmentos listos para empezar
Abre una plantilla de lenguaje y adáptala:
| Área | Qué puedes abrir |
|---|---|
| JavaScript | Hello World; Data Analysis; Recursion Explorer; Geometry Calculator |
| Python | Hello World; Number Theory |
| HTML | Interactive Canvas; Sorting Visualiser; Interactive Quiz |
Ayuda de IA, a tu manera
¿Necesitas un primer borrador? Usa la IA como asistente — luego revisa, edita y aprueba antes de que llegue al alumnado.
Copiar el prompt
Genera un prompt listo y pégalo en la herramienta de chat que ya usas.
Usa tu propia GPU
Conecta un endpoint de modelo local en tu configuración y ejecuta la generación en hardware que controlas.
Usa tu propia clave API
Añade la clave de tu proveedor en la configuración, elige el modelo y genera con tu propia cuenta.
La IA puede equivocarse. Por eso exactamente un docente permanece en el circuito.
Lleva el fragmento a donde ocurre la enseñanza
- Whiteboard — colócalo en el pizarrón en vivo y ajústalo frente a la clase
- Quest Ladder — insértalo en preguntas y explicaciones
- Virtual Lab — reutilízalo dentro del trabajo interactivo de lab
- Comunidad — comparte lo que construiste y parte de lo que otros educadores compartieron