21-localstorage-editable-todos.html

<html>
<head>
  <meta charset="utf-8">
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha.6/css/bootstrap.css">
</head>
<body>
  <script src="elm.js"></script>
  <script>
    var isArrayOfStrings = function(array) {
      return Array.isArray(array) && array.every(function(element) {
        return typeof element === 'string';
      });
    };
    
    var getTodos = function() {
      var todos = JSON.parse(localStorage.todos || '[]') || [];
      return isArrayOfStrings(todos) ? todos : [];
    };
    
    var app = Elm.Main.fullscreen({
      todos: getTodos()
    });
    
    app.ports.saveTodos.subscribe(function(todos) {
      localStorage.todos = JSON.stringify(todos);
    });
  </script>
</body>
</html>