Como criar e validar uma tela de login com HTML + Javascript (Iniciante)

Поділитися
Вставка
  • Опубліковано 27 лис 2024

КОМЕНТАРІ •

  • @iagozdkbr1
    @iagozdkbr1 7 місяців тому +21

    O homem é bom, resumiu em 10minutos, o que pessoas vendem em curso de 1hora e a pessoa que compra acaba nem aprendendo! parabéns.

    • @Gemeltec
      @Gemeltec  7 місяців тому

      Obrigado, fico feliz que gostou!!

  • @devisaque
    @devisaque 8 місяців тому +6

    Estou assistindo em 2024, sinceramente que didatico incrivel, video sem muita enrolação direto e reto. Parabéns!!

    • @Gemeltec
      @Gemeltec  8 місяців тому

      Muito obrigado!!!!

  • @edgarvenancioxavier
    @edgarvenancioxavier 7 місяців тому +1

    Estou a meses procurando um vídeo assim, tão simples e elucidativo ao mesmo tempo, muito obrigado professor.

  • @marlitos6036
    @marlitos6036 2 роки тому +21

    sinceramente é um senhor tutorial, por mais tutoriais assim!

  • @ManáLocação
    @ManáLocação 5 місяців тому +1

    Parabéns, sabe explicar os detalhes, estava procurando um canal que ensinasse assim, o único sem complicações, direto ao ponto, e ainda explicando o que cada função faz. resumiu o que os videos de 50min nao explicavam direito

  • @ronaldodev8080
    @ronaldodev8080 2 роки тому +5

    cara sua didática para isso video foi muito bom, para quem ta começando é otimo, eu ja to estudando a quase 2 meses, só fiz projetos com html+css e o javascripts bem basico, to querendo evoluir cada vez mais então quando da errado, troco de video e tento com outro uma hora vai ahahah.

  • @andersonrfpe
    @andersonrfpe Рік тому +4

    Didática perfeita, sem enrolação, simples e rápido. Parabéns !!

  • @KelMicaelson
    @KelMicaelson 15 днів тому

    Vídeo curto, simples e direto, perfeito.

  • @derciosaints
    @derciosaints 11 місяців тому +1

    Muito bom. Para quem está iniciando no estudo do JS, ótimo vídeo. Obrigadão! 😉

  • @yuripablo155
    @yuripablo155 Рік тому +6

    Muito simples e fácil de entender. Gostei, faça mais vídeos como esse! 👏👏

  • @lucianomartins6707
    @lucianomartins6707 2 роки тому +2

    Tem umas pessoas que tem dom de ensinar.....Parabéns bem simplificado muito 👍

  • @lolipopy3445
    @lolipopy3445 2 роки тому +2

    Mano esse vídeo é incrivel
    Eu só queria um video simples pra entender a estrutura e não esses vídeos de 1h mostrando cada pixel e tag do site
    valeu muito eu te amo

    • @Gemeltec
      @Gemeltec  2 роки тому +1

      Muito obrigado pelo comentário, fico muito feliz que o vídeo te ajudou!!

  • @murilofagner6577
    @murilofagner6577 2 роки тому +4

    Mas a aula foi show de bola mesmo, adorei

  • @lurosa1444
    @lurosa1444 2 роки тому +6

    Muito bom,essa foi a validação mais simples , era o que eu estava precisando, obrigada

  • @vanessafreitasleite8304
    @vanessafreitasleite8304 Рік тому

    Poxa.. simples e objetivo. Assisti vários vídeos indicados para iniciantes, mas não entendi nada!

  • @Felipe-om4uy
    @Felipe-om4uy 2 роки тому +1

    Ae bonitão esse vídeo foi pika lek, ensina dms slk. Vamo sair desse hiato de 6 meses mano, posta vídeo pra eu ver mermão. slk sensacional!

  • @ideiascomtairan
    @ideiascomtairan 2 роки тому +2

    Victor muito obrigado. Sem enrolação direto ao ponto. Foi excelente.

  • @lucasdasilvalima6385
    @lucasdasilvalima6385 28 днів тому

    Parabéns ganhou um seguidor, simples e efetivo ótima aula.

  • @denilsonsalvatore6386
    @denilsonsalvatore6386 2 роки тому +2

    excelente, serviu para fixar diversos conceitos. claro, objetivo e didático. parabéns.

  • @ghiltonrocha9068
    @ghiltonrocha9068 2 роки тому +1

    obg irmão, sou iniciante em programação e me ajudou muito com uma tarefa que estava realizando.

  • @lucas-cm8bv
    @lucas-cm8bv Рік тому +2

    Manoooo, vc é foda eu tava a dias procurando isso no YT, valeu mesmo.

  • @hallow1991
    @hallow1991 7 місяців тому

    Mto bom amigo. tava tentando entender isso mas ngm ensinava tão bem assim. agora entendi kkk

  • @Carlos-sw9hz
    @Carlos-sw9hz 2 роки тому

    Muito bom estava procurando algo simples, estava me batendo com express e mongoose para algo que nao precisa de tanta complexidade.

  • @kukabeludo8393
    @kukabeludo8393 2 роки тому

    muito obrigado a unica coisa que estava faltando no meu codigo era o .value mas vendo o seu video percebi o meu erro e corrigi

  • @ustema100
    @ustema100 Рік тому

    sendo direto e explicando cada ação . muito bom!

  • @yuriz4425
    @yuriz4425 2 роки тому

    gostei do video, ajudou com o problema que eu estava tendo no meu código tinha esquecido o ".value"

  • @Luiza9962
    @Luiza9962 2 роки тому +5

    Muito bom !! Único vídeo que eu realmente consegui entender , muito obrigada

  • @pauli1163
    @pauli1163 2 роки тому +1

    Olá! Obrigada por disponibilizar esse conteúdo! No meu caso fiz o javascript um pouquinho diferente, porque estava com um problema na hora de digitar (como sou inciante não entendi o porque...rsrs).
    Mas fiz como segue abaixo e funcionou também. Deixo para quem interessar:
    NO JAVASCRIPT:
    let email = document.getElementById ("email");
    let senha = document.getElementById ("senha");
    function logar (){

    let emailDigitado = email.value;
    let senhaDigitada = senha.value;
    if (emailDigitado == "email@email.com" && senhaDigitada == "123") {
    alert ("Você conseguiu!");
    location.href= "index.html";
    }else {
    alert("Usuário ou senha incorretos!")
    }

    }
    NO HTML:

    Email:

    Senha:




    Saudações!

    • @Gemeltec
      @Gemeltec  2 роки тому +1

      Olá, agradeço pelo comentário.
      o .value é um comando do javascript vanilla que vem de versões anteriores então pode ser que o autocomplete do vscode não apresente essa opção e sim uma mais nova no lugar, mas você pode digitar diretamente pois ainda é funcional e consegue ser interpretado pelo navegador.

    • @pauli1163
      @pauli1163 2 роки тому

      @@Gemeltec ahh! Aprendi mais uma ! 😊

  • @razzorman
    @razzorman Рік тому +2

    Parabéns pela aula direta ao ponto e muito didática, meu caro! Continue assim!

  • @willianlima3487
    @willianlima3487 3 місяці тому

    cara, gostei do seu ensinamento, era o que eu estava procurando a mó cota kkkkk

  • @eduardomatheussilvadasneve6980

    Muito bom. simples e fácil o entendimento, parabéns DEV!!

  • @marciotavaresdasilvatavare3176

    caraca!..... A melhor aula ate agora parabéns, ganhou mais um escrito.

  • @nerdx9
    @nerdx9 Рік тому

    brabissimo meu mano, to começando a estudar JS agora e me ajudou muito obrigado

  • @willianalexandre2996
    @willianalexandre2996 10 місяців тому

    Simples e rápido, bela aula.

  • @vitorvitor7196
    @vitorvitor7196 2 роки тому

    Me ajudou muito!! Volta a fazer vídeos que vai ajudar ainda mais pessoas

  • @danielsebbengiongo2595
    @danielsebbengiongo2595 Рік тому

    Parabéns! Aula didática e resumida...

  • @rubensjr.8737
    @rubensjr.8737 Рік тому

    Parabens Victor que top. extremamente objetivo e sem purpurina, topp

  • @henriques.sobral9392
    @henriques.sobral9392 8 місяців тому

    Simples e claro ! Parabéns pelo conteúdo.

  • @DyogoDuarte
    @DyogoDuarte Рік тому

    Parabéns, excelente vídeo, bem rápido e prático! show de bola

  • @lammad
    @lammad 2 роки тому

    Mano, era o que eu tava precisando pra criar um joguinho aqui. Vlw meu parceiro.

  • @NicolasFreitasEditor
    @NicolasFreitasEditor Рік тому +3

    Certo! disso eu já compreendi legal no HTML,CSS e JS. Porem contudo entretanto todavia, como eu salvo essas informações desses inputs em um Json eu imagino ou até mesmo uma planilha, e mantenho este login com informações
    Tipo Nome, Sobrenome, Ano, Data de nascimento... e variadas informações que eu possa estar usando no meu site?

  • @samoaraguimaraes5392
    @samoaraguimaraes5392 Рік тому +2

    Muito bom, amei rápido e prático sem enrolação ! Poderia ensinar a fazer um site do zero ?

    • @Gemeltec
      @Gemeltec  Рік тому

      Olá, obrigado pelo comentário que bom que gostou.
      Vou bolar algo referente a criar um site do zero de forma prática!!

  • @canalmanuefabricio6537
    @canalmanuefabricio6537 8 місяців тому

    MANO FALAR PRA VC!!!! ESSE VIDEO E MUITO BOM!!!! PARABENS ME INSCREVI AQUI

    • @Gemeltec
      @Gemeltec  8 місяців тому

      Muito obrigado, feliz em ter ajudado!

  • @ensinandoparaaprender6553
    @ensinandoparaaprender6553 Рік тому

    Você é foda, obrigado!!!!!!!!!!!!!! estava travado em um pequeno detalhe, e tu me ajudouu!! valeuuuuuuuuuu

  • @benilson7267
    @benilson7267 Рік тому

    Otimo video, eu tava procurando uma videibem esclarecido como esse faz tempo.

  • @abramoabacarmussa1420
    @abramoabacarmussa1420 2 роки тому

    cara bom trabalho voce resolveu o meu problema da faculdadeç se stivesse perto daria um valor monetarioç mas em fimç Deus esta do seu ladoş forca meuş

    • @Gemeltec
      @Gemeltec  2 роки тому +1

      Opa fico muito feliz que tenha te ajudado, até me motiva a continuar

    • @abramoabacarmussa1420
      @abramoabacarmussa1420 2 роки тому

      @@GemeltecProf, nem sei criar um menu dentro da pagina home um menu horizontal dentro de pagina home contendo os seguintes (HOME, PORTOFOLIO, CONTACT, E LOGIN. )
      cara se tiver um vidio que esplica tudo isso agradeceria bastante. boa noite. aqui ja é noite.

  • @eliseusilva4077
    @eliseusilva4077 7 місяців тому

    Meu Deus, curti e já me inscrevi! Muito monstro!

  • @h.carvalho7503
    @h.carvalho7503 Рік тому

    Cara, obrigado. Clareou as ideias aqui.

  • @rodrigogabriel8092
    @rodrigogabriel8092 Рік тому

    Aula bem rápida e eficaz. Gostei muito! Mais um sub

  • @liebeyen
    @liebeyen 2 роки тому +2

    Cara, mt bacana pq vc explica tudo passo a passo de forma bem simples! Seria legal tb ensinar a fazer um logoff para esse login ;)

    • @Gemeltec
      @Gemeltec  2 роки тому +1

      Fico feliz que gostou amigo e muito obrigado pela sugestão, em breve terá mais videos dísponiveis no canal

  • @MundodasGuitarras
    @MundodasGuitarras Рік тому

    Muito bom, isso vai me ajudar bastante, vc poderia fazer um vídeo ensinando a "armazenar" um cadastro em algum DB, ou algum localstorage ou sessionstorage ou algo do tipo?

  • @mateusbruno11
    @mateusbruno11 2 роки тому

    Caraca Victor nem sabia que vc estava nessa também! Sucesso irmão 🙏😁

  • @dinizjunior349
    @dinizjunior349 2 роки тому

    Muito bom, muito mesmo!
    Me ajudou bastante no meu projeto escolar!

  • @johny17111
    @johny17111 8 місяців тому +2

    Que massa! Agora, professor, como faço para cadastrar novos usuários que queiram entrar no meu site com tudo zerado?

    • @Gemeltec
      @Gemeltec  8 місяців тому +2

      Olá amigo, pra isso precisariamos utilizar uma tecnologia backend para cadastrar e ler informações do banco de dados.
      Vou postar novas aulas ensinando a fazer isto com PHP e banco de dados Mysql!

    • @johny17111
      @johny17111 8 місяців тому

      @@Gemeltec boaaaa, perfeito mestre. Gosto muito de seus vídeos. Vai ser excelente

  • @luizfernandoassisdesousa392
    @luizfernandoassisdesousa392 2 роки тому

    Nossa que vídeo bom, a melhor aula

  • @jacksonpereira8432
    @jacksonpereira8432 Рік тому

    Parabéns bro...
    Obg pela informação!

  • @ChristianMakeFX
    @ChristianMakeFX Рік тому

    Gratidão apenas!!! 👏🏼👏🏼👏🏼👏🏼

  • @izaquenilsom2816
    @izaquenilsom2816 11 місяців тому +1

    amei o vídeo!

  • @denissonjs
    @denissonjs 2 роки тому +1

    Show de bola amigo!!! Excelente video.

    • @Gemeltec
      @Gemeltec  2 роки тому +1

      Fico feliz que gostou amigo, agradeço pelo feedback!!!

  • @ipgb1200
    @ipgb1200 Рік тому

    Tu é sinistro mesmo hein cara kkkkkkk mais um inscrito

  • @cavilix8943
    @cavilix8943 8 місяців тому

    um querido, salvou minha vida!

  • @flavioestudio
    @flavioestudio 2 місяці тому

    simples e bem feito. adorei

  • @leandro906
    @leandro906 2 роки тому

    show d+, faz usando array :) como se fosse uma lista de usuários :D

  • @hugomr4559
    @hugomr4559 2 роки тому

    Muito bom!!!!
    Faça mais vídeos.

  • @otakunerd01
    @otakunerd01 5 місяців тому

    Faz sobre o banco de dados pfvr

  • @marcelinopastuchalmeida8466

    Tem algum video explicando a criação de ususario e senha para apos isso fazer o login?

  • @joseedcarlos330
    @joseedcarlos330 Рік тому +20

    Se meu professor pega eu vendo esse vídeo ele me dizerda kkkkkkk, o cara fez tudo dentro do HTML 🤦‍♂️

    • @WolfMaxBoss
      @WolfMaxBoss 8 місяців тому +2

      Pra quem tá começando é uma forma de treinar, mas real é só clicar com o direito e ir em inspecionar aí qualquer vê qual é o login e a senha kk

    • @0xpsicod0s
      @0xpsicod0s 7 місяців тому +4

      ​@@WolfMaxBoss cara, isso foi só pra didática, é mais ou menos assim que acontece no back end. Você nunca vai colocar o admin e a senha no JavaScript independente se está em arquivo separado ou se tá no HTML

  • @brunoferreiraadev
    @brunoferreiraadev 2 роки тому

    Muito bom, fácil entendimento! 👋👋

  • @rafaelrodriguespadilha2056
    @rafaelrodriguespadilha2056 2 роки тому

    Video Excelente ... Parabens !!! SEGUINDO

  • @fawzin3421
    @fawzin3421 2 роки тому +1

    Opa, beleza? aqui me saiu um erro no return do html. "A 'return' statement can only be used within a function body.javascript"

  • @hqeproducoes6027
    @hqeproducoes6027 Рік тому

    Ganhou mais um inscrito, valeu amigão, baita conteúdo

  • @costazunguza5037
    @costazunguza5037 4 місяці тому

    Rodrigo tudo bem? peco ajuda, gostava de saber como conectar o formulario de login com botao de login no vscode!

  • @jamille7794
    @jamille7794 2 роки тому

    Muitíssimo obrigadaaaaaaa, ajudou muitooo.

  • @highpages1644
    @highpages1644 2 роки тому +1

    Se eu colocar na barra de endereço o home.html ele vai entrar sem precisar do login??

  • @elsonsouza4638
    @elsonsouza4638 2 роки тому

    Obrigado Victor, me salvou!!

  • @pauloregis5279
    @pauloregis5279 2 роки тому

    Muito bom mesmo e muito alto explicativo

  • @frontenddanilo
    @frontenddanilo Рік тому

    E para outros, tipo e-mail e senha, como crio? Um usuário colocar a senha e e-mail na tela de login, como valido isso no js.

  • @alexsandrasantoslima6515
    @alexsandrasantoslima6515 Рік тому

    Muuuuito bom! Obrigada pelo tutorial

  • @malldamba1395
    @malldamba1395 2 роки тому +1

    CARAAACA MANO Me salvou dmss, vlw mesmo lek

    • @Gemeltec
      @Gemeltec  2 роки тому

      Opa, fico feliz em ajudar!

  • @daysol532
    @daysol532 3 місяці тому

    É possivel criar um site de validacao de documento pela leitura do qrcode?
    Tipo, eu gerar um qrcode e ser direcionado pra pagina apenas com o documento em pdf?

  • @EuSouBergas
    @EuSouBergas 2 роки тому +2

    Alguem pode me dar uma ajudinha :D???
    o meu "return false" ta com problema, eu uso o VS Code e aparece o segunte erro "A 'return' statement can only be used within a function body.javascript"
    e ai n roda o codigo...

    • @Gemeltec
      @Gemeltec  2 роки тому

      Olá amigo, algumas pessoas tem falado desse erro mesmo, ainda não descobri o porque dele, mas uma sugestão que talvez te ajude é mudar o type="submit" para type="button" e remover o return false

    • @its_leandro
      @its_leandro 2 роки тому +1

      Eu já tivesse esse erro, o return tem que estar dentro das aspas do onclick

  • @leaords8538
    @leaords8538 2 роки тому

    muuiiitooooooo obg pelos codigos no git

  • @neusadasilvaduartesantos3984
    @neusadasilvaduartesantos3984 10 місяців тому

    deu boa muto bom parabéns peguei o codigo no seu github e escrevi em outro pc

    • @Gemeltec
      @Gemeltec  10 місяців тому

      Que maravilha, fico feliz que funcionou!

  • @moisesrocha7169
    @moisesrocha7169 2 роки тому

    Mano, simples e sensacional

  • @joelsoncarvalhojunior2295
    @joelsoncarvalhojunior2295 Рік тому

    Muito bom.... parabéns

  • @ERICKCSCS
    @ERICKCSCS 11 місяців тому

    Poxa muito bom, e didático.

  • @isinha66
    @isinha66 Рік тому +1

    muito obrigada!

  • @Mauriciozzzz
    @Mauriciozzzz 2 роки тому

    Tu é sensacional! muito massa

  • @mamutygamerfurtivo3783
    @mamutygamerfurtivo3783 Рік тому

    falta considerar que se a pessoa digitar a url da pagina no browser pula a etapa do "login". Ou seja, a página não está protegida. Como proteger a pagina, ou o site inteiro?

  • @carloscarvalho8924
    @carloscarvalho8924 Рік тому

    Gostei muito bom, queria pergunta uma coisa tem como essa autenticação ser pela conta do google. por exemplo eu não tenho login e nem senha, mas poderia loga com uma conta google ou microsoft, vocês algum video explicando como é este fluxo de autenticação.

    • @Gemeltec
      @Gemeltec  Рік тому

      Não tenho mas estou voltando a produzir e pode deixar que a sua solicitação será lançada também!!

  • @geanevieira4511
    @geanevieira4511 Рік тому +1

    Olá bom dia, não estou conseguindo validar o meu código. Não está aparecendo a mensagem nem de sucesso e nem de erro.
    Login







    function logar(){
    var login = document.getElementById("login").value;
    var senha = document.getElementById("senha").value;
    if(login=="admin" && senha=="admin"){
    alert("Sucesso"); }
    else{
    alert("Usuario ou senha incorreta");
    } }

  • @pauloh3157
    @pauloh3157 Місяць тому

    irmão vc e cara muito obrigado

  • @arnaldopereira8331
    @arnaldopereira8331 Рік тому

    eu só estava precisando da script obrigado

  • @anonimousanonimo3813
    @anonimousanonimo3813 Рік тому

    Onde ficara guardada a informações de login do usuário quando for fazer login em meu site?

  • @AndreEstevesCleusio-yc6tw
    @AndreEstevesCleusio-yc6tw Рік тому

    Stela do PC não está bem visível se dá para melhorar o vídeo vai ser melhor ainda . obrigada pela aula

  • @dyogynis
    @dyogynis 4 місяці тому

    Muito boa a aula só não façam dessa maneira pois qualquer um conseguiria ver a senha e usuário no código da página web.

    • @Gemeltec
      @Gemeltec  4 місяці тому

      Bem reforçado amigo!

  • @rogeriojunior960
    @rogeriojunior960 2 роки тому

    Boa noite, como que eu faço para pegar os dados ja cadastrados no banco de dados, e fazer a verificação aí na tela de login

  • @dscsddsqq
    @dscsddsqq Рік тому

    que aula top

  • @Slowly.404
    @Slowly.404 10 місяців тому

    E para utilizar um banco de dados? Cadastrar e logar...

  • @joelsoncarvalhojunior2295
    @joelsoncarvalhojunior2295 Рік тому +2

    O proximo passo seria fazer ele validar esse acesso no banco de dados