0% acharam este documento útil (0 voto)
13 visualizações

Relatorio JavaScript

O relatório descreve uma aula prática de Desenvolvimento em JavaScript, onde foi criado um formulário HTML para validação de e-mails utilizando a plataforma Playcode.io. O código implementado valida a entrada do usuário e fornece feedback sobre o formato correto do e-mail. A prática destacou a importância da validação de dados para melhorar a experiência do usuário.

Enviado por

jonasmarcelog
Direitos autorais
© © All Rights Reserved
Levamos muito a sério os direitos de conteúdo. Se você suspeita que este conteúdo é seu, reivindique-o aqui.
Formatos disponíveis
Baixe no formato DOCX, PDF, TXT ou leia on-line no Scribd
0% acharam este documento útil (0 voto)
13 visualizações

Relatorio JavaScript

O relatório descreve uma aula prática de Desenvolvimento em JavaScript, onde foi criado um formulário HTML para validação de e-mails utilizando a plataforma Playcode.io. O código implementado valida a entrada do usuário e fornece feedback sobre o formato correto do e-mail. A prática destacou a importância da validação de dados para melhorar a experiência do usuário.

Enviado por

jonasmarcelog
Direitos autorais
© © All Rights Reserved
Levamos muito a sério os direitos de conteúdo. Se você suspeita que este conteúdo é seu, reivindique-o aqui.
Formatos disponíveis
Baixe no formato DOCX, PDF, TXT ou leia on-line no Scribd
Você está na página 1/ 3

DESENVOLVIMENTO WEB

NOME: JONAS MARCELO GOMES


RA: 3548927805

PORTIFÓLIO – RELATÓRIO DE AULA PRÁTICA

DISCIPLINA: DESENVOLVIMENTO E JAVASCRIPT

Passo Fundo/RS
2025
Introdução

Nesta aula prática da disciplina de Desenvolvimento em JavaScript, foi proposto o desenvolvimento

de um formulário HTML com um campo para inserção de e-mail, utilizando a plataforma online

Playcode.io. A atividade teve como foco aplicar os conceitos de validação com JavaScript para

garantir que os dados fornecidos pelo usuário estejam no formato correto.

Métodos

- Criar um novo projeto (abrir o editor) no Playcode.io.

- Escolher um projeto vazio (empty).

- Colocar um código em HTML simples com JavaScript que fará a validação de campo para coleta

de e-mail.

- Mostrar mensagem de erro e de orientação explicando a estrutura correta de um e-mail (ex:

[email protected]).

- Testar o funcionamento do formulário diretamente na plataforma.

Código HTML + JavaScript


<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<title>Validação de E-mail</title>
<style>
body { font-family: Arial; padding:
20px; } .erro { color: red; }
.sucesso { color: green; }
</style>
</head>
<body>
<h2>Formulário de E-mail</h2>
<form id="formulario">
<label for="email">Digite o e-mail do colega:</label><br><br>
<input type="text" id="email" name="email"><br><br>
<input type="submit" value="Validar">
<p id="mensagem"></p>
</form>

<script>
document.getElementById("formulario").addEventListener("submit", function(e)
{ e.preventDefault();
const email = document.getElementById("email").value;
const mensagem = document.getElementById("mensagem");
const regex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;

if (!regex.test(email)) {
mensagem.textContent = "Por favor, insira um e-mail válido no formato
[email protected]";
mensagem.className =
"erro"; } else {
mensagem.textContent = "E-mail válido!";
mensagem.className = "sucesso";
} })
;
</script>
</body>
</html>

Resultados

Durante a execução da atividade no Playcode.io, foi criado com sucesso um formulário com campo

para inserção de e-mail. O JavaScript utilizado identificou corretamente entradas inválidas e

forneceu mensagens de feedback ao usuário, orientando sobre o preenchimento adequado do

campo de e-mail.

Conclusão

A prática proporcionou uma aplicação real dos conhecimentos sobre validação de formulários com

JavaScript. Com o apoio da ferramenta Playcode.io, foi possível implementar, testar e corrigir

rapidamente o código. A validação de dados é essencial para garantir que informações sejam

processadas corretamente, melhorando a experiência do usuário.

Você também pode gostar