Why does this even need a server?
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Note App</title>
<style>
body { font-family: Arial, sans-serif; margin: 0; padding: 20px; }
textarea { width: 100%; height: 80vh; padding: 10px; font-size: 16px; border: 1px solid #ccc; border-radius: 5px; box-sizing: border-box; }
</style>
</head>
<body>
<textarea id="textarea" placeholder="Write your notes here..." autofocus></textarea>
<script>
document.addEventListener('DOMContentLoaded', function() {
const textarea = document.getElementById('textarea');
const loadValue = () => {
const hash = window.location.hash;
try {
const value = hash ? decodeURIComponent(atob(hash.substring(1))) : '';
textarea.value = value;
textarea.selectionStart = value.length;
} catch (e) {
console.error('Error decoding hash:', e);
textarea.value = '';
}
};
const storeValue = (value) => window.location.hash = '#' + btoa(encodeURIComponent(value));
textarea.addEventListener('input', () => storeValue(textarea.value), false);
window.addEventListener('hashchange', loadValue);
loadValue();
});
</script>
</body>
</html>