What you’ll build
A Markdown app for your own files: a split view with the source on the left and a live preview on the right, open and save straight to disk, light and dark themes, word counts and HTML export. Add an AI assistant for drafting, rewriting and tidying, and optionally let your AI agents read the same folder through MCP.
Drew built a version of this as a zero-dependency, single HTML file that opens in a chromeless browser window, so it feels like a desktop app with nothing to install. That’s the fastest path; a Tauri or Electron wrapper comes later if you need it.
Architecture and data flow
- Editor pane (a textarea or a code-editor component) holds the Markdown text.
- Parser converts Markdown to HTML on every change; the preview renders that HTML after sanitizing it.
- File layer opens and saves
.mdfiles. In the browser, the File System API lets Chromium-based browsers read and write a file the user picks. In a desktop wrapper, the app reads and writes through the wrapper’s file APIs. - AI assist (optional) sends the selected text plus an instruction to a model you choose and shows the suggestion as a diff you accept or reject. Nothing is sent unless you ask.
- MCP hook (optional) exposes your notes folder to agents through an MCP server, read-only by default.
Components and why
| Component | Options | Why |
|---|---|---|
| Shell | Single HTML file → Tauri → Electron | Start with zero install; Tauri gives a small native app with a Rust core; Electron bundles Chromium and Node |
| Markdown | A CommonMark/GFM-compliant parser | Predictable output; GFM adds tables and task lists |
| Files | File System API (browser) or desktop file APIs | Your files stay on your disk, not in someone’s cloud |
| AI assist | Any model API you already pay for | Bring your own model and key; keep it optional |
| Version history | Git + GitHub | Every edit is recoverable and reviewable |
Step outline
- Create a GitHub repository and write a one-page spec: features, keyboard shortcuts, what “done” means.
- Ask your coding agent for a single-file prototype: editor, live preview, open/save with Ctrl+O and Ctrl+S, themes.
- Test the parser before you trust it. Drew’s note from his build: check headings, bold and italic, nested lists, task lists, tables, fenced code, links and images, plus edge cases such as an asterisk inside backticks staying literal. Keep these as automated tests.
- Guard against empty input. In IonBin’s founder’s build, an unclosed code fence crashed the preview until the escaping function coerced null and undefined to an empty string. Ask the agent to add a test for it.
- Sanitize the preview HTML so a pasted script can’t run.
- Add AI assist behind a button, with the model and key in settings and a clear “sent to provider” notice.
- Wrap it as a desktop app with Tauri or Electron if you need menus, file associations or auto-update.
- Optional MCP: expose the notes folder read-only to your agents, then add write tools with confirmation.
AI platforms that help
Any of the four coding agents can build this from a clear spec. Keep the code in a GitHub repository from day one so every agent change arrives as a reviewable diff.
| Platform | Where it helps most |
|---|---|
| Cursor | Building the UI with the agent in the editor, then checking it in the built-in browser tool |
| OpenAI Codex | Handing off well-specified pieces (parser tests, packaging) to run in the background |
| Claude Code | Terminal-first scaffolding, refactors and writing the test suite |
| Google Antigravity | Running parallel agents on separate parts (UI, storage, packaging) |
Costs
- The editor itself costs nothing to run locally.
- AI assist is billed by your model provider per use. To verify: current per-token prices on your provider’s pricing page.
- Desktop distribution may need a code-signing certificate. To verify for your platforms.
Risks
- Data loss: test save-in-place carefully; write to a temporary file and then replace, and keep Git history.
- Script injection through the preview if HTML isn’t sanitized.
- Privacy: any text sent to an AI provider leaves your machine; make it opt-in and visible.
- Browser support: save-in-place depends on the browser; check before you rely on it.
Sources
Official docs and specifications are listed below. Practitioner notes come from Drew’s own build log, shared without private details.