Rullst AcademyRullst Academy/Lição
PTENES
JavaScript e interação · Lição 01 / 14
Meus arquivos e GitHubManual do aluno

O primeiro sinal de vida

Sua página já tem estrutura e estilo. Agora ela pode responder a uma ação e mostrar uma mudança.

Trilhas de aprendizado12 min

Vamos descobrir juntos

  1. 1

    HTML estrutura, CSS apresenta e JavaScript descreve comportamento. JavaScript não é Java. O navegador já inclui um motor de JavaScript; não precisamos instalar Node, pacotes ou um framework para começar.

  2. 2

    Baixe o ZIP da atividade, extraia e abra index.html. O HTML carrega lesson.js com defer: esse script clássico externo espera o documento ser analisado antes de executar. Mantenha os arquivos juntos.

  3. 3

    Edite lesson.js como texto simples em UTF-8, salve e recarregue a página. Use Mostrar extensões no Windows; evite lesson.js.txt e texto rico no macOS. O mesmo projeto abre no Ubuntu. O painel Console das ferramentas do navegador ajuda a ler erros.

  4. 4

    A oficina da Rullst Academy executa o projeto preparado, com dados temporários e sugestões simuladas. Ela não executa as edições do seu editor. Para observar seu próprio JavaScript, baixe o arquivo editado, substitua lesson.js no kit e abra index.html.

Do exemplo à sua própria interação

Baixe o kit desta atividade, extraia e abra index.html no navegador. Edite lesson.js, salve e recarregue. Você não precisa instalar Node ou pacotes. O README explica HTTP local quando necessário.

A demonstração usa JavaScript preparado. Ela não executa seu código do editor. Baixe sua edição separadamente para testar no kit local.

Meus arquivos e GitHub
Experimentar o projeto que vamos construir

Planejador de pequenas missões

Crie, conclua e revise um plano de estudo com dados fictícios. As missões ficam apenas na memória desta página; ao recarregar, elas somem.

Use um título curto sem dados pessoais e minutos inteiros de 1 a 120. Até 20 missões.

Missões no plano
0
Minutos de todas as missões
0
Missões concluídas
0

Nenhuma missão neste filtro. Adicione uma ou escolha outro filtro.

    Laboratório de sugestões

    Por padrão, os cenários são simulados neste navegador. Nenhuma requisição de sugestões é enviada e seu plano não é substituído.

    Disponível no kit aberto por http://127.0.0.1:8768. Consulte o README; não precisa de uma conta externa.

      Esse JSON contém apenas as missões, não seu código. A demonstração não importa arquivos nem sincroniza aparelhos. O download do JavaScript editado fica no espaço de arquivos da lição.

      Links oficiais e próximo passo

      ✦
      SUA MISSÃO

      Abrir um projeto local, executar JavaScript e distinguir o código da demonstração.

      Agora é a sua vez

      Oficina de descobertas

      Pensar antes de executar

      console.log(2 + 3); é executado uma vez. O HTML usa <script src="lesson.js" defer></script>.
      Monte suas respostas e confira quando estiver pronto.
      Uma pausa para entender

      Editar o arquivo na Rullst Academy muda a demonstração automaticamente?

      Preciso de uma pista

      Preveja o resultado, execute no seu arquivo e explique a diferença.

      Carregando sua jornada…

      Leve com você

      Troque a mensagem do exemplo, salve e registre a saída antes e depois. Guarde uma cópia do arquivo editado.

      No seu ritmo

      Meus arquivos e GitHub

      Toda lição pode virar um registro seu: código, anotações ou um plano de prática. Guardar um arquivo no GitHub é opcional e não altera seu XP.

      Manual do aluno

      O editor e os downloads abrem quando esta lição estiver liberada para sua conta. Confira o acesso abaixo ou volte ao mapa da trilha.

      Conferindo seu acesso à lição…

      Seu caminho, passo a passo
      Trilhas de aprendizado

      Rullstpetbot

      A IA pode errar. Confira no material da lição.