Criar formulários web (Tutorial)

Criar formulários da web para websites (tutorial prático)

Língua: alemão

Criar formulários da web para sites (tutorial prático)

Como criar formulários da web para seus sites - explicado passo a passo! Se você deseja solicitar nomes, endereços de e-mail, senhas, caixas de seleção, datas, listas ou menus suspensos: aprenda neste tutorial prático como ir do primeiro formulário HTML para um formulário da web totalmente funcional.

Criar formulários web - dos princípios básicos aos formulários funcionais
Campos para inserir e-mail, senha e outros dados corretamente criar e ler
Caixas de seleção, botões de rádio, menus suspensos, entradas de texto multilinhas e mais criar
Tutorial prático abrangente de seis horas do desenvolvedor Stephan Haewß
Com arquivos do projeto para recriar os conteúdos apresentados
Ideal para desenvolvedores web, designers web e desenvolvedores front-end

Desde a simples solicitação de nome e e-mail até o formulário de contato mais complexo com função de upload: aqui aprenderás abrangente a criar formulários web para os teus sites!

Zugriff auf alle Inhalte

In der Mitgliedschaft ab * € monatlich

oder

Inhalt in den Warenkorb

Sofort-Download nach Kauf: einmalig * €

pormenores

Conteúdo: 6 h Treinamento em vídeo
Licença: privada e comercial Direitos de utilização
Bônus: incluindo material de trabalho

Categorias

Webdesign, CMS & Desenvolvimento

Feito com amor por:

Stephan Haewß

Criar formulários web - Introdução

Gratuito

Criar formulários da web: 1.1 | Introdução e Visão Geral

Aqui você vai descobrir sobre o que se trata o curso e o que pode esperar.

Para o tutorial de texto

Criar formulários da web: 1.2 | Formulários HTML - porquê e como usar?

Criar formulários da web: 1.2 | Formulários HTML - por que e como usar?

Porque se deve usar formulários HTML e como isso geralmente é feito?

Para o tutorial de texto

Criar formulários da web: 1.3 | Criar primeiro projeto

Criar formulários web: 1.3 | Criar primeiro projeto

Aqui é onde o projeto será criado, no qual o primeiro formulário será integrado.

Para o tutorial de texto

Criar formulários web: 1.4 | O primeiro formulário HTML

Você cria o seu primeiro formulário simples e aprende a estrutura básica.

Para o tutorial de texto

Formulários

Criar formulários web: 2.1 | Por que usar formulários ou tags de formulário?

Nós destacamos as diversas possibilidades de uso de formulários HTML em aplicações web.

Baixar o arquivo do projeto

Criando formulários da web: 2.2 | Ler dados do formulário com JavaScript

Criar formulários web: 2.2 | Ler dados do formulário com JavaScript

Você está aprendendo a ler e processar os dados inseridos pelos usuários com JavaScript.

Criar formulários web: 2.3 | Melhoramento do formulário e outros tipos de entrada

Criar formulários web: 2.3 | Melhorias de formulário e outros tipos de entrada

Vou abordar as possibilidades de design de formulários e apresentar diferentes campos de entrada.

Validação de entrada e tratamento de eventos para formulários

Criar formulários web: 3.1 | Primeira validação com inserção de e-mail

Criar formulários web: 3.1 | Primeira validação com entrada de e-mail

Você está implementando uma validação de e-mail simples para garantir que os dados inseridos estejam no formato de e-mail.

Criar formulários web: 3.2 | Tipo de entrada número e Atributos

Nós lidamos com entradas numéricas e os atributos associados para restringir os valores possíveis.

Criar formulários web: 3.3 | Responder a alterações no elemento de entrada

Você aprenderá como lidar com eventos em JS que ocorrem ao alterar o conteúdo de um campo de entrada.

Criar formulários da web: 3.4 | Responder a alterações com addEventListener

Criar formulários web: 3.4 | Responder a alterações com addEventListener

Estamos a aprofundar o tema do tratamento de eventos e a usar addEventListener para respostas mais flexíveis.

Criar formulários web: 3.5 | Overview: O elemento de entrada

Criar formulários web: 3.5 | Visão geral: O elemento de entrada

Um resumo abrangente dos diferentes tipos de entrada e suas propriedades.

Criar formulários web: 3.6 | Atributos: readonly, disabled, placeholder, minlength, maxlength

Estamos a esclarecer os atributos mais importantes para controlar o comportamento dos campos de entrada.

Criar formulários web: 3.7 | Atributos: padrão e obrigatório

