Project 24, PWA and offline
Local Markdown Editor
Open a .md file from your computer, edit it with a live preview, and press Ctrl+S to save it back to the same file. No upload, no account.
- Main API
- File System Access
- Fallback
- Download and upload
- Dependencies
- None
- Your browser
- Checking
Editor
untitled.md
How it works
- Get a file handleThe picker returns a handle to the real file. The page keeps it so later saves need no dialog.
- Render as you typeEach keystroke runs the parser, which escapes HTML first and then adds Markdown formatting.
- Write backhandle.createWritable() streams the new text into the same file on disk.
// Open a real file and keep its handle
const [handle] = await showOpenFilePicker({
types: [{ description: "Markdown", accept: { "text/markdown": [".md"] } }],
});
editor.value = await (await handle.getFile()).text();
// Later: save back to the same file, no dialog
const writable = await handle.createWritable();
await writable.write(editor.value);
await writable.close();