Solucionado (ver solução)
Solucionado
(ver solução)
3
respostas

Como fazer seção de login

Boa noite devs,tudo tranquilo? Vim atras de sugestão de como fazer uma area de login pra um projeto,fiz ele usando as ferramentas que eu conheço(Não acho legal um monte de prompt e alert mas não sei usar outra forma rs)

Minha duvida é,eu quero fazer uns prompts(ou outra coisa) para que eu consiga fazer login apenas como os dados já armazenados nas variaveis login e senha,caso esteja errada enviar uma mensagem que também pode ser por prompt (ou outra forma)

Segue o código

<meta charset=UTF-8>

<script>  


function pulaLinha(){

    document.write("<br><br>")

}

function mostra(frase){

    document.write(frase)
    pulaLinha()
}


//Dados para o registro

alert("Bem vindo ao meu teste,antes de entrar faça o registro!")


var nomeCompleto =prompt("Insira seu nome completo!")
var email =prompt("Insira o seu Email")
var login =prompt("Insira seu login")
var senha =prompt("Insira sua senha")
var senha2 =prompt("Insira a confirmação da sua senha")

while(senha != senha2){

    alert("Suas senhas não coincidem,tente novamente!")
    senha = prompt("Insira sua senha")
    senha2 = prompt("Insira a confirmação da sua senha")
} 

if (senha  == senha2){

    alert("Parabéns,registro Concluido")
}

//Confirmação dos dados para o login

alert("Agora que você efetuou o cadastro,faço o seu login")


3 respostas
solução!

Fala Marcus, tudo certo?

Uma coisa para se ter em menter é que, caso você recarregue sua página as variáveis vão sumir. Então você precisará armazenar (persistir) os dados que quiser utilizar novamente em alguma validação ou algo do tipo.

Os dados de login e senha são armazenados em banco de dados. Então vc consegue fazer um post para o banco no cadastro e um get (ou até mesmo um post) para o banco no login. E ai entra a comunicação do frontend com o backend através do protocolo http.

Para iniciar no estudo você pode fazer uso do localStorage do seu navegador. Você faz o localStorage.setItem para salvar e o localStorage.getItem para recuperar e comparar as credenciais.

Eu fiz um código de cadastro e login utilizando inputs e o localStorage para persistir os dados.

Como ficou um pouco grande para te enviar aqui, subi o codigo para meu github.

Você pode acessar neste link: https://github.com/eraldosiniciof/forum-alura/tree/master/duvida17

Segue alguns prints:

imagem da pagina de cadastroImagem da pagina de login

Noss,deve ter dado um trabalhão Obrigado mano,salvei aqui e vou dar uma olhada,vou tentar extrair algumas coisas pra aplicar no meu projetinho...tmj!!

Boa Marcus!

Tmj! Precisando é só falar.. se eu puder ajudar estarei por aqui.

Abs.