Projeto Formulário de OTP com React

Criar um formulário OTP com boa experiência de usuário tem seus desafios. Vamos a eles!

Assistir agora

1. Introdução

Todos os nossos projetos são gratuitos, porém os tutoriais são exclusivos para membros do Codante PRO. Algumas aulas estão abertas para você experimentar.

Se gostar, considere assinar para ter acesso a todos os tutoriais e apoiar o projeto!

Seu Instrutor

Roberto Cestari

Codante.io

Fundador e Professor no Codante.io.

Foi Tech Lead de front-end e professor especialista em React.

Formado e Mestre pela USP e formado pela FGV - EAESP.

Fundador e desenvolvedor da plataforma Trilhante, uma das maiores empresas de educação jurídica do país.

Junte-se a outras 10 pessoas que estão fazendo esse mini projeto.

Projeto Formulário de OTP com React

Assistir agora

Seu Instrutor

Roberto Cestari

Aulas

Introdução

Requisitos do Projeto

Instalando Vite , React e Tailwind

Construindo o HTML

Estilizando a Página

Extraindo o Formulário para um componente à parte

maxLength e required nos inputs

Salvando os dados do input no estado

Validação: dígitos numéricos

Foco no primeiro dígito ao carregar a página

Mudar o foco para o próximo input após digitar

Mudar o foco quando apagar um input

Colando um código no input

Navegando nos inputs com as setas do teclado

Propriedades inputMode e autoComplete

Finalização

Junte-se a outras 10 pessoas que estão fazendo esse mini projeto.