Practice & Assessment
Test your understanding of Browser APIs and Storage
Multiple Choice Questions
5Why must you use JSON.stringify() before storing an object in localStorage?
What is the difference between localStorage and sessionStorage?
What does clearInterval() do?
What is the purpose of the finally block in a try/catch statement?
Which API would you use to read the user's geographic coordinates in the browser?
Coding Challenges
1Persistent To-Do List with localStorage
Extend a basic to-do list so that tasks are saved to localStorage. Every time a task is added or deleted, save the updated tasks array to localStorage using JSON.stringify(). When the page loads, read from localStorage with JSON.parse() and render any saved tasks. Test by adding tasks, refreshing the page, and verifying the tasks persist.
Mini Project
Full-Featured Notes Application
Build a fully featured notes app with the following capabilities: create, edit, and delete notes. Each note has a title, body, and timestamp. All notes are persisted to localStorage and loaded on page refresh. Add a search bar that filters notes by title in real time using the input event. Add a copy-to-clipboard button on each note card using the Clipboard API. Show a toast notification for 2 seconds after copying using setTimeout. Wrap all localStorage operations in try/catch. Use async/await with the Clipboard API. Build a clean responsive UI with a card grid layout.