Let’s Build a Fast, Slick and Customizable Rich Text Editor With Slate.js and React

What Is a Rich Text Editor?

A rich text editor’s aim is to reduce the effort for users trying to express their formatting as valid HTML markup. A rich text editor gives users the option to format their text.

Everyone has used a rich text editor at some point. So why not build one? Here are some of the most used rich text editors.

• Reddit, YouTube, and Hacker News comments.

Reddit comments section

• Online editors for producing content — writing blogs, tutorials, news, etc.

Medium

• Twitter tweets, mentions, hashtags, polls, lists, etc.

• Editing documents and excel sheets, like Google Docs, Microsoft Word, Dropbox Paper.

Draft.js

In 2016, Facebook open sourced their new rich text editor framework, called Draft.js.

https://github.com/facebook/draft-js

Here’s the Draft.js introductory talk. It’s worth watching the 25 minute video to understand what kind of problems the Facebook team ran into, and how they solved them.

Slate.js

Ian Storm Taylor created Slate.js, shortly after Facebook open sourced Draft.js.

Here’s a Hacker News thread discussion about Slate.js.