DocFlow

KO | EN

gitlite — search

#hacktoberfest #react #typescript #android #machine-learning #deep-learning #linux #docker #nodejs #cli #kubernetes #vue #pytorch #open-source

(★ 1,305)

DocFlow is an AI-powered documentation platform built with Tiptap and Next.js, designed for real-time collaboration ⚡, smart writing assistance 🤖, and a flexible plugin system 🔌.

DocFlow 최신버젼 다운로드

최종 버전 다운로드 (.zip)

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

## 📖 简介

**DocFlow** 是一款面向团队协作的块级文档编辑器。它融合了 Notion 的灵活性与飞书的协作能力，通过块级内容架构、实时协同编辑和 AI 辅助功能,帮助团队高效完成文档创作与知识管理。

我们希望通过技术手段减少协作摩擦,让文档编辑更接近团队的真实工作流。无论是产品规划文档、技术方案设计,还是会议记录整理,DocFlow 都能提供流畅的创作体验。

### ✨ 核心特性

DocFlow 参考了 Notion 与飞书的设计理念,将内容以块为单位进行组织。每个块都是独立的编辑单元,可以灵活组合与调整,同时支持实时协作与 AI 辅助。

- 🧱 块级编辑器:支持文本、标题、列表、代码块、表格、图片、视频等 20+ 种内容类型,通过拖拽即可调整块级元素的顺序与层级关系。

- ⚡ 实时协作:基于 Yjs CRDT 算法实现多人同步编辑,自动处理编辑冲突。支持实时光标跟踪、成员在线状态与历史版本回溯。

- 🤖 AI 功能:内置 AI 助手,支持头脑风暴、内容润色、文档续写与智能问答。可根据上下文生成结构化内容建议。

## 技术选型

DocFlow 采用全栈 TypeScript 架构,前端基于 Next.js 构建,后端使用 NestJS 框架。通过统一的类型系统和现代化的工程实践,保证了代码质量与开发效率。

### 🎨 前端架构 (Client-side)

#### **Next.js**

项目基于 Next.js App Router 架构,利用 React Server Components 优化首屏渲染性能。通过 Server Actions 实现前后端通信,确保类型安全的同时简化了数据流转。

#### **Tiptap**

编辑器核心采用 Tiptap 框架,基于 ProseMirror 构建。通过扩展机制实现了丰富的块级编辑能力,支持自定义节点与快捷命令,为用户提供接近 Notion 的编辑体验。

#### **Yjs**

协作功能基于 Yjs CRDT 算法实现,能够自动处理多人编辑时的冲突,保证数据最终一致性。配合 Awareness 模块,实现了实时光标追踪与在线状态同步。

### ⚙️ 后端架构 (Server-side)

#### **NestJS & Prisma**

后端使用 NestJS 模块化框架,通过依赖注入实现业务逻辑解耦。Prisma ORM 提供类型安全的数据访问层,支持高效的数据库查询与迁移管理。

#### **Hocuspocus**

Hocuspocus 作为 Yjs 的 WebSocket 服务端,负责协调文档协作会话,处理客户端连接与数据同步。通过拦截器机制实现权限控制与数据持久化。

#### **Prometheus & Grafana**

集成 Prometheus 进行指标采集,通过 Grafana 可视化展示系统运行状态。监控包括 API 响应时间、数据库查询性能、WebSocket 连接数等核心指标。

