What is xNet?

In this article

• What xNet is and what problem it solves
• The core mental model: three hooks, zero backend
• When to use xNet (and when not to)

The problem

Building a modern collaborative app requires assembling a stack of 6+ services: a database, an API layer, auth, real-time sync, file storage, and deployment infrastructure. Each comes with its own SDK, its own data model, and its own failure modes.

Most of this infrastructure exists to solve one problem: getting data from one device to another. xNet eliminates that problem entirely.

What xNet does

xNet is a local-first framework for React. Your data lives on the user’s device. It syncs peer-to-peer via WebRTC. There is no server, no API, no database to manage.

You interact with xNet through three hooks:

Hook	Purpose
useQuery	Read data reactively. Filter, sort, paginate.
useMutate	Create, update, delete with full type safety.
useNode	Open a single node for collaborative editing with Yjs.

That’s the entire API surface for most apps. Define a schema, use the hooks, and your app works offline, syncs in real-time, and never touches a server.

The architecture in 30 seconds

Your React App
  └── useQuery / useMutate / useNode
        └── NodeStore (schema-validated, type-safe)
              ├── IndexedDB (browser) / SQLite (desktop)
              └── P2P Sync (WebRTC via signaling server)
                    └── Yjs CRDT (rich text) + Lamport LWW (structured data)

Everything below the hooks is invisible to you. You write React components. xNet handles storage, sync, conflict resolution, and cryptographic signing.

When to use xNet

Good fit:

• Productivity apps (notes, tasks, databases, wikis)
• Collaborative tools (documents, whiteboards, spreadsheets)
• Personal tools (journals, habit trackers, budgets)
• Internal tools where you control the client
• Apps where data ownership and privacy matter

Not a good fit (yet):

• Apps that need a centralized server of record (banking, e-commerce)
• Apps with millions of users sharing a single dataset
• Apps that need server-side rendering of user data
• Apps that need complex server-side business logic

What’s in the box

xNet is a monorepo of focused packages:

Package	Purpose
@xnet/react	React hooks and XNetProvider
@xnet/data	Schema system, NodeStore, 16 property types
@xnet/sync	Lamport clocks, Change<T>, Yjs security
@xnet/crypto	BLAKE3 hashing, Ed25519 signing, XChaCha20 encryption
@xnet/identity	DID:key identifiers, UCAN tokens
@xnet/storage	IndexedDB adapter
@xnet/canvas	Infinite canvas with spatial indexing
@xnet/editor	TipTap rich text editor
@xnet/devtools	7 debug panels

For most apps, you only install @xnet/react and @xnet/data. Everything else is pulled in as needed.

Next steps

Quick Start Build your first xNet app in 5 minutes.

Core Concepts Understand the mental model behind xNet.