## Tarefa
Você está desenvolvendo um formulário onde os usuários podem enviar seus dados. O objetivo é validar a entrada do usuário, fornecer feedback em tempo real enquanto ele digita e impedir o envio do formulário se a entrada for inválida.
1. **Feedback em Tempo Real da Entrada**:
   - Ouvir as alterações enquanto o usuário digita;
   - Dentro do manipulador de eventos, verificar o comprimento do valor do campo de entrada;
   - Se for menor que 3 caracteres, definir o conteúdo do `<p>` com o ID `feedback` para `"Name is too short."`;
   - Se for 3 caracteres ou mais, definir `feedback` para `"Name looks good!"`.
2. **Impedir o Envio Padrão do Formulário**:
   - Ouvir os envios do formulário;
   - Impedir o comportamento padrão de envio do formulário;
   - Verificar o valor do campo de entrada;
   - Se for menor que 3 caracteres, exibir `"Please enter a longer name"` no `<p>` com o ID `form-message`;
   - Se for 3 caracteres ou mais, exibir `"Form submitted successfully!"` em `form-message`.

PCFET0NUWVBFIGh0bWw+CjxodG1sPgogIDxoZWFkPgogICAgPGxpbmsgcmVsPSJzdHlsZXNoZWV0IiBocmVmPSJpbmRleC5jc3MiIC8+CiAgPC9oZWFkPgogIDxib2R5PgogICAgPGgxPlNpZ24gVXAgRm9ybTwvaDE+CiAgICA8Zm9ybSBpZD0idXNlci1mb3JtIj4KICAgICAgPGxhYmVsIGZvcj0ibmFtZS1pbnB1dCI+TmFtZTo8L2xhYmVsPgogICAgICA8aW5wdXQgdHlwZT0idGV4dCIgaWQ9Im5hbWUtaW5wdXQiIHBsYWNlaG9sZGVyPSJFbnRlciB5b3VyIG5hbWUiIC8+CiAgICAgIDxidXR0b24gaWQ9InN1Ym1pdC1idG4iIHR5cGU9InN1Ym1pdCI+U3VibWl0PC9idXR0b24+CiAgICAgIDxwIGlkPSJmZWVkYmFjayI+PC9wPgogICAgICA8cCBpZD0iZm9ybS1tZXNzYWdlIj48L3A+CiAgICA8L2Zvcm0+CiAgICA8c2NyaXB0IHNyYz0iaW5kZXguanMiPjwvc2NyaXB0PgogIDwvYm9keT4KPC9odG1sPg==

Ym9keSB7CiAgZm9udC1mYW1pbHk6ICdIZWx2ZXRpY2EgTmV1ZScsIEFyaWFsLCBzYW5zLXNlcmlmOwogIGJhY2tncm91bmQtY29sb3I6ICNmM2Y0ZjY7CiAgZGlzcGxheTogZmxleDsKICBmbGV4LWRpcmVjdGlvbjogY29sdW1uOwogIGFsaWduLWl0ZW1zOiBjZW50ZXI7CiAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7CiAgbWFyZ2luOiAwOwogIGNvbG9yOiAjMWYyOTM3Owp9CgpoMSB7CiAgZm9udC1zaXplOiAxLjVyZW07CiAgY29sb3I6ICMzYjgyZjY7CiAgbWFyZ2luLWJvdHRvbTogMjVweDsKfQoKZm9ybSB7CiAgYmFja2dyb3VuZC1jb2xvcjogI2ZmZmZmZjsKICBwYWRkaW5nOiAyNXB4IDMwcHg7CiAgd2lkdGg6IDQwMHB4OwogIGJvcmRlci1yYWRpdXM6IDEycHg7CiAgYm94LXNoYWRvdzogMCAxMHB4IDI1cHggcmdiYSgwLCAwLCAwLCAwLjEpOwogIGRpc3BsYXk6IGZsZXg7CiAgZmxleC1kaXJlY3Rpb246IGNvbHVtbjsKICBnYXA6IDE1cHg7Cn0KCmxhYmVsIHsKICBmb250LXNpemU6IDFyZW07CiAgY29sb3I6ICM0YjU1NjM7CiAgbWFyZ2luLWJvdHRvbTogNXB4Owp9CgppbnB1dFt0eXBlPSd0ZXh0J10gewogIHBhZGRpbmc6IDEycHg7CiAgZm9udC1zaXplOiAxcmVtOwogIGJvcmRlcjogMXB4IHNvbGlkICNkMWQ1ZGI7CiAgYm9yZGVyLXJhZGl1czogNnB4OwogIHRyYW5zaXRpb246IGFsbCAwLjNzIGVhc2U7Cn0KCmlucHV0W3R5cGU9J3RleHQnXTpmb2N1cyB7CiAgYm9yZGVyLWNvbG9yOiAjM2I4MmY2OwogIG91dGxpbmU6IG5vbmU7CiAgYm94LXNoYWRvdzogMCAwIDhweCByZ2JhKDU5LCAxMzAsIDI0NiwgMC4zKTsKfQoKYnV0dG9uIHsKICBwYWRkaW5nOiAxMnB4OwogIGZvbnQtc2l6ZTogMXJlbTsKICBjb2xvcjogI2ZmZmZmZjsKICBiYWNrZ3JvdW5kLWNvbG9yOiAjMTBiOTgxOwogIGJvcmRlcjogbm9uZTsKICBib3JkZXItcmFkaXVzOiA2cHg7CiAgY3Vyc29yOiBwb2ludGVyOwogIHRyYW5zaXRpb246IGJhY2tncm91bmQtY29sb3IgMC4zcyBlYXNlLCB0cmFuc2Zvcm0gMC4ycyBlYXNlOwp9CgpidXR0b246aG92ZXIgewogIGJhY2tncm91bmQtY29sb3I6ICMwNTk2Njk7CiAgdHJhbnNmb3JtOiB0cmFuc2xhdGVZKC0ycHgpOwp9CgpidXR0b246YWN0aXZlIHsKICB0cmFuc2Zvcm06IHRyYW5zbGF0ZVkoMCk7Cn0KCiNmZWVkYmFjayB7CiAgZm9udC1zaXplOiAwLjlyZW07CiAgY29sb3I6ICNmNTllMGI7CiAgZm9udC13ZWlnaHQ6IDYwMDsKfQoKI2Zvcm0tbWVzc2FnZSB7CiAgZm9udC1zaXplOiAxcmVtOwogIGZvbnQtd2VpZ2h0OiA3MDA7CiAgbWFyZ2luLXRvcDogNnB4Owp9CgojZm9ybS1tZXNzYWdlLnN1Y2Nlc3MgewogIGNvbG9yOiAjMTBiOTgxOwp9CgojZm9ybS1tZXNzYWdlLmVycm9yIHsKICBjb2xvcjogI2VmNDQ0NDsKfQ==

