Monibank

Página de cadastro completa do Monibank.

Formulário com validação de dados:

Captura de imagem:

Detalhes do projeto

Projeto para o cadastro de um usuário no Monibank. Iniciamos com alguns conceitos básicos de html limitando a quantidade de caracteres em um elemento input e transformar um campo em obrigatório.
Já iniciando no javascript começamos utilizando patterns e regex para selecionar elementos do html, construindo funções para cada elemento e detectando eventos do usuário.
Com isso importamos funções entre arquivos e veridicamos se o CPF com números repetidos.
Na parte de validações, validamos os dígitos verificadores do CPF, utilizando fórmulas matemáticas no código e também verificamos se o usuário é maior de 18 anos.
Para a verificação de possíveis erros nós encontramos as validações padrões que existem no JavaScript com o Validity State, interpretamos cada tipo de erro, fizmos uma mensagem customizada para cada um, tirando o comportamento padrão do html e inserindo essas mensagens.
Com os dados validados nós salvamos eles no localStorage para serem utilizados posteriormente.
Para a captura da foto para o cadastro nós iniciamos a câmera no navegador, capturamos a foto com um evento de click, aplicamos um fluxo de navegação escondendo e mostrando elementos e atualizamos o localStorage para conter a foto enviada pelo usuário.