Skip to content

README.md

Latest commit

 

History

History
116 lines (88 loc) · 6.04 KB

README.md

File metadata and controls

116 lines (88 loc) · 6.04 KB
layout default
title AFFiNE Tutorial
nav_order 192
has_children true
format_version v2

AFFiNE Tutorial: Open-Source AI Workspace with Docs, Whiteboards, and Databases

Learn how to use toeverything/AFFiNE to build, extend, and self-host a modern knowledge workspace combining documents, whiteboards, and databases — powered by BlockSuite, CRDT-based collaboration, and integrated AI copilot features.

GitHub Repo License Latest Release

Why This Track Matters

AFFiNE is one of the most ambitious open-source alternatives to Notion and Miro, combining document editing, whiteboard canvases, and structured databases into a single workspace. With approximately 66,000 GitHub stars, it represents a significant shift in how developers think about collaborative knowledge tools.

This track is particularly relevant for developers who:

  • want to understand how modern block-based editors are architected with BlockSuite
  • need to learn CRDT-based real-time collaboration patterns using yjs and OctoBase
  • are building AI-augmented productivity tools and want to study copilot integration patterns
  • plan to self-host a Notion-like workspace with full data ownership and extensibility

This track focuses on:

  • understanding the BlockSuite framework and its block-tree content model
  • mastering the dual page/edgeless editing modes and their underlying data structures
  • learning CRDT synchronization with yjs for conflict-free real-time collaboration
  • integrating AI copilot features into document and whiteboard workflows
  • building custom blocks and plugins to extend the workspace
  • deploying and operating self-hosted AFFiNE instances in production

Current Snapshot (auto-updated)

Mental Model

flowchart LR
    A[Knowledge need] --> B[Workspace creation]
    B --> C[Block-based content authoring]
    C --> D[Page and edgeless modes]
    D --> E[CRDT sync and collaboration]
    E --> F[AI copilot augmentation]
    F --> G[Database views and organization]
    G --> H[Plugin extension and deployment]
Loading

Chapter Guide

Chapter Key Question Outcome
01 - Getting Started How do I set up AFFiNE locally and create my first workspace? Working dev environment and first workspace
02 - System Architecture How does BlockSuite, OctoBase, and yjs fit together? Clear mental model of the full stack
03 - Block System How do blocks, pages, and edgeless canvases work? Understanding of the content model
04 - Collaborative Editing How does real-time CRDT sync and conflict resolution work? Ability to reason about collaboration
05 - AI Copilot How are AI features integrated into the workspace? Understanding of copilot architecture
06 - Database and Views How do database blocks, kanban, and table views work? Ability to build structured data workflows
07 - Plugin System How do I extend AFFiNE with custom blocks and plugins? Plugin development readiness
08 - Self-Hosting and Deployment How do I deploy and operate AFFiNE in production? Production deployment baseline

What You Will Learn

  • how AFFiNE's BlockSuite framework organizes content into a composable block tree
  • how page mode and edgeless (whiteboard) mode share the same underlying data model
  • how yjs CRDTs enable real-time conflict-free collaboration across clients
  • how the AI copilot integrates with blocks for writing assistance, summarization, and generation
  • how database blocks support table, kanban, and filtered views within documents
  • how to build custom blocks and plugins using AFFiNE's extension architecture
  • how to self-host AFFiNE with Docker and configure storage backends

Source References

Related Tutorials

  • LobeChat Tutorial — AI chat framework with plugin architecture and multi-model support
  • Dify Tutorial — LLM app development platform with visual workflow orchestration
  • SiYuan Tutorial — Local-first personal knowledge management system

Start with Chapter 1: Getting Started.

Navigation & Backlinks

Full Chapter Map

  1. Chapter 1: Getting Started
  2. Chapter 2: System Architecture
  3. Chapter 3: Block System
  4. Chapter 4: Collaborative Editing
  5. Chapter 5: AI Copilot
  6. Chapter 6: Database and Views
  7. Chapter 7: Plugin System
  8. Chapter 8: Self-Hosting and Deployment

Generated by AI Codebase Knowledge Builder