Ly8gUmVhbC10aW1lIGlucHV0IGZlZWRiYWNrCmNvbnN0IG5hbWVJbnB1dCA9IGRvY3VtZW50LmdldEVsZW1lbnRCeUlkKCduYW1lLWlucHV0Jyk7CmNvbnN0IGZlZWRiYWNrID0gZG9jdW1lbnQuZ2V0RWxlbWVudEJ5SWQoJ2ZlZWRiYWNrJyk7CgpuYW1lSW5wdXQuYWRkRXZlbnRMaXN0ZW5lcihfX19fXywgZnVuY3Rpb24gKGV2ZW50KSB7CiAgaWYgKF9fX19fKSB7CiAgICBmZWVkYmFjay50ZXh0Q29udGVudCA9IF9fX19fOwogIH0gZWxzZSB7CiAgICBmZWVkYmFjay50ZXh0Q29udGVudCA9IF9fX19fOwogIH0KfSk7CgovLyBQcmV2ZW50IGRlZmF1bHQgZm9ybSBzdWJtaXNzaW9uIGFuZCB2YWxpZGF0ZSBpbnB1dApjb25zdCB1c2VyRm9ybSA9IGRvY3VtZW50LmdldEVsZW1lbnRCeUlkKCd1c2VyLWZvcm0nKTsKY29uc3QgZm9ybU1lc3NhZ2UgPSBkb2N1bWVudC5nZXRFbGVtZW50QnlJZCgnZm9ybS1tZXNzYWdlJyk7Cgp1c2VyRm9ybS5hZGRFdmVudExpc3RlbmVyKF9fX19fLCBmdW5jdGlvbiAoZXZlbnQpIHsKICBldmVudC5wcmV2ZW50RGVmYXVsdCgpOwoKICBpZiAobmFtZUlucHV0LnZhbHVlLmxlbmd0aCA8IDMpIHsKICAgIGZvcm1NZXNzYWdlLnRleHRDb250ZW50ID0gX19fX187CiAgfSBlbHNlIHsKICAgIGZvcm1NZXNzYWdlLnRleHRDb250ZW50ID0gX19fX187CiAgICBuYW1lSW5wdXQudmFsdWUgPSAnJzsKICAgIGZlZWRiYWNrLnRleHRDb250ZW50ID0gJyc7CiAgfQp9KTs=

- Utilizar o evento `input` para ouvir alterações enquanto o usuário digita;
- Utilizar `event.target.value.length < 3` para verificar o comprimento do valor do campo de entrada;
- Utilizar o evento `submit` para ouvir os envios do formulário;
- Utilizar `event.preventDefault()` para impedir o comportamento padrão de envio do formulário;
- Utilizar `nameInput.value.length < 3` para verificar o valor do campo de entrada.

Ly8gUmVhbC10aW1lIGlucHV0IGZlZWRiYWNrCmNvbnN0IG5hbWVJbnB1dCA9IGRvY3VtZW50LmdldEVsZW1lbnRCeUlkKCduYW1lLWlucHV0Jyk7CmNvbnN0IGZlZWRiYWNrID0gZG9jdW1lbnQuZ2V0RWxlbWVudEJ5SWQoJ2ZlZWRiYWNrJyk7CgpuYW1lSW5wdXQuYWRkRXZlbnRMaXN0ZW5lcignaW5wdXQnLCBmdW5jdGlvbiAoZXZlbnQpIHsKICBpZiAoZXZlbnQudGFyZ2V0LnZhbHVlLmxlbmd0aCA8IDMpIHsKICAgIGZlZWRiYWNrLnRleHRDb250ZW50ID0gJ05hbWUgaXMgdG9vIHNob3J0Lic7CiAgfSBlbHNlIHsKICAgIGZlZWRiYWNrLnRleHRDb250ZW50ID0gJ05hbWUgbG9va3MgZ29vZCEnOwogIH0KfSk7CgovLyBQcmV2ZW50IGRlZmF1bHQgZm9ybSBzdWJtaXNzaW9uIGFuZCB2YWxpZGF0ZSBpbnB1dApjb25zdCB1c2VyRm9ybSA9IGRvY3VtZW50LmdldEVsZW1lbnRCeUlkKCd1c2VyLWZvcm0nKTsKY29uc3QgZm9ybU1lc3NhZ2UgPSBkb2N1bWVudC5nZXRFbGVtZW50QnlJZCgnZm9ybS1tZXNzYWdlJyk7Cgp1c2VyRm9ybS5hZGRFdmVudExpc3RlbmVyKCdzdWJtaXQnLCBmdW5jdGlvbiAoZXZlbnQpIHsKICBldmVudC5wcmV2ZW50RGVmYXVsdCgpOwoKICBpZiAobmFtZUlucHV0LnZhbHVlLmxlbmd0aCA8IDMpIHsKICAgIGZvcm1NZXNzYWdlLnRleHRDb250ZW50ID0gJ1BsZWFzZSBlbnRlciBhIGxvbmdlciBuYW1lJzsKICB9IGVsc2UgewogICAgZm9ybU1lc3NhZ2UudGV4dENvbnRlbnQgPSAnRm9ybSBzdWJtaXR0ZWQgc3VjY2Vzc2Z1bGx5ISc7CiAgICBuYW1lSW5wdXQudmFsdWUgPSAnJzsKICAgIGZlZWRiYWNrLnRleHRDb250ZW50ID0gJyc7CiAgfQp9KTs=

Domine conceitos essenciais de JavaScript, incluindo classes, manipulação do DOM, tratamento de eventos e programação assíncrona. Aprenda a criar aplicações web dinâmicas e interativas gerenciando interações do usuário, buscando e exibindo dados, e lidando com operações assíncronas de forma eficiente. Por meio de uma combinação de teoria, desafios práticos e exemplos do mundo real, este curso fornece as habilidades práticas necessárias para o desenvolvimento web moderno.

Aprenda os fundamentos das classes em JavaScript, desde declarações de classes até a definição de métodos que ampliam a funcionalidade. Descubra como utilizar objetos de parâmetros de forma eficaz, gerenciar propriedades privadas e controlar o acesso com getters e setters. Domine propriedades e métodos estáticos e aproveite o poder da herança de classes utilizando "extends" e "super()" para construir código escalável e reutilizável.

Domine a manipulação do DOM para criar aplicações web dinâmicas e interativas. Navegue e modifique a estrutura do DOM, atualize conteúdos dinamicamente e implemente as melhores práticas de segurança e desempenho. Diferencie propriedades e atributos para otimizar seu código.

Desbloqueie a interatividade de suas aplicações web dominando os eventos em JavaScript. Compreenda a propagação de eventos, controle o comportamento dos eventos e implemente uma manipulação eficiente para as interações do usuário. Otimize o desempenho com técnicas avançadas como delegação de eventos.

Aprofunde-se em JavaScript assíncrono, incluindo callbacks, Promises e async/await. Aprenda a buscar dados de APIs, integrar bibliotecas de terceiros e gerenciar múltiplas requisições de forma eficiente, desenvolvendo habilidades para criar aplicações orientadas a dados.

Desafio: Implementar Ouvintes de Eventos

Tarefa

Awesome!

Desafio: Implementar Ouvintes de Eventos

Tarefa