Aprenda tudo sobre localStorage e sessionStorage de JavaScript

แชร์
ฝัง
  • เผยแพร่เมื่อ 25 ส.ค. 2024
  • Neste artigo você vai aprender tudo sobre #LocalStorage e #SessionStorage, recursos muito importantes de #JavaScript. Você também vai aprender como salvar e resgatar objetos da LocalStorage. No fim, criaremos um projeto para aplicar os conhecimentos aprendidos na parte teórica.
    📒 Ebook JS: www.horadecoda...
    🟡 Curso JS: www.udemy.com/...
    🔵 Curso React: www.udemy.com/...
    ⭐ Nossos cursos: www.horadecoda...
    🔴 Instagram: @horadecodar 🔷 Telegram: t.me/horadecodar .
    🟣 Discord Hora de Codar: / discord

ความคิดเห็น • 113

  • @MatheusBattisti
    @MatheusBattisti  2 ปีที่แล้ว +10

    📒 Garanta seu ebook de JS avançado: www.horadecodar.com.br/ebook-javascript-avancado-gratuito/

    • @denysantos9012
      @denysantos9012 2 ปีที่แล้ว

      Matheus curso de electron ??

    • @PexuPixo
      @PexuPixo ปีที่แล้ว

      Poderia ter falado de cookie e cache também.

    • @guilhermebarreto4040
      @guilhermebarreto4040 11 หลายเดือนก่อน

      "gratuito"

    • @dev.gabrielmendes
      @dev.gabrielmendes 2 หลายเดือนก่อน +1

      o ebook não tá baixando

  • @MrDvcosta
    @MrDvcosta 2 ปีที่แล้ว +24

    Muito obrigado, Matheus. Eu tinha pedido essa aula e você atendeu. O assunto foi passado de maneira tão didática e interessante, que nem percebi passar os 30 min do vídeo. Muito obrigado, meu irmão!

    • @MatheusBattisti
      @MatheusBattisti  2 ปีที่แล้ว +2

      de nada Daniel =) Espero que vc tenha curtido

    • @nilolima5401
      @nilolima5401 2 ปีที่แล้ว

      Eu tbm cara, impressionante. Eu imaginei que esse assunto era tão complicado, hoje eu vi que é extremamente simples

    • @PexuPixo
      @PexuPixo ปีที่แล้ว

      @@MatheusBattisti O Session Storage do Live Server não é excluído quando a janela do navegador é fechada.

  • @operator-SamuelColt
    @operator-SamuelColt 3 หลายเดือนก่อน +1

    Muito bom. Explicou direitinho e ainda mandou um estudo de caso, bom demais.

  • @theusz_carvalho
    @theusz_carvalho ปีที่แล้ว +1

    Eu imaginava que era muito difícil e pode até ser se mal explicado, entendi tudo perfeitamente obrigado continua com esses conteúdos por favor!!

  • @alineperella7054
    @alineperella7054 ปีที่แล้ว +2

    Sensacional! Aprendo demais contigo. Comprei o seu curso de front - end mas continuo acessando os conteúdos aqui tbm. Sua didática é muito boa 😄

  • @alexandrepateis
    @alexandrepateis 2 ปีที่แล้ว +3

    Cara, você é incrível, simplesmente inacreditável como meu aprendizado aumentou vendo seus vídeos, muito obrigado mesmo

    • @MatheusBattisti
      @MatheusBattisti  2 ปีที่แล้ว

      show Alexandre, espero continuar te ajudando, e obrigado!

  • @adryelmartins6943
    @adryelmartins6943 ปีที่แล้ว

    Parabéns pela a aula, todo mundo que está iniciando no javascript deveria assistir esse vídeo. 👏👏👏

  • @fvandrade
    @fvandrade 2 ปีที่แล้ว +2

    Uma das melhores explicação sobre o assunto que encontrei no aplicativo

  • @nedersimoes
    @nedersimoes 2 ปีที่แล้ว +2

    Excelente aula Mestre! Isso costuma ser perguntado em entrevistas. Muito bom!

  • @Joao.Gabriel7
    @Joao.Gabriel7 2 ปีที่แล้ว +2

    Não tem como não aprender assim!!! Valeu Matheus por mais uma excelente aula!!!!

  • @lorranalves5495
    @lorranalves5495 2 ปีที่แล้ว +1

    parabens pelo otimo conteudo,quando vou atras de algum conhecimento ja olho se não tem um video seu explicando para dar preferencia

  • @r4ulzito
    @r4ulzito 2 ปีที่แล้ว +2

    Vídeo maravilhoso, sua didática é ótima!

  • @mbs2488
    @mbs2488 ปีที่แล้ว +1

    Excelente ! Muito Bem Explicado ! ! Parabéns pelos vídeos ! ! !

    • @MatheusBattisti
      @MatheusBattisti  ปีที่แล้ว

      valeu Moa! Se quiser aprender mais sobre JS comigo, se liga aí: horadecodar.com.br/comunidade-hora-de-codar/ =)

  • @gremioesportivo
    @gremioesportivo ปีที่แล้ว

    Parabéns pelo vídeo, me ajudou bastante em um projeto que estava realizando.

  • @thiagopires5407
    @thiagopires5407 9 หลายเดือนก่อน

    Parabéns pelo video.... Aproveitei cada minuto!

  • @thescriptkiddie
    @thescriptkiddie ปีที่แล้ว +1

    Vídeo excelente professor, muito obrigado!

  • @MarcosLanzoni
    @MarcosLanzoni 2 ปีที่แล้ว +1

    Muito show , vc e o cara ,estou fazendo seu curso de Sass e posso falar que e massa , parabéns

  • @mbs2488
    @mbs2488 ปีที่แล้ว

    S E N S A C I O N A L ! TUDO Muito Bem Explicado ! ! Parabéns pelos vídeos ! ! !

  • @jeffsilva
    @jeffsilva 2 ปีที่แล้ว

    galera, curso de JS do Battisti é top. super recomendo. Valeu, professor... super aula.

  • @lucasraymundo4167
    @lucasraymundo4167 2 ปีที่แล้ว +1

    Ótima aula e exercício para fixação

  • @anaamaral6855
    @anaamaral6855 ปีที่แล้ว

    Parabéns pela dinâmica!!!

  • @davimc1979
    @davimc1979 3 หลายเดือนก่อน

    Salvou pro meu entendimento superior.

  • @vitorhugo-zary
    @vitorhugo-zary 2 หลายเดือนก่อน

    Muito bom!

  • @marcosjesus07
    @marcosjesus07 2 ปีที่แล้ว +1

    Muito bom aula, sensacional!!!

  • @jasonloureiro7095
    @jasonloureiro7095 2 ปีที่แล้ว +2

    Ótimo conteúdo Professor!

  • @thiagobispo1
    @thiagobispo1 2 ปีที่แล้ว +1

    sua didática é muito boa, parabéns + 1 inscrito

  • @drinks.a4230
    @drinks.a4230 ปีที่แล้ว

    Excelente! mais uma vez!

  • @levyjr6857
    @levyjr6857 ปีที่แล้ว

    Muito foda vei, parabéns. Entendi tudo

  • @JeffersonLuizCruz
    @JeffersonLuizCruz ปีที่แล้ว

    top demais. Não sabe como ajudou

  • @limaraianna
    @limaraianna ปีที่แล้ว

    Nice!! Thanks, 🙌

  • @gustavonaves6947
    @gustavonaves6947 2 ปีที่แล้ว

    Excelente aula! Parabéns 👏 👏

  • @wevertonsantiago4305
    @wevertonsantiago4305 2 ปีที่แล้ว +1

    Topezara demais! Obrigado!

  • @heitorrafael7650
    @heitorrafael7650 9 หลายเดือนก่อน

    muito brabo, valeu !!

  • @cassianocominetti7784
    @cassianocominetti7784 7 หลายเดือนก่อน

    Muito bom vídeo!

  • @FunctionDev
    @FunctionDev ปีที่แล้ว

    muito show

  • @jaquelineuchoa3042
    @jaquelineuchoa3042 ปีที่แล้ว

    Muito obrigadaaa! Ajudou bastante!

  • @guitt-web-code
    @guitt-web-code 2 ปีที่แล้ว

    sua ditática e muito boa

  • @italocelani
    @italocelani 3 หลายเดือนก่อน

    Bravo.!!!!

  • @guitt-web-code
    @guitt-web-code 2 ปีที่แล้ว +1

    cara aula fantastica

  • @loveisforfree
    @loveisforfree 2 ปีที่แล้ว

    muito boa a explicação

  • @jhenifferortega1148
    @jhenifferortega1148 ปีที่แล้ว

    PERFEITO!

  • @yagogomes3974
    @yagogomes3974 2 ปีที่แล้ว

    muito bom

  • @lucianob.ferenczuk5698
    @lucianob.ferenczuk5698 ปีที่แล้ว

    sensacional!!!

  • @alansillva5410
    @alansillva5410 ปีที่แล้ว

    Muito bom, top.

  • @PexuPixo
    @PexuPixo ปีที่แล้ว +1

    O Session Storage do Live Server não é excluído quando a janela do navegador é fechada.

  • @LEKYNH4
    @LEKYNH4 2 ปีที่แล้ว +1

    Top prof!

  • @aurimsjr
    @aurimsjr 2 หลายเดือนก่อน

    Muito bom conteúdo....ajudou muito no entendimento.
    ** Obs.: O Ebook não está direcionando para o download.

  • @Onepiece-ht3jn
    @Onepiece-ht3jn ปีที่แล้ว +2

    Conheci a pouco tempo brython e ao ver esse video me veio uma duvida, tem como fazer isso com brython?

  • @a151412
    @a151412 2 ปีที่แล้ว +1

    Matheus, obrigado pelos videos. Assinei o canal recentemente e tenho aumentado muito o conhecimento na linguagem JavaScript. Gostaria de aproveitar a oportunidade e solicitar a possibilidade de você montar uma aula com um conteúdo de ler um arquivo e utiliza-lo para carregar dados em uma tabela no HTML. Mas a leitura ser independente de um form. Ser por exemplo no carregamento da pagina. Não sei se é possível, mas pesquisei bastante e os exemplos que vejo sempre e através de foram e da maquina do usuário.
    Abraços e muito obrigado.
    Claudio

    • @MatheusBattisti
      @MatheusBattisti  2 ปีที่แล้ว +1

      fala Claudio, vi o seu e-mail agora e vim caçar seu comentário hahaha
      aqui é bem democratico, todos podem comentar o que quiserem, desde que não haja ofensa/discurso de ódio
      sobre a sua solicitação: eu anotei aqui e mais pra frente teremos este vídeo
      obrigado e até mais! =)

  • @PexuPixo
    @PexuPixo ปีที่แล้ว

    Poderia ter falado de cookie e cache também.

  • @Henrique-sg9wm
    @Henrique-sg9wm 2 ปีที่แล้ว +1

    eu tava precisando dessa aula em kkk

  • @guitt-web-code
    @guitt-web-code 2 ปีที่แล้ว

    professor faz um vídeo explicando o indexedDB

  • @raulgermano6510
    @raulgermano6510 10 วันที่ผ่านมา

    Olá Battisti, espero que se encontre bem. Tenho uma aplicação que o usuário deve se autenticar a cada hora, mas desejo permitir que o usuário possa escolher se deseja que a sessão fique ativa para sempre no dispositivo que acessou. Você tem alguma sugestão? Acredito que a única forma de fazer esse controle seja com uma base de dados pra salvar os dados do dispositivo e da sessão. Como o usuário pode acessar por mais de um dispositivo, sabe qual dado posso considerar para conseguir diferenciar os dispositivos?

  • @eduardoserpa3940
    @eduardoserpa3940 ปีที่แล้ว

    boa, Battisti!

  • @aliriorios3699
    @aliriorios3699 ปีที่แล้ว

    O sessionStorage não seria a forma "padrão" de como a gente utiliza em projetos pequenos sem utilização de banco de dados?
    Porque o localStorage eu entendi como posso aproveitar em meus projetos, mas o session meio que não faz diferença usar ou não.

  • @JoaoPaulo-ox6pr
    @JoaoPaulo-ox6pr 2 ปีที่แล้ว

    21:15 qual atalho ou extensão você usa pra separar os atributos dessa forma?

  • @arquivo_alx
    @arquivo_alx 2 ปีที่แล้ว +1

    Bom vídeo

  • @scriptandojs7399
    @scriptandojs7399 2 ปีที่แล้ว +1

    alguém pode me ajudar? Toda vez que tento usar o get storage o valor vem em um array tipo,eu ponho no input react e ele vem 'react',sem contar que a cada novo item que eu ponho nessa to do list ele vai somando os anteriores,segue o código:
    const add = document.querySelector('#submit').onclick = CreateListItem
    const ul = document.querySelector('#ul')
    const input = document.querySelector('#txt')
    const arr = []
    function CreateListItem(e){
    e.preventDefault()

    if(input.value !== ''){
    arr.push(input.value)
    console.log(input.value)
    localStorage.setItem("Item",JSON.stringify(arr))

    const fullfilled = 'Item Added to the list!'
    console.log('%c' + fullfilled, 'color:#7458B9')
    const div = document.createElement('div')
    div.setAttribute('class','flex')
    ul.appendChild(div)
    const li = document.createElement('li')
    li.textContent = input.value
    div.appendChild(li)
    input.value = ''
    const removeButton = document.createElement('i')
    removeButton.setAttribute('class','fa-regular fa-trash-can')
    div.appendChild(removeButton)
    removeButton.addEventListener('click',RemoveListItem)
    function RemoveListItem(){
    ul.removeChild(div)
    }
    }else{
    const error = 'ERROR,please add an item to the list!'
    console.error(error)
    alert('Item is required!')
    }
    }

  • @udsonfernandes6800
    @udsonfernandes6800 ปีที่แล้ว

    Se limpar o cache do navegador as informações são perdidas...
    Se coloca o Index. No servidor para dois computadores na rede acessarem o mesmo arquivo, não sobem com a informação atualizada...

  • @RicardoSantos-zn1zl
    @RicardoSantos-zn1zl ปีที่แล้ว +1

    amigo, tu é de onde? tens sotaque catarinense kkkkkk, eu sou de bombinhas - sc, muito show seu canal

    • @nativadu7300
      @nativadu7300 6 หลายเดือนก่อน +1

      eu sou de balneário Camboriú kkkk

  • @gptchatbrasil
    @gptchatbrasil 21 วันที่ผ่านมา

    E Show, mas deica eu perguntar Matheus,..Amigo estou adicionando um trecho de código via html dentro do meu site em Wordpress, mas funciona Liso no Desktop mas no celular não guarda, alguma deia de como descobrir como resolver, testei em 2 celulares diferente e nenhum funciona

  • @raimundoclessyo8943
    @raimundoclessyo8943 ปีที่แล้ว

    sessionStorage: deleta quando fecha a Janela ou a aba?

  • @rafaels.agapito4609
    @rafaels.agapito4609 9 หลายเดือนก่อน

    Transcrevi o código mas não apareceu a div depois da verificação, o que pode ser?

  • @eduardoalmeida4692
    @eduardoalmeida4692 9 หลายเดือนก่อน

    Maneiro, mas dificil pra kct hahahaha

  • @Matheus_1582
    @Matheus_1582 2 ปีที่แล้ว +1

    Matheus você tem algum script de valor...expemlo
    Eu criei um projeto e ta faltando esse escript de um velie passe de uma pagina para outra
    R$ 1,50 ==> R$ 1,50
    Isso e um exemplo de uma transição de uma pagina para outra so que tem que ser quando clicar no botão...

  • @pedrocfreitas
    @pedrocfreitas 10 หลายเดือนก่อน

    Mateus, como faço pra persistir mesmo se limpar o histórico?

  • @nilolima5401
    @nilolima5401 2 ปีที่แล้ว

    Vc recomenda salvar token no SessionStotage, LocalStorage ou em Cookies?

  • @raimundoclessyo8943
    @raimundoclessyo8943 ปีที่แล้ว

    Existe uma regra para quando utilizar o localStorage?

  • @JoaoVictor-gp3bx
    @JoaoVictor-gp3bx 9 หลายเดือนก่อน

    Alguma alma caridosa, por favor, explica como faz o localstorage desse projeto. Faz horas que estou tentando estruturar, mas não consigo😔.

  • @RapGod.
    @RapGod. 2 ปีที่แล้ว +4

    Uma dica : localStorage.name= "nome" => name vai receber "nome"
    localStorage.name; => pegar o valor de name, no caso "nome"

    • @danielcursos3653
      @danielcursos3653 ปีที่แล้ว

      muito obrigado por compartilhar esse conhecimento tmj mano😄

  • @Douglasespinola
    @Douglasespinola 9 หลายเดือนก่อน

    25:10 essa parte eu não entendi bem. É realmente necessário? Eu não coloquei aqui e funcionou da mesma maneira.

  • @rafaelfelipenovi6308
    @rafaelfelipenovi6308 ปีที่แล้ว

    É possivel criar um formulario q funcione offline com isso e qndo tiver internet ele sincronize com uma base de dados? Nao sou programador, caso alguem saiba posso pagar para me ensinar ...

  • @elbarto7862
    @elbarto7862 ปีที่แล้ว

    Boa noite, beleza? Consigo exibir o valor do localstorage em outra pagina\aba do mesmo projeto?

  • @ninha601
    @ninha601 ปีที่แล้ว +1

    boa tarde o meu so fica dando erro neste trecho (nameForm.addEventListener("submit", (e) => {
    e.preventDefault();) alguem pode me ajudar?

    • @anaamaral6855
      @anaamaral6855 ปีที่แล้ว

      depois do e.preventDefault(); é suposto ter uma chave para fechar a arrow function }

  • @Themaface201
    @Themaface201 2 ปีที่แล้ว

    Matheus, queria fazer isso porém com imagem. Poderia me ajudar?

  • @pablosalazar8945
    @pablosalazar8945 2 ปีที่แล้ว +1

    Professor tem cupom pro curso de react, quero comprar

    • @MatheusBattisti
      @MatheusBattisti  2 ปีที่แล้ว +1

      teremos segunda que vem Pablo, só se inscrever na página de cursos para receber

  • @tramonts
    @tramonts ปีที่แล้ว

    pra mim tá dando esses 3 erros:
    1. Uncaught TypeError: Cannot read properties of null (reading 'style')
    at checkUser (project.js:10:26)
    at project.js:40:1
    2. Uncaught TypeError: Cannot read properties of null (reading 'style')
    at checkUser (project.js:17:26)
    at HTMLButtonElement. (project.js:36:5)
    3 . Uncaught TypeError: Cannot read properties of null (reading 'style')
    at checkUser (project.js:10:26)
    at HTMLFormElement. (project.js:30:5)

  • @danilobucker
    @danilobucker ปีที่แล้ว

    engaja

  • @user-rn4yi5vw2v
    @user-rn4yi5vw2v หลายเดือนก่อน

    A partir das 22:40 eu não entendi mais nada, esses professores quando chegam nessa parte começam a explicar meia boca o que estão fazendo aí entendo poh@ nenhumaa

    • @MatheusBattisti
      @MatheusBattisti  หลายเดือนก่อน

      Para refletir: O problema está em todos os outros professores ou em você?

  • @deivsonb7
    @deivsonb7 2 ปีที่แล้ว +1

    Otima abordagem! Obrigado Matheus!

  • @joezersmaniotto3103
    @joezersmaniotto3103 2 ปีที่แล้ว +1

    Muito bom!