![20260203091658](https://raw.githubusercontent.com/xun082/md/main/blogs.images20260203091658.png)

Grafana 监控面板实时展示系统各项性能指标,包括请求量、响应时间、错误率等关键数据,帮助快速定位性能瓶颈。

#### **ELK Stack (Elasticsearch & Kibana)**

使用 Elasticsearch 存储和检索日志数据,Kibana 提供日志分析与可视化能力。支持全文搜索、日志聚合与异常检测,便于问题排查与系统审计。

![日志分析系统](https://raw.githubusercontent.com/xun082/md/main/blogs.images20260202215636.png)

Kibana 日志分析界面,支持按时间、日志级别、服务模块等维度查询和过滤日志,提供结构化的问题排查路径。

#### **MinIO & RabbitMQ**

MinIO 提供对象存储服务,用于存储用户上传的图片、视频等文件。RabbitMQ 作为消息队列,处理异步任务如图片压缩、邮件发送等,避免阻塞主业务流程。

## 功能介绍

DocFlow 将 AI 能力集成到编辑器中,通过理解文档上下文来辅助内容创作。AI 不是简单的文本生成工具,而是能够理解语义、提供决策建议的智能助手。

### AI 头脑风暴

当你有一个初步想法但不知如何展开时,AI 头脑风暴可以帮助拓展思路。输入核心概念后,AI 会从不同角度生成 3-6 个结构化方案,每个方案都包含具体的实施思路。

![AI 头脑风暴输入界面](https://raw.githubusercontent.com/xun082/md/main/blogs.images20260202220119.png)

在编辑器中输入头脑风暴主题,AI 会基于输入内容理解你的需求场景。

![AI 头脑风暴结果展示](https://raw.githubusercontent.com/xun082/md/main/blogs.images20260203083750.png)

AI 生成的多个方案以卡片形式展示,每个方案都有清晰的标题和详细说明。你可以选择任意方案插入到文档中,或者继续优化调整。

这不只是简单的内容生成,AI 会根据上下文理解你的意图。无论是产品功能设计、内容分类规划,还是业务流程优化,AI 都能提供可行的思路参考,帮助快速决策。

### AI 文本润色

![AI 文本润色功能](https://raw.githubusercontent.com/xun082/md/main/blogs.images00678182cd1c5f6cb138664cc55d2535.png)

选中需要优化的文本段落,AI 会分析文本结构与表达方式,提供更清晰、更专业的改写建议。支持调整语气风格,如正式、简洁、友好等。

### AI 续写

AI 续写功能会根据前文内容自然延续写作。当前文内容较长时,系统通过 RAG (检索增强生成) 技术,从文档中检索相关段落,确保续写内容与上下文保持逻辑一致,避免偏离主题。

![AI 续写功能演示](https://raw.githubusercontent.com/xun082/md/main/blogs.images2a7f0843ebff13293d011d35771faabc.png)

AI 续写时会参考前文的写作风格、用词习惯和逻辑结构,生成连贯自然的后续内容。你可以继续编辑生成的文本,或者重新生成。

### AI 聊天

目前 AI 聊天功能作为独立页面存在,后续会集成到编辑器侧边栏,与文档内容深度关联。未来计划实现 Agent 模式,类似 Cursor 那样能够自动编辑文档内容。

![7a8ba58a4ab3b592bb7fae1b45634648](https://raw.githubusercontent.com/xun082/md/main/blogs.images7a8ba58a4ab3b592bb7fae1b45634648.png)

### 协同编辑

![多人协同编辑](https://raw.githubusercontent.com/xun082/md/main/blogs.images20260202215332.png)

多人同时编辑时,每个用户都有独立的光标颜色标识。文档修改实时同步,冲突自动合并。右侧显示当前在线成员列表与他们的编辑位置。

## 未来计划

DocFlow 将持续优化协作体验与 AI 能力,同时加强工程化建设,提升系统可扩展性。

### 🏗️ 工程化体系深度重构

- **迈向 Monorepo 架构**:计划基于 pnpm workspaces 和 Turborepo 将项目重构为 Monorepo。前后端代码分离,共享类型定义与工具函数,提升代码复用率与构建效率。

- **组件库与插件生态开放**:将 Tiptap 自定义扩展(如代码沙箱、交互式图表等)提取为独立 npm 包,开放给社区使用。同时建立插件开发规范,支持第三方开发者扩展编辑器能力。

### 🎙️ 多维协同体验升级

- **集成 LiveKit 实时音视频**:在文档协作场景中引入实时音视频通话。团队成员可以边看文档边讨论,提升复杂决策场景下的沟通效率。

![LiveKit 集成方案](https://raw.githubusercontent.com/xun082/md/main/blogs.images28a512b45c0bfc4a4ff679e9fbb1d031.jpg)

- **实时群聊系统**:在文档侧边栏集成实时聊天功能,支持针对文档内容发起讨论。消息可以关联到具体的文档块,形成完整的协作反馈闭环。

### 🤖 智能内核的跨越式进化

- **基于 RAG 的私有知识库**:引入 RAG (Retrieval-Augmented Generation) 技术,让 AI 能够检索用户的历史文档。AI 回答问题时会参考团队沉淀的知识资产,提供更精准的决策支持。

- **从 Copilot 迈向 Agent**:探索 AI Agent 在文档场景的应用。未来 AI 将能够自主执行任务,例如从会议纪要中提取待办事项,自动同步到第三方工具,实现从辅助创作到自动化办公的升级。

## 🚀 快速开始

### 环境要求

- **Node.js** >= 24
- **pnpm** >= 10.28.2

### 本地开发

1. **克隆仓库**

```bash
git clone https://github.com/xun082/DocFlow.git
cd DocFlow
```

2. **安装依赖**

```bash
pnpm install
```

3. **启动开发服务器**

```bash
pnpm dev
```

4. **打开浏览器访问**

```
http://localhost:3000
```

## 🐳 Docker 部署

### 方式一:使用 Docker Compose(推荐)

```bash
# 使用预构建镜像
docker-compose up -d

# 访问应用
http://localhost:3000
```

### 方式二:手动构建

1. **构建镜像**

```bash
docker build -t docflow:latest .
```

2. **运行容器**

```bash
docker run -d \
  --name docflow \
  -p 3000:3000 \
  -e NODE_ENV=production \
  docflow:latest
```

3. **访问应用**

```
http://localhost:3000
```

### 健康检查

容器内置健康检查端点:

```bash
curl http://localhost:3000/api/health
```

## 🤝 贡献指南

欢迎提交 Issue 和 Pull Request!

在提交代码前,请确保:

- 运行 `pnpm type-check` 通过类型检查

- 运行 `pnpm lint` 通过代码检查

- 运行 `pnpm format` 格式化代码

- 遵循项目的代码规范和提交规范

详见 [CONTRIBUTING.md](https://github.com/xun082/DocFlow/blob/main/CONTRIBUTING.md)

## 📬 联系方式

- **问题反馈**:[GitHub Issues](https://github.com/xun082/DocFlow/issues)

- **功能建议**:[GitHub Discussions](https://github.com/xun082/DocFlow/discussions)

- **微信交流**:`yunmz777`

DocFlow

DocFlow 최신버젼 다운로드

오늘의 추천 프로젝트

Was this content helpful?

Recent Feedback

DocFlow

DocFlow 최신버젼 다운로드

오늘의 추천 프로젝트

Was this content helpful?

Recent Feedback

Download README