Você aprenderá como realizar validações complexas usando expressões regulares e o atributo required.

Criar formulários da web: 3.8 | O atributo de verificação ortográfica

Criar formulários web: 3.8 | O atributo de verificação ortográfica

Nós vamos te mostrar como ativar ou desativar a verificação ortográfica nos seus formulários.

Criar formulários web: 3.9 | Tipo de entrada senha

Criar formulários da web: 3.9 | Tipo de entrada password

Você aprenderá a criar campos de senha.

Checkboxen Caixas de seleção

Criar formulários da web: 4.1 | Checkbox - Conceitos básicos

Criar formulários web: 4.1 | Checkbox - Conceitos básicos

Começamos com os fundamentos das caixas de seleção e suas possíveis aplicações.

Criar formulários web: 4.2 | Usar caixa de seleção em JS

Criar formulários web: 4.2 | Utilizar caixa de seleção em JS

Você aprende a ler e definir o estado de checkboxes com JavaScript.

Criar formulários da web: 4.3 | Estilizar checkbox

Criar formulários web: 4.3 | Estilizar checkbox

Eu vou mostrar diferentes maneiras de personalizar a aparência das caixas de seleção.

Tipos de entrada de formulário e campos avançados

Criar formulários web: 5.1 | Botões de opção

Eu vou explicar o funcionamento dos botões de rádio e como você pode usá-los em seus formulários.

Criar formulários da web: 5.2 | Envio de arquivos

Criar formulários web: 5.2 | Upload de arquivos

Você aprende como permitir que os usuários façam upload de arquivos.

Criar formulários web: 5.3 | Entrada de arquivo com JS

Você aprofunda seus conhecimentos sobre o upload de arquivos e aprende a como editar o arquivo selecionado com JavaScript.

Criar formulários da web: 5.4 | Campos de entrada ocultos

Criando formulários web: 5.4 | Campos de entrada ocultos

Vou abordar o uso de campos de entrada ocultos para a transmissão de informações adicionais.

Criar formulários web: 5.5 | Inserção de números

Criar formulários web: 5.5 | Entradas de números

Resumimos as várias maneiras de inserir números.

Criar formulários web: 5,6 | Controle deslizante de intervalo

Criar formulários web: 5.6 | Range Slider

Você aprenderá a permitir que os usuários selecionem um intervalo específico de valores com os controles deslizantes de intervalo e implementem um slider.

Criar formulários web: 5.7 | Inserção de data e hora

Criar formulários web: 5.7 | Entrada de data e hora

Vou te mostrar como inserir datas e horários nos teus formulários.

Criar formulários web: 5.8 | E-Mail e URL

Estamos focados nos campos de entrada especiais para endereços de e-mail e URLs.

Criar formulários web: 5.9 | Cor

Você aprenderá como permitir que os usuários escolham cores através de um seletor de cores.

Criar formulários da web: 5.10 | Os tipos search e tel

Criar formulários web: 5.10 | Os tipos search e tel

Apresento-te os campos de entrada para palavras-chave e números de telefone.

Criar formulários web: 5.11 | Entradas de texto em várias linhas com textarea

Criando formulários web: 5.11 | Entradas de texto multilinhas com textarea

Você aprenderá como implementar entradas de texto multi-linhas com o elemento textarea.

Criar formulários web: 5.12 | Listas com seleção

Criar formulários web: 5.12 | Listas com select

Eu vou explicar como criar listas selecionáveis com o elemento select.

Estrutura avançada de formulário e validação com JavaScript e frameworks

Criar formulários da web: 6.1 | Agrupamento das opções

Criar formulários web: 6.1 | Agrupamento das opções

Você aprenderá como agrupar as opções em uma lista de seleção.

Criar formulários da web: 6.2 | Listas de sugestões com datalist

Criar formulários web: 6.2 | Listas de sugestões com datalist

Eu vou te mostrar como criar listas de sugestões para campos de entrada.

Criar formulários da web: 6.3 | O atributo de preenchimento automático

Criar formulários web: 6.3 | O atributo autocomplete

Você aprenderá como ativar a conclusão automática de entradas.

Criar formulários web: 6.4 | Seções do formulário com fieldsets

Criar formulários web: 6.4 | Secções do formulário com Fieldsets

Eu vou explicar como estruturar seus formulários com elementos de fieldset.

Criar Formulários Web: 6.5 | Validação com JavaScript

Criar formulários web: 6.5 | Validação via JavaScript

Uma introdução abrangente à validação de formulários do lado do cliente com JavaScript.

Criar formulários web: 6.6 | Tratamento do lado do servidor com Node.JS e Express

