{"id":18109,"date":"2017-01-17T20:14:28","date_gmt":"2017-01-17T20:14:28","guid":{"rendered":"https:\/\/jsforwp.dbemyj3z-liquidwebsites.com\/?p=18109"},"modified":"2017-10-16T20:05:41","modified_gmt":"2017-10-16T20:05:41","slug":"introduction-local-storage-javascript","status":"publish","type":"post","link":"https:\/\/javascriptforwp.com\/introduction-local-storage-javascript\/","title":{"rendered":"An Introduction to Local Storage with JavaScript"},"content":{"rendered":"<h2>Local Storage Basics<\/h2>\n<p>Local storage allows us to store JSON data about our app, site or plugin in the user\u2019s browser and access it for faster loading, custom information and offline content.<\/p>\n<p>Support for local storage comes native with the DOM and JavaScript using the following simple commands:<\/p>\n<ul>\n<li>localStorage.setItem()<\/li>\n<li>localStorage.getItem()<\/li>\n<li>localStorage.removeItem()<\/li>\n<\/ul>\n<p>It is important to remember to pass in valid JSON as well as parse the JSON back out into a native JavaScript object before you use in your app. Often folks save the parsed content as store in their apps.<\/p>\n<h2>Watch the Video<\/h2>\n<p>In this video we look at how to add, edit and delete local storage information. Follow along and see how simply you can integrate local storage into your app.<\/p>\n<p><iframe loading=\"lazy\" src=\"https:\/\/www.youtube.com\/embed\/T9GWHFDcELQ\" width=\"560\" height=\"315\" frameborder=\"0\" allowfullscreen=\"allowfullscreen\"><\/iframe><\/p>\n<h2>Taking Local Storage Further<\/h2>\n<p>In this JavaScript for WordPress Master Course we use local storage again and again when building JavaScript apps with and without WordPress.<\/p>\n<p>To learn more about working with JSON and Local Storage <a href=\"https:\/\/javascriptforwp.com\/#enroll\" target=\"_blank\" rel=\"noopener\">save a seat in the next JavaScript for WordPress Master Course enrollment period<\/a>.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Local Storage Basics Local storage allows us to store JSON data about our app, site or plugin in the user\u2019s browser and access it for faster loading, custom information and offline content. Support for local storage comes native with the DOM and JavaScript using the following simple commands: localStorage.setItem() localStorage.getItem() localStorage.removeItem() It is important to [&hellip;]<\/p>\n","protected":false},"author":4,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_bbp_topic_count":0,"_bbp_reply_count":0,"_bbp_total_topic_count":0,"_bbp_total_reply_count":0,"_bbp_voice_count":0,"_bbp_anonymous_reply_count":0,"_bbp_topic_count_hidden":0,"_bbp_reply_count_hidden":0,"_bbp_forum_subforum_count":0,"_coblocks_attr":"","_coblocks_dimensions":"","_coblocks_responsive_height":"","_coblocks_accordion_ie_support":"","footnotes":""},"categories":[135],"tags":[],"class_list":["post-18109","post","type-post","status-publish","format-standard","hentry","category-free-videos"],"acf":[],"featured_image_urls":{"full":"","thumbnail":"","medium":"","medium_large":"","large":"","1536x1536":"","2048x2048":"","course_icon":"","course_banner":"","latest-full-width":"","latest-grid-thumb":"","latest-grid-thumb-masonry":"","latest-woo-thumb":"","latest-nav-thumb":"","latest-mega-thumb":"","latest-fixed-thumb":"","latest-hero":"","latest-single":"","latest-hero-thumb":"","latest-logo":"","woocommerce_thumbnail":"","woocommerce_single":"","woocommerce_gallery_thumbnail":""},"post_excerpt_stackable":"<p>Local Storage Basics Local storage allows us to store JSON data about our app, site or plugin in the user\u2019s browser and access it for faster loading, custom information and offline content. Support for local storage comes native with the DOM and JavaScript using the following simple commands: localStorage.setItem() localStorage.getItem() localStorage.removeItem() It is important to remember to pass in valid JSON as well as parse the JSON back out into a native JavaScript object before you use in your app. Often folks save the parsed content as store in their apps. Watch the Video In this video we look at&hellip;<\/p>\n","category_list":"<a href=\"https:\/\/javascriptforwp.com\/category\/free-videos\/\" rel=\"category tag\">Free Videos<\/a>","author_info":{"name":"Zac Gordon","url":"https:\/\/javascriptforwp.com\/author\/zgordon\/"},"comments_num":"0 comments","featured_image_urls_v2":{"full":"","thumbnail":"","medium":"","medium_large":"","large":"","1536x1536":"","2048x2048":"","course_icon":"","course_banner":"","latest-full-width":"","latest-grid-thumb":"","latest-grid-thumb-masonry":"","latest-woo-thumb":"","latest-nav-thumb":"","latest-mega-thumb":"","latest-fixed-thumb":"","latest-hero":"","latest-single":"","latest-hero-thumb":"","latest-logo":"","woocommerce_thumbnail":"","woocommerce_single":"","woocommerce_gallery_thumbnail":""},"post_excerpt_stackable_v2":"<p>Local Storage Basics Local storage allows us to store JSON data about our app, site or plugin in the user\u2019s browser and access it for faster loading, custom information and offline content. Support for local storage comes native with the DOM and JavaScript using the following simple commands: localStorage.setItem() localStorage.getItem() localStorage.removeItem() It is important to remember to pass in valid JSON as well as parse the JSON back out into a native JavaScript object before you use in your app. Often folks save the parsed content as store in their apps. Watch the Video In this video we look at&hellip;<\/p>\n","category_list_v2":"<a href=\"https:\/\/javascriptforwp.com\/category\/free-videos\/\" rel=\"category tag\">Free Videos<\/a>","author_info_v2":{"name":"Zac Gordon","url":"https:\/\/javascriptforwp.com\/author\/zgordon\/"},"comments_num_v2":"0 comments","yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.9 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>An Introduction to Local Storage with JavaScript - JavaScript for WordPress<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/javascriptforwp.com\/introduction-local-storage-javascript\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"An Introduction to Local Storage with JavaScript - JavaScript for WordPress\" \/>\n<meta property=\"og:description\" content=\"Local Storage Basics Local storage allows us to store JSON data about our app, site or plugin in the user\u2019s browser and access it for faster loading, custom information and offline content. Support for local storage comes native with the DOM and JavaScript using the following simple commands: localStorage.setItem() localStorage.getItem() localStorage.removeItem() It is important to [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/javascriptforwp.com\/introduction-local-storage-javascript\/\" \/>\n<meta property=\"og:site_name\" content=\"JavaScript for WordPress\" \/>\n<meta property=\"article:published_time\" content=\"2017-01-17T20:14:28+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2017-10-16T20:05:41+00:00\" \/>\n<meta name=\"author\" content=\"Zac Gordon\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@https:\/\/twitter.com\/zgordon\" \/>\n<meta name=\"twitter:site\" content=\"@zgordon\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Zac Gordon\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"1 minute\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/javascriptforwp.com\\\/introduction-local-storage-javascript\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/javascriptforwp.com\\\/introduction-local-storage-javascript\\\/\"},\"author\":{\"name\":\"Zac Gordon\",\"@id\":\"https:\\\/\\\/javascriptforwp.com\\\/#\\\/schema\\\/person\\\/76dfb19fbd859b4a17428b8b17767b25\"},\"headline\":\"An Introduction to Local Storage with JavaScript\",\"datePublished\":\"2017-01-17T20:14:28+00:00\",\"dateModified\":\"2017-10-16T20:05:41+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/javascriptforwp.com\\\/introduction-local-storage-javascript\\\/\"},\"wordCount\":183,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\\\/\\\/javascriptforwp.com\\\/#organization\"},\"articleSection\":[\"Free Videos\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/javascriptforwp.com\\\/introduction-local-storage-javascript\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/javascriptforwp.com\\\/introduction-local-storage-javascript\\\/\",\"url\":\"https:\\\/\\\/javascriptforwp.com\\\/introduction-local-storage-javascript\\\/\",\"name\":\"An Introduction to Local Storage with JavaScript - JavaScript for WordPress\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/javascriptforwp.com\\\/#website\"},\"datePublished\":\"2017-01-17T20:14:28+00:00\",\"dateModified\":\"2017-10-16T20:05:41+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/javascriptforwp.com\\\/introduction-local-storage-javascript\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/javascriptforwp.com\\\/introduction-local-storage-javascript\\\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/javascriptforwp.com\\\/introduction-local-storage-javascript\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/javascriptforwp.com\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"An Introduction to Local Storage with JavaScript\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/javascriptforwp.com\\\/#website\",\"url\":\"https:\\\/\\\/javascriptforwp.com\\\/\",\"name\":\"JavaScript for WordPress\",\"description\":\"Tutorials, Courses, Bootcamps and Conferences\",\"publisher\":{\"@id\":\"https:\\\/\\\/javascriptforwp.com\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/javascriptforwp.com\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/javascriptforwp.com\\\/#organization\",\"name\":\"JavaScript for WordPress Master Course\",\"url\":\"https:\\\/\\\/javascriptforwp.com\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/javascriptforwp.com\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/javascriptforwp.com\\\/wp-content\\\/uploads\\\/2016\\\/03\\\/wapuu-square.png\",\"contentUrl\":\"https:\\\/\\\/javascriptforwp.com\\\/wp-content\\\/uploads\\\/2016\\\/03\\\/wapuu-square.png\",\"width\":200,\"height\":200,\"caption\":\"JavaScript for WordPress Master Course\"},\"image\":{\"@id\":\"https:\\\/\\\/javascriptforwp.com\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/x.com\\\/zgordon\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/javascriptforwp.com\\\/#\\\/schema\\\/person\\\/76dfb19fbd859b4a17428b8b17767b25\",\"name\":\"Zac Gordon\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/7935c73cce64694600738d5ed4a6e464d2ba445af9a7ba375708a815dc90b585?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/7935c73cce64694600738d5ed4a6e464d2ba445af9a7ba375708a815dc90b585?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/7935c73cce64694600738d5ed4a6e464d2ba445af9a7ba375708a815dc90b585?s=96&d=mm&r=g\",\"caption\":\"Zac Gordon\"},\"description\":\"Zac Gordon is a professional educator, with a current focus on JavaScript development with and alongside WordPress. Zac has years of experience teaching at high schools, colleges, bootcamps and online learning sites like Treehouse, Udemy and Frontend Masters.\",\"sameAs\":[\"https:\\\/\\\/twitter.com\\\/zgordon\",\"https:\\\/\\\/x.com\\\/https:\\\/\\\/twitter.com\\\/zgordon\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"An Introduction to Local Storage with JavaScript - JavaScript for WordPress","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/javascriptforwp.com\/introduction-local-storage-javascript\/","og_locale":"en_US","og_type":"article","og_title":"An Introduction to Local Storage with JavaScript - JavaScript for WordPress","og_description":"Local Storage Basics Local storage allows us to store JSON data about our app, site or plugin in the user\u2019s browser and access it for faster loading, custom information and offline content. Support for local storage comes native with the DOM and JavaScript using the following simple commands: localStorage.setItem() localStorage.getItem() localStorage.removeItem() It is important to [&hellip;]","og_url":"https:\/\/javascriptforwp.com\/introduction-local-storage-javascript\/","og_site_name":"JavaScript for WordPress","article_published_time":"2017-01-17T20:14:28+00:00","article_modified_time":"2017-10-16T20:05:41+00:00","author":"Zac Gordon","twitter_card":"summary_large_image","twitter_creator":"@https:\/\/twitter.com\/zgordon","twitter_site":"@zgordon","twitter_misc":{"Written by":"Zac Gordon","Est. reading time":"1 minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/javascriptforwp.com\/introduction-local-storage-javascript\/#article","isPartOf":{"@id":"https:\/\/javascriptforwp.com\/introduction-local-storage-javascript\/"},"author":{"name":"Zac Gordon","@id":"https:\/\/javascriptforwp.com\/#\/schema\/person\/76dfb19fbd859b4a17428b8b17767b25"},"headline":"An Introduction to Local Storage with JavaScript","datePublished":"2017-01-17T20:14:28+00:00","dateModified":"2017-10-16T20:05:41+00:00","mainEntityOfPage":{"@id":"https:\/\/javascriptforwp.com\/introduction-local-storage-javascript\/"},"wordCount":183,"commentCount":0,"publisher":{"@id":"https:\/\/javascriptforwp.com\/#organization"},"articleSection":["Free Videos"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/javascriptforwp.com\/introduction-local-storage-javascript\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/javascriptforwp.com\/introduction-local-storage-javascript\/","url":"https:\/\/javascriptforwp.com\/introduction-local-storage-javascript\/","name":"An Introduction to Local Storage with JavaScript - JavaScript for WordPress","isPartOf":{"@id":"https:\/\/javascriptforwp.com\/#website"},"datePublished":"2017-01-17T20:14:28+00:00","dateModified":"2017-10-16T20:05:41+00:00","breadcrumb":{"@id":"https:\/\/javascriptforwp.com\/introduction-local-storage-javascript\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/javascriptforwp.com\/introduction-local-storage-javascript\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/javascriptforwp.com\/introduction-local-storage-javascript\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/javascriptforwp.com\/"},{"@type":"ListItem","position":2,"name":"An Introduction to Local Storage with JavaScript"}]},{"@type":"WebSite","@id":"https:\/\/javascriptforwp.com\/#website","url":"https:\/\/javascriptforwp.com\/","name":"JavaScript for WordPress","description":"Tutorials, Courses, Bootcamps and Conferences","publisher":{"@id":"https:\/\/javascriptforwp.com\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/javascriptforwp.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/javascriptforwp.com\/#organization","name":"JavaScript for WordPress Master Course","url":"https:\/\/javascriptforwp.com\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/javascriptforwp.com\/#\/schema\/logo\/image\/","url":"https:\/\/javascriptforwp.com\/wp-content\/uploads\/2016\/03\/wapuu-square.png","contentUrl":"https:\/\/javascriptforwp.com\/wp-content\/uploads\/2016\/03\/wapuu-square.png","width":200,"height":200,"caption":"JavaScript for WordPress Master Course"},"image":{"@id":"https:\/\/javascriptforwp.com\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/x.com\/zgordon"]},{"@type":"Person","@id":"https:\/\/javascriptforwp.com\/#\/schema\/person\/76dfb19fbd859b4a17428b8b17767b25","name":"Zac Gordon","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/secure.gravatar.com\/avatar\/7935c73cce64694600738d5ed4a6e464d2ba445af9a7ba375708a815dc90b585?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/7935c73cce64694600738d5ed4a6e464d2ba445af9a7ba375708a815dc90b585?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/7935c73cce64694600738d5ed4a6e464d2ba445af9a7ba375708a815dc90b585?s=96&d=mm&r=g","caption":"Zac Gordon"},"description":"Zac Gordon is a professional educator, with a current focus on JavaScript development with and alongside WordPress. Zac has years of experience teaching at high schools, colleges, bootcamps and online learning sites like Treehouse, Udemy and Frontend Masters.","sameAs":["https:\/\/twitter.com\/zgordon","https:\/\/x.com\/https:\/\/twitter.com\/zgordon"]}]}},"_links":{"self":[{"href":"https:\/\/javascriptforwp.com\/wp-json\/wp\/v2\/posts\/18109","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/javascriptforwp.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/javascriptforwp.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/javascriptforwp.com\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/javascriptforwp.com\/wp-json\/wp\/v2\/comments?post=18109"}],"version-history":[{"count":0,"href":"https:\/\/javascriptforwp.com\/wp-json\/wp\/v2\/posts\/18109\/revisions"}],"wp:attachment":[{"href":"https:\/\/javascriptforwp.com\/wp-json\/wp\/v2\/media?parent=18109"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/javascriptforwp.com\/wp-json\/wp\/v2\/categories?post=18109"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/javascriptforwp.com\/wp-json\/wp\/v2\/tags?post=18109"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}