Explore the intricacies of rich text editing with React in this 25-minute conference talk from React.js Conf 2016. Dive into Facebook's approach to creating an editor framework that empowers engineers to build customizable rich text composition experiences. Learn how the combination of React, ImmutableJS, and contentEditable enables the implementation of features like mentions, emoticons, hashtags, styles, and embedded media. Discover solutions to common challenges, including cursor management, data modeling, and undo/redo functionality. Gain insights into practical applications through examples such as Facebook Comments and the Facebook Notes Editor. Equip yourself with the knowledge to move beyond plain text and create engaging, interactive content input experiences for users.
Overview
Syllabus
Intro
Example Comment
Previous Approach
The Problem
The Cursor
The Model
Undo redo
Mentions
Mention Function
Facebook Comments
Facebook Notes Editor
Conclusion
Taught by
Meta Developers