explaingit

facebookarchive/draft-js

Analysis updated 2026-05-18

22,650JavaScriptAudience · developerComplexity · 3/5LicenseSetup · easy

TLDR

A JavaScript framework for building rich text editors in React apps, with support for formatting, links, media, and custom styles. Now archived, Meta recommends Lexical for new projects.

Mindmap

mindmap
  root((Draft.js))
    What it does
      Rich text editing
      Formatting and styling
      Media embedding
      Undo and redo
    Key features
      Immutable state
      React integration
      Browser quirk handling
      Cursor management
    Use cases
      Social media composers
      Comment boxes
      Document editors
    Tech stack
      JavaScript
      React
    Status
      Archived project
      Lexical recommended
Click or tap to explore — scroll the page freely

Code map

Detail Auto

An interactive map of this repo's files and how they connect — its source is parsed live in your browser. Click Visualize to build it.

filefunction / class

What do people build with it?

USE CASE 1

Build a social media post composer with bold, italic, and link formatting.

USE CASE 2

Create a comment box that lets users format text and embed images.

USE CASE 3

Build a document editor with undo/redo and custom text styles.

What is it built with?

JavaScriptReact

How does it compare?

facebookarchive/draft-js4ian/gdeveloptencent/wepy
Stars22,65022,66322,617
LanguageJavaScriptJavaScriptJavaScript
Setup difficultyeasyeasymoderate
Complexity3/52/53/5
Audiencedevelopervibe coderdeveloper

Figures from each repo's GitHub metadata at analysis time.

How do you get it running?

Difficulty · easy Time to first run · 5min

Project is archived, Meta recommends Lexical instead

Use freely for any purpose including commercial, as long as you keep the copyright notice.

In plain English

Draft.js is a JavaScript framework for building rich text editors, the kind where you can bold text, add links, embed media, or apply custom formatting, all inside a web app. It was created by Meta (Facebook) and used in products like Facebook Notes and Messenger. The idea is that building a good text editor from scratch is notoriously tricky: you have to deal with browser quirks, cursor behavior, undo/redo, and more. Draft.js handles all of that complexity and gives developers building blocks they can customize. It integrates directly into React apps using a model where the editor's entire state is stored in an immutable snapshot, meaning every change produces a new version of the state rather than mutating the old one. This makes undo/redo and collaborative editing patterns much easier to build. You would use Draft.js when you need a text editor in a React application that goes beyond a plain textarea, for example, a social media post composer, a comment box with formatting, or a document editor. Important note: this project is archived and no longer receiving new features. Meta has since moved to a successor called Lexical, which they recommend for new projects. The stack is JavaScript and React.

Copy-paste prompts

Prompt 1
Show me how to set up Draft.js in a React component and create a basic rich text editor with bold and italic buttons.
Prompt 2
How do I implement undo and redo functionality in Draft.js without building it from scratch?
Prompt 3
I need to add custom formatting styles to a Draft.js editor. Walk me through the ContentState and EditorState API.
Prompt 4
How do I handle media embedding (images, videos) in a Draft.js editor?

Frequently asked questions

What is draft-js?

A JavaScript framework for building rich text editors in React apps, with support for formatting, links, media, and custom styles. Now archived, Meta recommends Lexical for new projects.

What language is draft-js written in?

Mainly JavaScript. The stack also includes JavaScript, React.

What license does draft-js use?

Use freely for any purpose including commercial, as long as you keep the copyright notice.

How hard is draft-js to set up?

Setup difficulty is rated easy, with roughly 5min to a first successful run.

Who is draft-js for?

Mainly developer.

Open on GitHub → Explain another repo

This repo across BitVibe Labs

Scan in gitsafehub Deploy in gitdeployhub facebookarchive on gitmyhub

Verify against the repo before relying on details.