index.html

<!doctype html>
<html>
    <head>
        <link href="https://fonts.googleapis.com/css?family=Chilanka&display=swap" rel="stylesheet">
        <link rel="stylesheet" href="style.css">
        <h1 style= "font-family: 'Chilanka', cursive;">Micro Note</h1>
    </head>

<body style= "font-family: 'Chilanka', cursive;">
    <!-- This is a comment -->

    <div id="note" contenteditable> </div>

    <script src="https://unpkg.com/filer/dist/filer.min.js"></script>
    <script>
    const fs = new Filer.FileSystem();

        window.addEventListener('DOMContentLoaded', (event) => {
            console.log('DOM fully loaded and parsed');
            fs.readFile('/note', 'utf8', function(err, data) {
                if (err) {
                    document.querySelector('#note').innerHTML = "Welcome to my notepad!";
                }
                
                if (data) {
                    document.querySelector('#note').innerHTML = data;
                }
            });
        });

        window.setInterval(noteSave, 300, "Save Completed");

        function noteSave(verification) {
            fs.writeFile('/note', document.querySelector('#note').innerHTML);
            console.log(verification);
        }
    </script>
</body>

</html>