Web Storage

Web Storage

Web Storage lets you save data in the browser that survives page reloads.

localStorage

localStorage saves data with no expiration. It stays even after closing the browser:

localStorage.setItem("name", "Ada");
localStorage.getItem("name"); // "Ada"
localStorage.removeItem("name");
localStorage.clear();

sessionStorage

sessionStorage works the same but clears when the tab closes:

sessionStorage.setItem("key", "value");

localStorage vs sessionStorage

• localStorage: persists forever (until cleared).
• sessionStorage: lasts for the session (tab).

Storing objects

Storage only saves strings, so use JSON:

localStorage.setItem("user", JSON.stringify({ name: "Ada" }));
const user = JSON.parse(localStorage.getItem("user"));
user.name; // "Ada"

Common uses

• Remember user preferences and theme.
• Save login tokens.
• Keep shopping cart data.

TL;DR

• localStorage persists data across sessions.
• sessionStorage clears when the tab closes.
• Values must be strings, so use JSON for objects.
• setItem, getItem, removeItem, clear.