Local Storage
Često želimo spremiti podatke u browseru
Kada i zašto koristit localStorage
- caching
- small auth token
- nikad se ne šalje na server
- togglanje light/dark mode
nema expiration date
- traje i nakon zatvaranja browsera i taba (za razliku od cookie)
- nestaje tek kada user izbriše cache ili kad aplikacije obrišu item ili cijeli localStorage
Spremanje podataka u browseru od usera
"The localStorage read-only property of the window interface allows you to access a Storage object for the Document's origin; the stored data is saved across browser sessions." - MDN
metode
localStorage.setItem("ime", "antonija");setItem()
vidljivo samo kod trenutnog usera
Primjer
Kako izgleda u browseru?
Zadatak
1. deklariraj varijablu ime
2. postavi ju u localStorage
3. pogledaj u browseru localStorage
localStorage.getItem("ime");getItem()
clear()
localStorage.clear();Kako spremiti objekt?
const user = {name: "antonija", age: 30};
const userStringified = JSON.stringify(user);
localStorage.setItem("user", userStringified);setItem()
const user = localStorage.getItem("user");
JSON.parse(user);getItem()
Zadatak
1. napravi objekt grad
2. dodaj mu properties ime i zip code
3. spremi grad u localStorage
Zadatak
1. napravi array users
2. assignaj mu listu objekata
3. svaki objekt treba imati ime i active(true/false)
4. spremi users u localStorage
Zadaća
Pogledaj video
Pročitaj članke
Zadatak
- napravi input field
- dodaj button
- kad se upiše ime u input field i klikne button, ime se treba spremiti u localStorage
- kad se stranica učita, trebaju se prikazati sva imena u jednom <ul>
- dodaj button koji će obrisati cijeli localStorage
Ako želiš znati više
29. Local Storage
By tonkec palonkec
