What is Linen?

I was drowning in .md files. Between homelab documentation, code notes, and random thoughts, I had markdown files scattered across every drive. Notepad++ and VS Code worked fine for single files, but neither felt like a real writing environment for markdown. Obsidian was nice but way too heavy for what I wanted, and I'd have to install Electron just to edit text. That felt wrong.

So I built Linen. It's a sub-10MB desktop app (Tauri 2.0 + React) that does exactly what I need: multi-tab editing, real-time split preview, Mermaid diagram rendering, KaTeX math, and a WYSIWYG toggle when I get tired of staring at raw markdown. No Electron, no 200MB install, no plugin marketplace I'll never use.

How I Built It

Tauri handles the desktop-native stuff: file system access, native dialogs, window management, and the splashscreen. The frontend is React 19 with Zustand for state, each tab gets its own content buffer, dirty flag, and file path. Session persistence uses Tauri's filesystem plugin with a localStorage fallback so you don't lose work if the app crashes.

One thing I'm weirdly proud of is the splashscreen flow. Tauri doesn't have a built-in splashscreen API like Electron, so I wired it up manually: Tauri opens a lightweight splashscreen window at startup, React hydrates in the background, and once the main window is ready, the React side calls a Tauri command that closes the splashscreen and reveals the real window. It's only ~30 lines but it makes the app feel polished instead of janky.

#[tauri::command]
async fn close_splashscreen(window: tauri::Window) {
  // Close splashscreen
  if let Some(splashscreen) = window.get_webview_window("splashscreen") {
    let _ = splashscreen.close();
  }
  // Show main window
  if let Some(main) = window.get_webview_window("main") {
    let _ = main.maximize();
    let _ = main.show();
    let _ = main.set_focus();
  }
}

The editor panel uses CodeMirror 6 with language extensions for 15+ languages. The WYSIWYG mode runs on Tiptap (ProseMirror) with a bidirectional markdown bridge, you can flip between source and rich-text without losing anything. The preview pane uses marked.js with custom extensions for KaTeX math, footnotes, subscripts, and superscripts, plus highlight.js for code blocks and Mermaid for diagrams. Find-and-replace works across all three view modes with DOM-based result highlighting. Export to HTML or PDF via html2pdf.js.

What I Learned

Tauri 2.0 is genuinely pleasant to work with once you accept that some things Electron gives you for free you'll have to build yourself. The splashscreen was one, drag-and-drop file handling was another, I had to wire up Tauri's drag-drop events manually and handle edge cases like duplicate file drops and non-markdown files. The bidirectional scroll sync between CodeMirror and the preview pane was trickier than expected too, especially in WYSIWYG mode where content length changes unpredictably. But the binary came out under 10MB and starts up instantly, which makes all the extra wiring worth it.