用 Cursor 做的 Next.js 在线 JSON 格式化工具

最得意的功能是实时协作，用 Yjs + WebSocket 实现多人同时编辑。Yjs 处理 CRDT 数据同步，WebSocket 做实时通信，离线编辑用 IndexedDB 缓存。Next.js 的 API 路由做 WebSocket 中继服务器，部署在 Vercel 的 Edge Runtime 上。

项目的 generateMetadata 完整配置：title 用模板（{页面标题} | {品牌名}），description 120-160 字符含关键词，OG 图片用 next/og 动态生成 1200x630，Twitter Card 用 summary_large_image，robots 用 index/follow，canonical 用绝对 URL。

UI 设计灵感来自 Linear 和 Vercel，极简风格。配色用 CSS 变量控制，支持亮色/暗色/系统三种模式。组件用 Shadcn UI 做基础，自定义了按钮和卡片的圆角和阴影。响应式断点用 Tailwind 的 sm/md/lg/xl，移动端优先设计。