Skip to content

PRO TIP Block youtube.com at the DNS level — Pi-hole, NextDNS or your hosts file — but allow youtube-nocookie.com and i.ytimg.com. These tutorials keep playing; the rabbit hole does not.

Learning without distractions

JavaScript LocalStorage and Session Storage API Tutorial

27.1K views on YouTube

Web Dev Roadmap for Beginners (Free!): https://bit.ly/DaveGrayWebDevRoadmap

This JavaScript LocalStorage and SessionStorage tutorial demonstrates the Web Storage API. We’ll compare Session Storage (sessionStorage) and Local Storage (localStorage). We’ll look at why JSON works so well with web storage. You will learn how to store persistent data for users between their visits to your web app. Let’s get started!

Subscribe ➜ https://bit.ly/3nGHmNn

▶ This video is part of the JavaScript Tutorials for Beginners Playlist found here: https://www.youtube.com/playlist?list=PL0Zuz27SZ-6Oi6xNtL_fwCrwpuqylMsgT

✅ Quick Concepts outline:
JavaScript Web Storage API
(0:00) Intro
(0:14) Web Storage is part of the global window object
(4:02) Session Storage
(4:22) Local Storage for persistent data
(4:48) setItem
(5:28) The dev tools application tab
(5:50) What type of data does web storage store?
(6:20) getItem
(7:50) Why JSON is the perfect match for web storage
(12:15) A look at localStorage for persistent data
(14:15) removeItem
(14:55) Retrieving an item that does not exist
(15:25) Clear all items
(15:55) Get the key at a specific index position
(17:10) Return how many keys are in storage

📚 Further Reading:
MDN Web Docs:
Web Storage API: https://developer.mozilla.org/en-US/docs/Web/API/Web_Storage_API
sessionStorage: https://developer.mozilla.org/en-US/docs/Web/API/Window/sessionStorage
localStorage: https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage

📺 More Beginner JS Videos:
freeCodeCamp: https://youtu.be/PkZNo7MFNFg
Traversy Media: https://youtu.be/hdI2bqOjy3c
The Net Ninja: https://youtu.be/iWOYAxlnaww

✅ Follow Me:
Twitter: https://twitter.com/yesdavidgray
Reddit: https://www.reddit.com/user/DaveOnEleven
LinkedIn: https://www.linkedin.com/in/davidagray/

Was this tutorial about the web storage API with sessionStorage, localStorage, and persistent data helpful? If so, please share. Let me know your thoughts in the comments.

#localstorage #sessionstorage #javascript