Affine Project Structure

The open-source workspace for docs, whiteboards, and databases. A local-first application using Rust for CRDTs and React for the UI.

Updated 2025-12-30

#affine #rust #react #nestjs #crdt #local-first #monorepo

PNG PDF

Project Directory

AFFiNE/

packages/

Main Application

frontend/

React Client (Vite)

core/

Core UI logic

electron/

Desktop wrapper

backend/

Server & Native modules

server/

NestJS API Server

native/

Rust bindings

blocksuite/

Editor Engine (Separate Workspace)

framework/

Block framework

blocks/

Standard blocks

Cargo.toml

Rust workspace

package.json

Yarn workspace

Repository Info

Repository-toeverything/AFFiNE
Stars-35k+
License-MIT
Last Analyzed-December 2025

Tech Stack

Frontend-React + Vite
Backend-Node.js (NestJS)
Core Logic-Rust (CRDTs)
Editor-BlockSuite (Custom)
Database-PostgreSQL + Prisma

Architecture Notes

Affine is a 'Local-First' application. The frontend uses a custom editor engine called **BlockSuite**. State is managed using CRDTs (Yjs/Octobase) implemented in **Rust** for performance. The backend (packages/backend/server) is a **NestJS** application that handles sync, auth, and cloud storage, but the app can function offline.

Key Directories

blocksuite/-A standalone project within the repo. It's the block-based editor engine that powers Affine's docs and whiteboards.
packages/backend/native/-Contains the Rust code for high-performance operations, particularly CRDT merging and conflict resolution.
packages/frontend/-The React application. It treats the local database (IndexedDB via Yjs) as the source of truth.

Why This Structure?

Affine represents the bleeding edge of 'Local-First' web development. It shows how to use Rust to turbocharge a React app and how to build a complex, collaborative editor from scratch.

Share this template