Criando formulários web: 6.6 | Tratamento no lado do servidor com Node.JS e Express

Eu vou mostrar como você pode receber os dados do formulário enviados para o servidor com Node.js e Express .

Baixar o arquivo do projeto

Criar formulários web: 6.7 | Receber dados do formulário com GET Handler

Criar formulários web: 6.7 | Receber dados do formulário com um manipulador GET

Você aprenderá como receber dados do formulário usando o método GET.

Criar formulários da web: 6.8 | Receber dados do formulário com POST Handler

Criar formulários web: 6.8 | Receber dados de formulário com POST Handler

Eu vou explicar como receber dados de formulário usando o método POST.

Criar formulários web: 6.9 | Criar formulários e elementos de formulário em React - Criar projeto

Começaremos a criar um projeto React e integrar formulários.

Baixar o arquivo do projeto

Criar formulários da web: 6.10 | Elementos de entrada em React

Criar Formulários Web: 6.10 | Elementos de Input in React

Tu aprenderás a utilizar diferentes elementos de input no React.

Criando formulários web: 6.11 | Elementos Select e Textarea no React

Estamos lidando com os elementos select e textarea no React.

Criar formulários web: 6.12 | Formulários com Alpine.js

Eu mostrarei como lidar com formulários usando o framework JavaScript Alpine.js.

Baixar o arquivo do projeto

Criar formulários web: 6.13 | Formulários com VueJs

Eu vou explicar como integrar formulários em aplicações Vue.js.

Baixar o arquivo do projeto

Detalhes sobre o conteúdo

Formulários web e seus campos de entrada - explicados passo a passo
Gostaria de expandir seus conhecimentos em desenvolvimento de formulários web? Neste tutorial, você aprenderá a criar formulários funcionais com HTML, JavaScript, scripts do lado do servidor e bibliotecas. Seja para consultas simples de nomes e e-mails ou para formulários de contato complexos - após este curso, você será capaz de programar seus próprios formulários web com os campos de entrada necessários e incorporá-los aos seus sites.
O tutorial em vídeo com mais de seis horas do desenvolvedor de software e tutor Stephan Haewß destina-se a todos que desejam criar formulários web, a desenvolvedores usando frameworks JS-UI para formulários e a desenvolvedores web que desejam capturar a entrada do usuário sem muito JavaScript. Ótimo para desenvolvedores web, designers web, desenvolvedores front-end, iniciantes e avançados - e facilmente compreensível para aqueles que já têm conhecimentos básicos de HTML.

Princípios básicos de HTML para formulários em seus sites

Se você ainda não possui conhecimento ou possui conhecimento limitado na área de formulários web, comece o tutorial com os conceitos básicos. Você aprenderá tudo sobre a estrutura e os diferentes elementos de um formulário HTML. Conheça diversos campos de entrada, como caixas de seleção, botões de rádio, upload de arquivos, campos de senha e texto, bem como seus atributos e possibilidades de validação. Aprenda a criar formulários amigáveis e acessíveis com diversos elementos de formulário.

Formulários web dinâmicos, processamento no lado do servidor e formulários em frameworks JavaScript modernos

A interação com elementos do formulário pode ser controlada de forma específica com JavaScript para criar uma experiência dinâmica e amigável ao usuário. Assim, as entradas podem ser lidas, editadas e automaticamente validadas quando necessário. A validação do lado do cliente pode interceptar dados incorretos ou incompletos diretamente do usuário antes de serem enviados para o servidor. Isso melhora a qualidade dos dados e reduz possíveis fontes de erro. Outro aspecto importante é a adaptação dinâmica dos formulários às entradas e interações dos usuários. Todos esses aspectos são abordados no vídeo tutorial.

Além disso, você aprenderá sobre o envio e recebimento de dados do formulário para o servidor e seu processamento no lado do servidor, usando Node.js e Express como exemplo. Você também verá o uso de formulários web em frameworks JavaScript modernos, como a integração de formulários em aplicações React e a criação de formulários reativos com React-Hooks e componentes. Obtenha dicas importantes sobre estilização de formulários e elementos de formulário, bem como sobre segurança de dados.

O que você aprenderá neste tutorial prático

Aproveite o curso para adquirir amplo conhecimento no desenvolvimento de formulários HTML. Conheça os diferentes campos de entrada e suas características. Saiba como controlar os elementos do formulário com JavaScript e como aplicar atributos e validações. Além disso, veja como integrar formulários em frameworks JavaScript modernos, como React, VueJs e AlpineJs.