How Draft.js Represents Rich Text Data

If you are dealing with an input field or a textarea, we can easily represent the input as a simple String. But how does Draft.js represent a rich text data that has all sorts of styles, blocks, entities (like links, emojis) and more?

This becomes useful as we need to ultimately extract the data from the editor,

Thankfully Draft.js provides a function called convertToRaw(for exporting data) andconvertFromRaw(for importing data).

Let’s say we exported the data from an example Draft.js editor(https://react-rte.org) shown in Picture 1

You can click on the pictures to zoom.

Obviously the above JSON is unreadable