Introducing Draft.js in Wagtail

Here is a talk I gave at Wagtail Space 2018. The video recording is available on YouTube. The talk was 90% demos so the purpose of this presentation is to share the links.

Hi 👋, I'm Thibaud!.

Why this happened, and how – read the following blog posts:

• Why Wagtail’s new editor is built with Draft.js
• Rethinking rich text pipelines with Draft.js
• (UI/UX blog post on its way)

---

Demos! 🌈

Demos built with the Draft.js framework, not (only) with Wagtail’s editor.

Draftail

• Draftail Playground
• Rich text formats: Draftail
• Copy-paste: Draft.js filters
• More formats: Draftail examples

Draft.js plugins

High quality plugins with great UX on top of Draft.js.

• 😄 emojis!
• @mentions
• Videos (embeds)
• Counter

More Draft.js

• Stickers
• Mathjax
• KaTeX
• Markdown shortcuts

---

What next

Blog posts to learn more:

• Why Wagtail’s new editor is built with Draft.js
• Rethinking rich text pipelines with Draft.js
• (UI/UX blog post on its way)

How you can help:

• Try out the editor, inside and outside of Wagtail
• Try to break it (and report issues 😄)
• Review and improve the user guide

The presentation was originally available on playground.draftail.org/.