Para desenvolver Aula Prática Desenvolvimento em Javascript, comece identificando os objetivos e as entregas solicitadas no roteiro. A seguir, veja os pontos presentes na descrição desta atividade e organize teu relatório de acordo com as orientações do curso.
O que é esta aula prática?
Antes de começar, leia a apresentação e identifique o tema, a unidade e o formato pedido.
Estrutura de repetição "for" em JavaScript e manipulação do DOM
Elementos e contexto 2D (desenho e animação)
Uso de requestAnimationFrame para loops de animação
Eventos HTML5 e transições/ animações em CSS
Configuração de ambiente Node.js, npm e Angular CLI
Criação de componentes e módulos em Angular
Nesta atividade, você irá criar uma página web que oferece uma experiência interativa
Inserir um campo para o usuário digitar um número.
Calcular a tabuada desse número utilizando JavaScript.
Utilizar um loop “for” para gerar as multiplicações de 1 a 10.
Exibir dinamicamente os resultados na página usando manipulação do DOM.
Testar a funcionalidade com diferentes números para verificar a precisão dos cálculos.
Revisar e refinar a implementação para garantir que todos os requisitos sejam atendidos.
Preparar a página e os arquivos necessários para submissão ou uso final.
Todos os código implementados em HTML, CSS e JavaScript.
Prints das telas do navegador executando a atividade.
Como desenvolver a atividade passo a passo
Execute cada etapa na ordem indicada e registre o que foi feito para depois explicar o processo no relatório.
Esta camada introdutória descreve as atividades práticas oferecidas na Aula Prática Desenvolvimento em Javascript, direcionadas ao estudo de estruturas de repetição, animação em canvas, programação orientada a eventos e introdução a frameworks. O conjunto de exercícios propõe implementar páginas web e pequenos projetos que integram HTML, CSS e JavaScript para resolver problemas concretos: gerar uma tabuada interativa, criar animações com o elemento , desenvolver um jogo "Jokenpô" controlado por eventos e montar um projeto básico em Angular.
As soluções digitais indicadas no roteiro incluem o uso do Google Colab como ambiente online para execução de código e, quando aplicável ao framework, o uso de Visual Studio Code para desenvolvimento local. Para comprovação das atividades, é exigida a entrega de um relatório em .docx ou .pdf contendo todos os códigos (HTML, CSS e JavaScript) e prints das telas do navegador demonstrando o funcionamento das implementações.
O que é desenvolvido nesta atividade
Os alunos irão praticar a construção de interfaces simples e a lógica necessária para torná-las interativas. Entre as tarefas centrais estão: implementar um gerador de tabuada que recebe um número entre 1 e 10 e usa um loop "for" para calcular e exibir multiplicações de 1 a 10 com manipulação dinâmica do DOM; criar uma animação básica em um elemento (desenhando objetos e atualizando propriedades no loop de animação com requestAnimationFrame); desenvolver a lógica de um jogo "Pedra, Papel, Tesoura" usando eventos HTML5 e animações CSS; e configurar um projeto Angular básico, incluindo instalação do Node.js/npm, uso do Angular CLI (ng new, ng generate) e execução local (npm start).
Como estruturar o relatório
Organize a entrega em identificação da atividade, objetivos, recursos utilizados, descrição dos procedimentos, registros dos resultados e conclusão. Ajuste essa sequência ao modelo exigido pela instituição e inclua apenas observações e evidências obtidas durante a tua própria execução.
Checklist antes de entregar
- Conferir se todos os objetivos do roteiro foram contemplados.
- Descrever os procedimentos na ordem em que foram realizados.
- Inserir registros, imagens ou arquivos quando a atividade solicitar.
- Relacionar os resultados com as tarefas e revisar o formato de entrega exigido.
