智能文档与协同写作

思路落在这里
一起写完同一份稿

左侧树形文档、中间 TipTap 富文本、可拖拽分栏的工作台;多人通过 Yjs + Hocuspocus 实时同步光标与内容,IndexedDB 在本地兜底;选中段落即可唤出 AI 菜单,侧边栏对话支持一键插入正文。登录后回收站、收藏、搜索与「我的分享」都在同一套界面里。

落地功能

代码里已经接好的能力

下列条目与当前仓库行为一致;若某能力「没反应」,请到环境变量里核对协同地址、AI Key、OSS 等是否已配置。

文档管理

文档树支持拖动排序与层级;正文有字数上限与导出 PDF;新建文档可套用模板,空文档会提示插入模板块。

多人协同

同一文档可多人编辑,每位协作者有随机分配的颜色光标;WebSocket 协同服务需单独部署并在环境变量中填写地址与 Token 逻辑。

AI 辅助

AI 支持续写、润色、翻译等划词操作;侧边对话保留多轮上下文(最近若干轮),回复可插入或替换选区,用量在站内可查。

分享与权限

可把文档分享给指定用户并区分只读/读写,单文档分享人数有上限;支持邮件通知与生成对外可读链接(公开发布列表独立维护)。

账号与偏好

登录后维护个人资料;全站中英文与明暗主题即时切换;工作台仅面向桌面宽屏设计,移动端会提示换用 PC 浏览器。

三步开启高效协作

简单流程,即刻上手

1

注册登录

支持 GitHub 一键登录或邮箱魔法链接,无需密码

2

创建文档

使用富文本编辑器,AI 辅助写作,让创作更轻松

3

分享协作

邀请团队成员实时协同编辑,共同完成每一份文档

从界面到存储

这条产品链路里有什么

下面是站点真实用到的能力分层说明:先讲你在界面里能摸到的部分,再对应到仓库里的技术选型(以 package.json 与 .env 为准)。

工作台壳层

工作台壳层:Next.js App Router 搭建固定最小宽度桌面布局,横向 Resizable 分栏;next-intl 中英切换,next-themes 明暗主题;侧栏集成搜索、收藏、分享列表、公开文档入口与用户设置。

数据层

数据层:Prisma 访问 PostgreSQL,文档元数据与内容通过 Route Handlers 读写;业务逻辑集中在服务端,避免把敏感配置暴露到浏览器。

账号体系

账号体系:NextAuth.js 接入 GitHub OAuth 与邮箱魔法链接(邮件发送可接 Resend 等);会话驱动「我的文档」与协同 Token。

编辑与协同

编辑与协同:TipTap / ProseMirror 承载富文本与扩展菜单;Y.Doc 经 Hocuspocus 同步,可选 IndexeddbPersistence 做离线草稿;协同光标、连接状态与断线提示对应源码里的 Provider 生命周期。

AI 辅助

AI 辅助:Vercel AI SDK 对接 OpenAI 兼容接口;编辑器划词菜单、底部栏唤起面板、Token 用量与限流在站内串联(模型与 Key 走环境变量)。

工程化

其它工程化:附件可走阿里云 OSS;可选 Sentry;单元测试使用 Vitest——便于你在自己的环境里裁剪与替换。

Next.js
App Router / SSR
Tiptap
Rich Text Editor
Yjs
Real-time CRDT Sync
Hocuspocus
Collab Server
AI SDK
Vercel AI / OpenAI
Prisma
PostgreSQL ORM
NextAuth
Auth (GitHub + Email)
Tailwind CSS
Styling
next-intl
i18n

读完了?进工作台写两段。

使用 GitHub 或邮箱登录即可打开「我的文档」。协同 WebSocket、对象存储与 AI 接口地址都在部署侧用环境变量配置,按你的线上环境启用即可。