💎

Treasure Vault

Last time you chained Filter → Map → Reduce into a data pipeline. Today you'll learn localStorage — the browser's built-in memory that saves your data even after you close and reopen the page! Build a treasure vault that remembers every gem you collect.

← Code CP20 Creator Path 💎 Treasure Vault
🏝️
Welcome to Treasure Island! Your vault is empty — for now. You'll collect rare gems, save them to the browser's memory, and build a collection that survives page refreshes. Every real app uses storage just like this!
⚡ Today's Concept

localStorage: The Browser's Memory

localStorage is like a tiny notebook in your browser. You can write data to it, read it back, and it stays there even after you close the tab! Real apps use it to remember your settings, scores, and progress.

// Save data to the browser's memory
localStorage.setItem('treasures', JSON.stringify(myArray))
// Load it back (even after refresh!)
let data = JSON.parse(localStorage.getItem('treasures'))
// Remove it
localStorage.removeItem('treasures')

💎 Your Treasure Vault 0 gems

Add treasures, then save your vault!

🎯 Challenges

0 of 4 challenges 0/4
🏆

Vault Master!

You built a data-persistent treasure vault — just like real apps!

What You Learned

localStorage is the browser's built-in memory — data stays even after you close the page.
JSON.stringify converts arrays/objects into text that localStorage can store.
JSON.parse turns that text back into real arrays/objects when you load it.
localStorage.setItem(key, value) saves data. getItem(key) loads it back.
Real apps use localStorage for settings, game saves, shopping carts, and more!

🚀 Come back tomorrow! Next up: combine EVERYTHING you've learned — variables, functions, events, storage, and more — into one epic final project! 🎮

✨ Treasure saved!