Flomo

大约1:1复刻的Flomo 网页版的单纯练习项目,禁止任何商业用途,如果对产品本身有兴趣请访问Flomo官网 了解更多信息

快速开始

本项目为前端代码地址,服务端请访问flomo-server 查看,后文统一用前端&后端对应称呼这两个项目,后端项目不单独编写文档

线上试用

线上地址不保证任何信息安全及校验,且数据会被定期清除,仅做体验试用

本地部署

前端项目(flomo-react)

后端项目(flomo-server)

功能说明

编辑器

标签

标签的格式为:#标签 ,标签与后续内容之间需要添加一个空格

新建标签

在编辑器中按下输入框下方工具条的“#”或者直接输入“#”字符,输入完成后点击发送会自动根据输入内容中的标签创建标签(或者将内容收录至已有的标签下)
标签支持嵌套,建议至多4级标签,多级标签的格式为:#父级/二级/三级,不同层级之间使用英文符号/隔开
标签文本内容长度不做特殊限制但是建议不要过长

标签编辑

标签创建完成后支持添加图标
不支持删除标签
允许重命名标签,重命名后对应的内容中的标签文本都会被对应重命名

标签排序

新增加的标签默认放在最后
选择置顶会将标签置于当前层级的最前
不支持拖动排序

热力图

feature list

  • 基础布局、样式及交互
  • 基础富文本编辑功能
  • 图片支持
  • 标签等扩展功能slate插件化
  • 键盘快捷键支持
  • 标签输入联想
  • Memos管理,增删改
  • 热力图数据展示
  • 增删标签
  • 标签图标
  • 标签重命名
  • 多级标签
  • 搜索
  • 基础使用
  • 体验版部署
  • 高级查询
  • H5适配
  • 文档更新
  • 单元测试
  • 打包及部署
  • ...

部分技术方案实现

编辑器

标签

数据结构

标签存在于后端服务的/src/database/tags.json文件中

富文本格式

数据存储

热力图

接口文档

新增Momo

编辑Momo

删除Momo

新增标签

重命名标签

标签置顶

标签增加图标

单元测试

badge