Workshop e estações
TeachFORGE.ai
Workshop / HTML / CSS / JS
HTML / CSS / JS Station
Crie peças web ao vivo num espaço de criação multi-painel — com etapas de construção conjunta, variáveis paramétricas e exportação HTML autónoma quando precisa da página fora do TeachForge.
A IA pode rascunhar. Você decide o que a turma vê.
O que é HTML / CSS / JS
HTML / CSS / JS é uma Estação de criação web multi-painel. Escreve marcação, estilos e scripts lado a lado, faz a pré-visualização da página num iframe sandboxed e — quando precisa — exporta um ficheiro HTML autónomo que pode usar fora do TeachForge.
Isto é importante no ensino porque as habilidades web fazem sentido quando os alunos veem o resultado imediatamente. Mude um estilo, avance uma etapa de construção conjunta ou demonstre uma pequena página interativa — ao vivo, sem implantar nada.
Porque os professores usam HTML / CSS / JS
Demos web ao vivo
Mostre HTML, CSS e JavaScript a comportarem-se juntos em tempo real.
Lições de construção conjunta
Capture etapas e Apresente-as passo a passo para que a turma siga a construção.
Temas paramétricos
Controle cores e variáveis com controlos em vez de procurar cada valor CSS manualmente.
Material de apoio autónomo
Exporte um ficheiro HTML para uso além da Estação.
No TeachForge, HTML / CSS / JS é uma Estação do Workshop — construída para páginas de ensino, não apenas para fragmentos rápidos de código.
Dentro da Estação HTML / CSS / JS
Como o resto do Workshop, obtém um ritmo de criação familiar — com três painéis em vez de um.
- Editores HTML, CSS e JS com comutação rápida de painéis
- Atualização ao vivo ou Manual para uma pré-visualização em iframe sandboxed
- Estágios de construir junto — capturar, avançar e modo Apresentar
- Variáveis paramétricas para controlos reutilizáveis de tema e valores
- Molduras de pré-visualização de dispositivo e bibliotecas opcionais como KaTeX
- Exportação HTML autónoma, JSON Avançado, partilha, incorporação e envio para o Whiteboard
Como os painéis se tornam numa página
Comece de um modelo ou edite os três painéis
Adicione etapas e variáveis paramétricas quando a lição as precisar.
Execute a pré-visualização Ao Vivo ou Manual
O iframe sandboxed mostra a página como os alunos a encontrarão.
Apresente etapas, exporte ou envie ao vivo
Leve o resultado para o quadro, para uma pergunta ou para fora como HTML autónomo.
Uma página. Todas as versões dela.
Esta Estação suporta variáveis paramétricas e etapas de construção conjunta: mantenha a estrutura da página, varie o tema e revele a construção em ordem — em vez de manter doze ficheiros HTML ligeiramente diferentes.
Mude enquanto ensina
Ajuste valores paramétricos ou avance para a próxima etapa no modo Apresentar.
Mantenha a estrutura, varie o tema
O mesmo pacote de página pode mostrar uma cor de destaque, conjunto de dados ou dificuldade diferente amanhã.
Ensine a construção, não apenas o acabamento
As etapas permitem que a turma veja a página a formar-se.
Fique perto da avaliação
Guarde o pacote JSON portátil e reutilize-o em lições ou laboratórios posteriores.
Precisa de um fragmento rápido de Execução-e-consola? O Code Sandbox é a Estação irmã para isso. HTML / CSS / JS é para páginas criadas com etapas e exportação.
Páginas prontas para começar
Abra um modelo e adapte-o para a sua aula:
| Área | O que pode abrir |
|---|---|
| Fundamentos | Vazio; Cartão de Perfil; Campo de Jogo Flexbox |
| Construa junto | Etapas de Botão; Comutador de Tema de Cor |
| Interativo | Animação Canvas; Interface de Questionário; Tabela de Dados |
Ajuda de IA do seu jeito
Precisa de um primeiro rascunho? Use a IA como assistente — depois reveja, edite e aprove antes que algo chegue aos aprendentes.
Copiar o prompt
Gere um prompt pronto e cole na ferramenta de chat que você já usa.
Utilize o seu próprio GPU
Ligue um endpoint de modelo local nas definições e execute a geração no hardware que controla.
Utilize a sua própria chave de API
Adicione a chave do fornecedor nas definições, escolha o modelo e gere com a sua própria conta.
A IA pode estar errada. É exactamente por isso que um professor permanece no circuito.
Leve a página onde o ensino acontece
- Whiteboard — coloque-o no quadro ao vivo e ajuste na frente da turma
- Quest Ladder — coloque em perguntas e explicações
- Virtual Lab — reutilize em trabalho de laboratório interativo
- Comunidade — partilhe o que você construiu e construa sobre o que outros educadores partilharam