Hackforge Academy

Explanation

Why localStorage and sessionStorage in JavaScript? In JavaScript, localStorage and sessionStorage are part of the Web Storage API. They are used to: Store data in the browser Save user data without a database Keep data even after page refresh

Code:

Explanation

Why Do We Need Them? let name = "Praveen"; If page refreshes → data is lost To persist data in browser → we use: 1.localStorage 2.sessionStorage

Code:

Explanation

LocalStorage Example
Store Data: localStorage.setItem("username", "hackforge");
GetData localStorage.getItem("username");
Remove Data localStorage.removeItem("username")
Clear All localStorage.clear();

Code:

Explanation

How to store Dark Mode Toogle using LocalStorage:

Code:

localStorage.setItem("theme", 
"dark");

// Get theme
let theme = localStorage.getItem("theme");

if (theme === "dark") {
  document.body.style.
backgroundColor = "black";
}

Explanation

SessionStorage Example
Store Data: sessionStorage.setItem("username", "hackforge");
GetData sessionStorage.getItem("username");
Remove Data sessionStorage.removeItem("username")
Clear All sessionStorage.clear();

Code:

Explanation

Login Session with SessionStorage:

Code:

sessionStorage.setItem("isLoggedIn"
, "true");

if(sessionStorage.getItem("isLoggedIn") 
'=== "true") {

  console.log("User logged in");

}

Explanation

Real-Time Use Cases
localStorage 1.Remember dark mode 2.Save cart items 3.Save language preference 4.Remember user settings
sessionStorage 1.Store login token 2.OTP verification session 3.Temporary form data

Code: