Skip to main content

Introduction

Overview​

Remirror is a wrapper library for ProseMirror, it is an abstraction layer that makes ProseMirror easier to work with, and provides React and ProseMirror integration.

ProseMirror is a toolkit for building rich text editors, it is not an out-the-box solution like Draft.JS for instance. This means ProseMirror has a steep learning curve - there are many concepts and terms to learn, and it can be difficult to structure you codebase in a logic manner.

Remirror provides extensions, that abstract over various ProseMirror concepts such as schemas, commands and plugins, making it much simpler to group related logic together.

Think of Remirror like Lego, you can follow the instructions to construct an out-of-the-box style editor, or as the basis of something much more bespoke, via its commands, helpers and hooks.

This means we can provide both "out-of-the-box" and "bespoke" experiences, maintaining the power and flexibility that ProseMirror is known for.

Where to start?​

The guide offers two tutorials to get new users started:

  • 5 min tutorial: Build an app with a pre-packaged editor
  • Getting started: Build your own tailor-made editor and learn about the core concepts underlying Remirror

Target audience​

This guide is designed for the following:

  • Consumers of the library.
  • Extension developers.
  • Contributors.

Regardless of where you stand, I have endeavoured to make it approachable and interesting for a whole range of developers.

If a section is becoming difficult this guide will endeavour to make it obvious that this is not easy.


note

Labels will be used to identify areas which may be more advanced.


Expected knowledge​

This guide assumes that you're familiar with JavaScript and have some understanding of React. If you're brand new to programming or JavaScript then many would encourage you to look into other resources before attempting to read through this.

note

Found an error in the documentation? Please help us to improve:

  • Open an issue in our GitHub repo.
  • Join our discord server and discuss the problem with us.
  • Create a pull request with your proposed improvement by clicking the edit button on the relevant page.