Versión 2.1 · Total.js Flow 11 · Licencia MIT
Total.js Flow, listo para el aula.
Cada alumno trabaja en su sitio, el profesor ve toda la clase y reparte las prácticas con un clic. Los grupos, los alumnos y el profesor vienen de OpenPlatform.
# Un comando, toda la clase
docker run -d --name flowee -p 8000:8000 \
-v flowee-databases:/www/databases \
-v flowee-flowstream:/www/flowstream \
-v flowee-private:/www/private \
ghcr.io/totaljs-es/flowee// El profesor reparte una práctica a cada alumno
Classroom → Asignar → "Una copia para cada alumno"
// Práctica 1 · Ana, Práctica 1 · Luis, Práctica 1 · Marta…Flow, preparado para enseñar
Total.js Flow te deja dibujar en el navegador FlowStreams: diagramas de componentes conectados por mensajes, para automatización, integraciones e IoT. Esta edición mantiene todo lo que Flow ofrece y añade lo que una clase necesita.
Cada alumno, su espacio
Solo ven y tocan sus FlowStreams. Ni sabiendo el identificador de otro pueden abrirlo.
El profesor lo ve todo
Lista completa, resumen de la clase y acceso al editor de cualquier alumno para ayudarle.
Prácticas con un clic
Prepara una plantilla y entrégala a grupos o a cada alumno.
Usuarios y grupos de OpenPlatform
Altas, clases y permisos se gestionan en un único sitio.
Qué cambia respecto a Flow
Las reglas se comprueban en el servidor, en cada acción y en la conexión del editor. Esconder un botón no es seguridad, así que aquí no se esconde: se comprueba.
Profesor (usuario sa) | Alumno | |
|---|---|---|
| FlowStreams en la lista | Todos | Los de sus grupos y, si un FlowStream tiene dueño, solo los suyos |
| Crear un FlowStream | En cualquier grupo o sin grupo | Solo en sus grupos y con el permiso create |
| Editar, ejecutar, pausar, reiniciar, exportar, borrar | Cualquiera | Solo los suyos (borrar necesita remove) |
| Editor y variables de un FlowStream | Cualquiera | Solo los suyos |
| Código de los componentes (leer, editar, quitar) | Sí | No: trabajan con los componentes de la paleta de su grupo y de la plantilla |
| Importar FlowStreams | Sí | No. Sí pueden duplicar su propio FlowStream |
| Variables globales, ajustes, consola y caché del CDN | Sí | No |
| Panel Classroom (plantillas y resumen) | Sí | No |
| Plantillas | Las ve y las gestiona | No las ve, aunque estén en su grupo |
Además, cada FlowStream se ejecuta en su propio proceso (flowstream_worker : fork), así que un alumno no puede parar el trabajo de los demás.
Cómo se usa en un aula
Antes de la clase preparas la práctica; durante la clase sigues el trabajo de todos.
Crea la práctica
Construye el ejercicio como cualquier FlowStream: componentes, variables y una descripción con el enunciado. En su menú elige Usar como plantilla. Los alumnos nunca ven las plantillas. En Paleta de componentes eliges qué componentes tiene cada grupo: los alumnos no pueden añadirlos ni editarlos.
Repártela
Abre Classroom en el menú de la izquierda y pulsa Asignar. Cada grupo recibe una copia compartida o, con Una copia para cada alumno, cada uno recibe la suya, con el nombre plantilla · alumno, visible solo para él y para ti. Si asignas de nuevo no se repiten las copias: sirve cuando llegan alumnos nuevos.
Sigue la clase
El resumen muestra alumno, grupo, FlowStream, estado, errores, mensajes y último cambio. Filtra por grupo, plantilla o texto para ver quién no ha empezado. Desde cada fila puedes abrir el FlowStream de un alumno para ayudarle, restaurarlo desde la plantilla o quitarlo.
La copia conserva el diseño, los componentes, las variables y la descripción de la plantilla, y empieza a funcionar sola. Los alumnos entran por OpenPlatform, abren Flow y trabajan en su copia; pueden crear más FlowStreams en sus grupos si tienen el permiso create.
Todo lo que puede hacer el profesor
Todas las herramientas viven en el panel Classroom, que solo ven los profesores. Esto es lo que hace cada una y cómo funciona.
Plantillas de prácticas
Crea un ejercicio una vez y repártelo a toda la clase.
- En el menú de cualquier FlowStream elige Usar como plantilla. Una plantilla nunca se muestra a los alumnos, ni siquiera a los de su grupo.
- En Classroom pulsa Asignar y elige los grupos. Cada grupo recibe una copia compartida o, con Una copia para cada alumno del grupo, cada alumno recibe la suya, con el nombre plantilla · alumno, visible solo para esa persona y para ti. La segunda opción necesita la API de usuarios de OpenPlatform (
op_groups). - La copia conserva el diseño, los componentes, las variables y la descripción, y empieza a funcionar sola. Si asignas de nuevo no se repite ninguna copia que ya exista, así que sirve cuando llegan alumnos nuevos.
- Restaurar desde la plantilla sustituye el trabajo de un alumno por la plantilla, para empezar de nuevo.
Resumen de la clase
Mira de un vistazo quién ha empezado, quién tiene errores y quién necesita ayuda.
- Una tabla con el alumno, el grupo, el FlowStream y la plantilla de la que viene, su estado (en marcha o pausado), los errores, el número de mensajes y la fecha del último cambio.
- Filtra por grupo, por plantilla y por texto (alumno o FlowStream). Los mismos filtros se aplican a las entregas y a la actividad.
- El menú de cada fila te deja abrir el FlowStream de un alumno para ayudarle, observarlo en directo, restaurarlo desde la plantilla o quitarlo.
Observar en directo
Sigue el editor de un alumno sin tocar nada.
- Observar en directo, en el menú de una fila, abre el editor de ese FlowStream en una pestaña nueva, en solo lectura: una barra naranja lo indica y no están los controles para cambiar nada.
- No es solo la interfaz: el servidor rechaza cualquier mensaje que cambie el FlowStream (diseño, componentes, variables, pausar, reiniciar o quitar).
- Ves los cambios que el alumno aplica, los mensajes y los errores según ocurren. La lista de editores conectados muestra que estás ahí, y queda anotado en la actividad.
Modo examen
Abre y cierra el acceso de un grupo por fechas, y que no salga nada del examen.
- En Modo examen elige un grupo, un inicio y un fin. Antes del inicio y después del fin los alumnos del grupo no tienen acceso a sus FlowStreams, ni siquiera con el editor abierto, y no pueden crear nuevos. Tú siempre tienes acceso y los demás grupos no se ven afectados.
- Bloquear exportar, copiar y duplicar (activado por defecto): mientras el examen está abierto nadie puede exportar un FlowStream, leer sus datos en bruto ni duplicarlo. Los alumnos sí pueden entregar.
- Entregar el trabajo de cada alumno cuando termine el examen (activado por defecto): la aplicación entrega sola, una vez, y aparecen en Entregas como Automática.
- Los alumnos ven un mensaje al entrar: el examen está abierto (hasta cuándo), no ha empezado o ha terminado. Tras el fin el grupo sigue cerrado hasta que elijas Terminar el examen y restablecer el acceso.
Entregas
Los alumnos entregan su trabajo con un clic; recibes una copia congelada.
- El alumno elige Entregar en el menú de un FlowStream. El servidor guarda una copia (diseño, componentes y variables) con su fecha y su número. El alumno puede seguir trabajando y volver a entregar, y la copia que tienes tú no cambia nunca. Se conservan las 20 últimas entregas de cada FlowStream.
- En Entregas puedes abrir una entrega como FlowStream (pasa a ser tuyo, sin grupo, así que ningún alumno lo ve), descargarla en JSON o quitarla.
- Descargar las últimas entregas da un solo archivo con la última entrega de cada FlowStream del grupo y la plantilla que hayas filtrado, para corregirlas.
Componentes: paleta y prohibidos
Decide qué componentes puede usar cada grupo. Los alumnos no pueden añadirlos ni editarlos.
- Paleta. Añade los componentes que quieras a un FlowStream tuyo (por ejemplo uno llamado Biblioteca). En Paleta de componentes elige un grupo y márcalos. Los FlowStreams del grupo los reciben (se reinician una vez), y también cada FlowStream nuevo. El código se guarda en el servidor, así que nadie de la clase puede cambiarlo.
- Prohibidos. En Componentes prohibidos elige un grupo y marca los componentes que quieras quitar: se retiran de sus FlowStreams, también de las copias nuevas y restauradas, y los nodos que los usaban dejan de funcionar. Lo prohibido gana a la paleta. Tus plantillas no se tocan.
- La lista marca con un aviso los componentes cuyo código parece acceder a archivos o al shell (
child_process,exec,fs,eval…). Es un aviso por leer el código, no una prueba. Marca Prohibir también los que parecen acceder a archivos o al shell para prohibirlos automáticamente, también los que lleguen más tarde.
Límites para cada alumno
Mantén sano el servidor en una clase grande.
- FlowStreams para cada alumno: cuántos puede crear o duplicar. Las copias que repartes no cuentan y tú no tienes límite. Al llegar al límite el alumno recibe un mensaje claro.
- Días sin trabajar antes de pausar: los FlowStreams en marcha que un alumno no ha editado, reanudado ni reiniciado en esos días se pausan. El alumno puede reanudarlos y el resumen los muestra como Inactivo.
- El 0 significa sin límite. La memoria de cada FlowStream se limita con
flowstream_memory, ymax_streams/idle_daysdan los valores iniciales.
Registro de actividad
Mira qué hace cada alumno y cuándo.
- Anota abrir el editor, aplicar cambios (una anotación por minuto como mucho), crear, duplicar, quitar, pausar, reanudar, reiniciar, cambiar las variables, exportar y entregar; y lo que hace la aplicación por sí sola (pausar por inactividad, entregar al terminar un examen). También anota cuándo abres u observas el editor de un alumno.
- Filtra por grupo, texto y periodo (24 horas, 7 días, 30 días o todo el tiempo) y descárgalo como tabla (CSV).
- Tiene datos personales: se guarda en tu servidor solo 365 días por defecto (
FLOWEE_ACTIVITY_DAYSlo cambia, 0 lo guarda para siempre), los meses antiguos se borran cada día y puedes borrarlo cuando quieras. Dile a los alumnos que se registra.
Lo que los alumnos no pueden hacer
Nadie copia, hace trampas ni estropea un componente sin querer.
- No pueden leer, editar, añadir ni quitar el código de los componentes; lo rechaza el servidor, no solo la interfaz.
- No pueden importar FlowStreams. Sí pueden duplicar los suyos (dentro de su límite), y un FlowStream que un alumno exporta o lee no lleva el código de los componentes.
- No pueden leer las variables globales, los ajustes ni la consola, y cada FlowStream se ejecuta en su propio proceso, así que un alumno no puede parar el trabajo de los demás.
Instálala con Docker
La imagen está publicada en el GitHub Container Registry y se construye sola para amd64 y arm64: un servidor, un Mac con Apple Silicon o una Raspberry Pi. Node.js 24, nada más que instalar.
Lánzala
docker pull ghcr.io/totaljs-es/flowee
docker run -d --name flowee -p 8000:8000 \
-v flowee-databases:/www/databases \
-v flowee-flowstream:/www/flowstream \
-v flowee-private:/www/private \
ghcr.io/totaljs-es/floweeAbre http://localhost:8000. Los tres volúmenes guardan los ajustes, los FlowStreams de la clase y los archivos privados cuando pasas a una imagen más nueva.
Docker Compose
git clone https://github.com/totaljs-es/flowee.git
cd flowee
docker compose up -dLo mismo, con los volúmenes ya declarados.
Actualízala
docker pull ghcr.io/totaljs-es/flowee
docker rm -f flowee
# vuelve a lanzar el docker run de arribaLos volúmenes conservan los datos. Sin Docker: npm install y npm start (Node.js 24).
¿Cuánta máquina? Cada FlowStream es un proceso independiente. Calcula la memoria para la clase más grande que trabaje a la vez y límitala con flowstream_memory.
Conéctala con OpenPlatform
Flow EE funciona dentro de OpenPlatform: de allí vienen los usuarios, los grupos y los permisos.
Registra la aplicación
Añade Flow EE a OpenPlatform como aplicación; la propia aplicación sirve su openplatform.json (http://tu-flow:8000/openplatform.json). Anota el request token y el response token que le des.
Grupos y permisos
Crea un grupo por cada clase y da la aplicación a los grupos de alumnos y de profesores. Los usuarios con sa son los profesores. Dale a los alumnos el permiso create (y remove si pueden borrar).
Pega los tokens
Dale los dos tokens a Flow EE como FLOWEE_OP_REQTOKEN y FLOWEE_OP_RESTOKEN o, la primera vez, entra con la cuenta por defecto que enseña su página de acceso y pégalos en los ajustes. A partir de ahí los usuarios entran por OpenPlatform.
Opcional: activa la API pública de usuarios en OpenPlatform y pon su dirección en op_groups; hace falta para una copia para cada alumno. Con OpenPlatform en la nube pon su dirección en sso en config: el acceso se verifica allí y los grupos y el profesor salen de su sesión. Nadie puede suplantar grupos.
| Ajuste | Para qué sirve |
|---|---|
op_groups | Dirección de la API de usuarios de OpenPlatform (https://mi_openplatform/users/?token=[]). Necesaria para una copia por alumno; sin ella, una plantilla se copia una vez por grupo. |
sso | Dirección de un OpenPlatform en la nube para el acceso. |
flowstream_worker | fork (por defecto aquí): cada FlowStream en su proceso. |
flowstream_memory | Memoria máxima en MB de cada FlowStream (0 es automático). Recomendado en clase. |
activity_days | Días que se conserva el registro de actividad (365 por defecto, 0 para siempre). |
max_streams, idle_days | Valor por defecto de los límites para cada alumno (FlowStreams y días sin trabajar). El profesor puede cambiarlos en Classroom. |
$proxytimeout | Tiempo máximo del proxy de los FlowStreams, en segundos. |
Sin archivos que editar. Cada ajuste también funciona como variable de entorno: FLOWEE_ más la clave en mayúsculas (FLOWEE_SSO, FLOWEE_OP_GROUPS, FLOWEE_FLOWSTREAM_MEMORY…), y lo mismo para los dos tokens de la aplicación (FLOWEE_OP_REQTOKEN, FLOWEE_OP_RESTOKEN). El docker-compose.yaml ya los trae todos.
Todo lo que incluye
Un entorno de aula completo, listo para funcionar en tu propio servidor.
Roles y grupos
Profesor y alumnos, organizados en los grupos de OpenPlatform. Cada alumno trabaja solo en su espacio.
Plantillas de prácticas
Reparte un ejercicio a un grupo entero o da a cada alumno su propia copia, y restáuralo cuando lo necesites.
Resumen de la clase
Mira quién ha empezado, quién tiene errores y quién necesita ayuda, y abre el FlowStream de cualquier alumno para guiarle.
Registro de actividad
Mira qué hace cada alumno y cuándo, fíltralo y descárgalo. Se conserva solo el tiempo que elijas y puedes borrarlo.
Observar en directo
Sigue en directo el editor de cualquier alumno, en solo lectura, para ver cómo trabaja y ayudarle cuando se atasca.
Modo examen
Abre y cierra el acceso de un grupo por fechas. Durante el examen no sale nada: ni exportar ni copiar. Al terminar, el trabajo de cada alumno se entrega solo.
Entregas
Los alumnos entregan su trabajo con un clic. Recibes una copia congelada con su fecha, la abres como FlowStream y descargas un grupo entero para corregirlo.
Paleta de componentes
Elige los componentes que puede usar cada grupo y prohíbe los que acceden a archivos o al shell. Los alumnos no pueden editar ni añadir componentes, así que nadie los estropea ni los copia.
Límites para cada alumno
Decide cuántos FlowStreams puede tener cada alumno y pausa automáticamente lo que dejan de usar.
Trabajo protegido
Los alumnos no pueden importar FlowStreams ni leer el código de los componentes. Cada FlowStream se ejecuta en su propio proceso.
Fácil de desplegar
Una imagen Docker lista para amd64 y arm64, que se configura con variables de entorno: sin archivos que editar.
Tu servidor, tus datos
Todo se queda en tu propia infraestructura. Interfaz en español e inglés, y acceso con OpenPlatform en tu servidor o en la nube.
