Eric Hepperle Designs Tutorial: Demonstrates basic usage for HTML5 localStorage using ES6 JavaScript.

ehd-tutorial-html5-localstorage.js

/*
Program Name:   Console: Tutorial Code - HTML5 Local Storage (Simple Example)
File Name:      ehCode_2018.06.26_JavaScriptES6_Demo_HTML5LocalStorage_01.js
Date Created:   06/26/18
Date Modified:  --
Version:        1.0
Programmer:     Eric Hepperle

Purpose: Uses vanilla ES6 JavaScript to demonstrate HTML5 Local Storage. 
	
Outputs:
N/A
	
Usage: In a browser console copy-paste the code below
	into the console and hit "Enter" to run.

Sample results: 
N/A

Requires: 
* Browser console.
* Basic knowledge of vanilla JavaScript
	
Demonstrates:
- ES6
- Vanilla JavaScript
- Array Mapping
- HTML5 (advanced)
- Local Storage

*/

/* global $ */
/*jshint esversion: 6 */

console.clear();

localStorage.clear();

// Declare arrays
var people = [
    "Juan", "Julia", "Paulo", "Francisco", "Xiao", "Tran", "Amy"
];

var countries = [
    "Colombia", "USA", "Brazil", "Spain", "China", "Vietnam", "USA"
];

console.log("%c                                           ", "background:orange");

// Loop through people and store key-value pairs in local storage
for (var j = 0; j < people.length; ++j) {
    
    var key = people[j];
    console.log("person" + j + ": " + key);
 
    var value = countries[j];
    console.log("country" + j + ": " + value);

    localStorage.setItem(key, value);
    
}

console.log("%c               RESULTS                    ", "background:pink");


// Get all key-value pairs from local storage
for (var i = 0; i < localStorage.length; ++i) {
    
    var key = localStorage.key(i);
    var item = localStorage.getItem(key);
    console.log(key + " => " + item);
    
}

/*

NOTES:

    06/26/18 - Created file as part of video tutorial.	
			 
*/