Até agora, tudo o que fizemos com JavaScript aconteceu em tempo real: o usuário interage, o código responde — e ao recarregar a página, tudo começa do zero.

Mas aplicações reais precisam ir além:

elas precisam lembrar informações.

Nesta aula, vamos entender onde e como dados podem ser armazenados no navegador.

🎯 Objetivo da aula

Ao final desta aula, você será capaz de:

  • Entender por que armazenar dados no navegador
  • Diferenciar memória de armazenamento
  • Conhecer os tipos de storage disponíveis
  • Saber quando usar armazenamento no cliente
  • Preparar o terreno para localStorage, sessionStorage e cookies

Por que armazenar dados no navegador?

Imagine situações comuns:

  • Salvar o tema escolhido (claro/escuro)
  • Lembrar dados de um formulário
  • Manter o usuário logado
  • Guardar preferências

Sem armazenamento, tudo isso se perde ao recarregar a página.

Memória vs Armazenamento

É muito importante entender essa diferença:

  • Memória → dados vivem enquanto a página está aberta
  • Armazenamento → dados continuam após recarregar ou fechar

Exemplo: 

 let contador = 0; contador++; console.log(contador); 
 console.log(contador); // Saída será 1, mas ao recarregar a página volta para 0

Isso acontece porque a variável vive apenas na memória.

Onde os dados podem ser armazenados?

No contexto do frontend, temos algumas opções:

  • localStorage
  • sessionStorage
  • Cookies
  • IndexedDB

Cada uma tem um propósito diferente.

Armazenamento no cliente vs servidor

Nem todo dado deve ser salvo no navegador.

Regra mental importante:

  • Preferências → cliente
  • Estado temporário → cliente
  • Dados sensíveis → servidor
Nunca armazene senhas ou informações sensíveis no navegador.

Persistência dos dados

Outro conceito importante é o tempo de vida dos dados.

  • Alguns dados duram até fechar a aba
  • Outros duram dias, meses ou indefinidamente

É isso que diferencia sessionStorage de localStorage.

O navegador como mini banco de dados

Hoje, o navegador não é só um exibidor de páginas:

  • Ele armazena dados
  • Ele executa lógica
  • Ele funciona offline

Isso permite criar aplicações cada vez mais completas.

Pensar em armazenamento é pensar em experiência do usuário.

Resumo da aula para nunca mais esquecer

  • Aplicações reais precisam lembrar informações
  • Memória se perde ao recarregar a página
  • Storage persiste dados no navegador
  • Existem vários tipos de armazenamento
  • Cada tipo tem um uso específico

Na próxima aula, vamos aprender na prática o localStorage — o tipo de armazenamento mais usado no frontend.

HARDWARE

Entendendo o seu computador

O que há dentro do meu computador?

Existem alguns componentes fundamentais presentes dentro do seu computador e é muito importante que você conheça um pouco sobre eles, seja para argumentar com algum vendedor durante a compra de um novo PC ou para identificar alguma atitude desleal de algum técnico que esteja te passando um orçamento para reparo. Na seção Raio-X aqui do Contém Bits você pode conhecer e entender mais detalhadamente sobre cada componente, ou também pode clicar abaixo no componente que deseja, para conhecê-lo melhor.

  • Gabinetes

  • Placas-Mãe

  • Processadores

  • Memória

  • Fontes

  • Drives Ópticos

  • Discos Rígidos

  • SSD

  • Placas de Som

  • Placas de Vídeo

Você Sabia?

Mario e seu bigode

O personagem Mario só possui bigode porque quando ele foi criado, em 1981, a resolução de tela dos equipamentos disponíveis não permitia que fosse desenhada uma boca, então os desenvolvedores fizeram o grande bigode para contornar essa limitação tecnológica.

Nintendo Wii

Nos primeiros oito dias após o lançamento do console Nintendo Wii foram vendidas 600 mil unidades. Isso equivale a quase um por segundo e estes incríveis números são referentes às vendas apenas nos EUA!

Civilization

A empresa Take-Two pagou à Infogrames mais de 22 milhões de dólares pelos direitos de Civilization, em novembro de 1994. Ainda sobre este título, Sid Meier, um dos seus fundadores, é o profissional da área dos games mais premiado em todo o mundo.

Tomb Raider - O Filme

Considerando todas as adaptações de jogos de videogame para o cinema, a mais bem sucedida foi Lara Croft: Tomb Raider, lançado em 2001 e que faturou 274 milhões de dólares. Ele foi dirigido por Simon West e estrelado pela bela Angelina Jolie.

Playstation

O Playstation só nasceu porque uma parceria entre Sony e Nintendo, para desenvolver uma unidade de CD para o Super Nintendo, fracassou. Clique aqui e saiba mais.