How to use Local Storage with JavaScript

====================

It has been a bit since I did another Let’s Build: With JavaScript so I’m back with a new one focusing in on using Local Storage.

As a precursor to this tutorial I highly recommend not using local storage for comment data as I’m about to show you but rather more for small key-value assignments. For example, say you display a notification prompt, email subscription prompt, or alert of some kind on your site. You can hook into the browsers local storage API to save whether or not a given user wants to see these things as they display on your site.

That all could take place with a click event with JavaScript.

This tutorial goes one step further to show a proof of concept around adding a new comment to an existing comment feed. This in no way is complete but gives you an overview of how to both append new data to the DOM as well as store that data with local storage.

I invite you to extend this code to allow the commenter to delete their comments from local storage as well.

====================

📰 Subscribe:

💎🛤 NEW COURSE: HELLO RAILS - Get notified

💻 Previously published at:

💻 Check out the blog:

🦄 Check out my personal site:

🚀 Links:

📘Check out my book on UX Design:
"LUXD: Learn User Experience Design"

📙 Check out my FREE book on Tumblr Theming:
"Pro Tumblr Theming"

💯 Need awesome web hosting? Check out cloudways. They allow me to use a variety of hosting providers and build apps with ease:

🌊 Need more advanced hosting for Rails, PHP, Node, or other projects? Digital Ocean has you covered.

☕️ Or buy me a coffee

[campinamerica]

Thank you so much for this video!! I’ve been trying to figure out how to use local storage for comments....OMG!! You don’t know how much this helped me!! I was using appendChild methods and creating elements to append to the don...this made it so much easier!!

[annbyrne]

Thank you so much for this video, ive been having a lot of trouble getting local storage to work with my current assignment (a to do list) and the simple way you set it out has really helped!

[tahuislam]

in my case the js function is making the div but the div disapears after reload.! how to fix it?