Content EditableでWYSIWYGエディタ作るの楽しい！ - maru source

こんにちは丸山@h13i32maruです。 僕は今、Ubie Discoveryで医療従事者向けのカルテエディタを作っています。人生で初めてContent Editableを使ってエディタを作ってるんですが、それがすごく楽しいです！というのも、エディタを作るには色々技術的な課題があります。例えば、テキストをパースするには？ASTからHTMLをビルドするには？パフォーマンスのよい更新方法は？などなど。それらの技術的な課題を解決していくのが単純に楽しいという感じです。また、車輪の再発明は極力抑えつつ、自分たちのプロダクトでやりたいことを実現できるような工夫もしています。 というわけで、今回はそんなエディタ作りで取り組んだ課題と解決策を紹介していきたいと思います。 （訳: 楽しかったので、誰かに聞いてもらいたい！） エディタの概要 メンテしやすいテキストパーサ - PEG.js メンテしやすいH

[h13i32maru]

ニッチな記事書きました

[zuzu_sion]

テキストエディタ作りって楽しいよね（白目

[ginpei]

Markdownみたいな、文法と表現のエディター。execCommand()なし。プラグイン機構で疎結合、責務で分割し単方向へ依存、入力と処理を混合しない、構文解析器を用意してAST、試験や文書を用意。感動的に綺麗な設計っぽい。

[mirie0908]

面白そうだけど昔のemacsカスタマイズみたいにプチハマりそうでこわい

[mole-studio]

自分がカルテ書く感じプレーンテキストに毛が生えたレガシーなリッチテキストで十分満足してるけどな。独自記法で変にビルトインの装飾とか付いたらむしろ嫌

[yarumato]

“宣言的にルールを書くと、命令的コード（if, for）と違い、状態管理が発生せず良い。それでテキストをパースした結果のASTからHTMLを組み立てるReactDOMServer。処理タイミングに外部コード差し込めるプラグイン機構”

[ledsun]

楽しそう