Skip to main content
JavaScript & the browser·Module C9 · Lesson 1
TaskWrite log(key) helper that logs key + '=' + localStorage.getItem(key). Set 'theme'='dark', 'locale'='uk', then log each. Remove 'theme', log it again (should be 'theme=null').

localStorage — read, write, remove

75 XP6 min
Theory

Persistent key/value storage

localStorage survives page reloads. Up to ~5 MB per origin. Both keys and values are strings — numbers and objects need to be serialized.

localStorage.setItem("theme", "dark");
const t = localStorage.getItem("theme"); // "dark"
localStorage.removeItem("theme");
localStorage.clear();                     // nuclear option

Common shape

  • User prefs (theme, locale, font-size).
  • Session resumption ("you were on lesson-42").
  • Form draft autosave.

What NOT to store

  • Sensitive data (anyone with devtools can read it).
  • Large blobs (use IndexedDB — there's a quota).
  • Anything you'd lose sleep over if the user clicked "Clear browsing data".

The string trap

localStorage.setItem("count", 7) silently stringifies — when you read it back you get "7", not 7. Use JSON.stringify / JSON.parse for non-strings (lesson C9-02).

🔒

Sign up to start coding

Theory is open to everyone. The interactive editor, live preview, and check are unlocked with a 7-day free trial — card required, cancel anytime.

Sign up — free trial →

First 10 lessons in each track are free. No card needed for those.

PreviousNext lesson →

Get one Python or web tip a day — by email

Short, hand-written, no spam. Unsubscribe in one click.