Skriuw Documentation
Development

Development features

The feature- and domain-sliced architecture, a walkthrough of each feature and domain in the codebase.

Skriuw's code is organized as feature slices under apps/web/src/features/. Each folder owns its own components, hooks, and lib code for one domain, and talks to storage through the shared WorkspaceBackend adapter described in Architecture rather than reaching into another feature's internals.

DomainWhat it owns
notesRich text and Markdown editing, wiki-style note links, backlinks, folders, and version history.
journalCalendar-based daily entries with moods, tags, autosave, and quick date navigation.
editorThe BlockNote-based block editor shared by notes and journal, plus custom block specs (diagram, code, drawing, etc.) and the note-wide freehand annotation overlay.
tagsThe #tag chip system, tag detection in content, and the /app/tags overview and insights pages.
peopleThe $person mention system, the reusable Person entity, and the /app/people graph view.
collaborationReal-time multiplayer editing via Yjs, backed by a y-partyserver instance on Cloudflare.
sharingFrozen note snapshots for external viewers, with optional passwords, expiry, and view-once access.
aiBYOK AI actions (title generation, spell check, continue-writing, and others), routed through a single callAi entry point on both web and desktop.
diagramThe Mermaid-backed diagram block, including the visual React Flow builder for editing diagrams without writing Mermaid syntax.
authSign-in/sign-up via the @remcostoeten/auth-drawer package, backed by Better Auth.
adminInternal admin guards, seed scripts, and moderation tooling.
onboardingThe one-time welcome walkthrough and code-defined starter content bundle for new accounts.
settingsUser preferences: themes, typography, editor behavior, AI provider keys, and account actions.
notificationsIn-app notification center and delivery hooks.
activityRecent-activity feeds surfaced across the workspace.
layoutShell-level structure: sidebar, panes, tabs, and split-view chrome shared across features.
quick-accessThe command palette / quick-open surface for jumping to notes and actions by keyboard.
desktopDesktop-only chrome: the about dialog, AI settings section, quit shortcut, and index sync with the Tauri backend.
dev-toolsThe in-app dev menu used during development, gated out of production builds.
marketingSEO-oriented marketing pages served from the web app.

New features should follow this same shape: a folder under features/, storage access through WorkspaceBackend (never a direct Prisma or Tauri call from feature code), and capability checks via useWorkspaceCapabilities() for anything a backend might not support.

Beyond apps/web/src/features/

This table covers UI feature slices inside the web app. Two other surfaces are full apps in their own right and aren't feature folders:

  • apps/desktop - the native Tauri shell (Rust src-tauri, packaging, capabilities). The desktop row above is only the desktop-specific chrome rendered inside the web/SPA bundle; the actual native app lives here. See Architecture for its storage model.
  • apps/extension - the Chrome web clipper. See Web clipper extension.

On this page