Editor Awesome

Web Editor

• prosemirror
• facebook/lexical
  • by Facebook, 替代 draftjs
  • https://news.ycombinator.com/item?id=31019778
  • ozanyurtsever/verbum
• quilljs/quill
  • Quill is a modern WYSIWYG editor built for compatibility and extensibility.
  • zenoamaro/react-quill
• tinymce/tinymce
  • The world's most popular JavaScript library for rich text editing
• draft.js
  • 使用 immutable-js 管理状态
  • sstur/react-rte
  • jpuri/react-draft-wysiwyg
• ianstormtaylor/slate
• https://ckeditor.com/
• https://github.com/JefMari/awesome-wysiwyg
• sofish/pen
  • enjoy live editing (+markdown)
• lovasoa/react-contenteditable
  • React ContentEditable
• benjamn/kix-standalone
  • google doc editor - 2010 - archived
• red-axe/am-editor
  • 富文本实时协同编辑器框架

Code Editor

• monaco
• codemirror
  • adoption
  • We are rewriting CodeMirror
• satya164/react-simple-code-editor
  • works by overlaying a syntax highlighted <pre> block over a <textarea>
  • 限制
    • 必须字体相同
    • undo 栈与浏览器不一致 - 大部分编辑器都有这样的问题
    • 没有针对性能优化 - 大文档会慢
• Comparison of JavaScript-based source code editors

Markdown

• outline/rich-markdown-editor
  • Outline Prosemirror 编辑器
  • 支持 / 命令
  • 类 block 编辑器
• Tencent/cherry-markdown

Hex

• WerWolv/ImHex
  • GPLv2, C++

Block

• codex-team/editor.js
  • Apache-2.0, Typescript
• appleple/smartblock
  • React+ProseMirror
  • 不活跃
• WordPress/gutenberg
  • Automattic/isolated-block-editor
    • 去除 WordPress 依赖
• tobi4120/notion-clone
• portabletext/portabletext
  • Sanity.io 定义的规范

Page Builder

• react-page/react-page Next-gen, highly customizable content editor for the browser - based on React and Redux. WYSIWYG on steroids.
  • MIT, TypeScript+React
  • 整页编辑
  • 耦合 mui
• alibaba/designable
• tinacms

商业

• https://codyhouse.co/
• builderio

IDE/Code

• codemirror
• DTStack/molecule

Misc

• viebel/klipse
  • eval languages
• ekzhang/rustpad minimal collaborative code editor
  • MIT, Rust
• wereturtle/ghostwriter
  • GPL-3.0, C++
• https://github.com/TryGhost/Admin/tree/main/lib/koenig-editor
• Rich text / HTML editors and frameworks

Prototyping

• Prototype 场景
  • 2D 像素纬度 - 输出 SVG 或 设计稿 - 实现相对简单
    • 类似 PS，SVG 编辑器
  • Low Code - 部分控制
  • HTML - CMS
    • 编排 HTML 元素，所见即所得 - 需要处理复杂布局逻辑
    • 编辑组件、绑定数据 - 交互复杂

---

• React-Proto/react-proto
• https://openclipart.org/
  • Public Domain
• akiraux/Akira
  • Vala
  • Native Linux App for UI and UX Design built in Vala and GTK
• react-studio

View

• mac-s-g/react-json-view

Glossary

• MIS - 管理信息系统
  • 大多为 Table+Form