Skip to content

Tiptap

Tiptap is an editor toolkit for adding formatted writing to an app. You choose the controls and the kinds of content the editor supports.

Visit Tiptap

What do you need to build around the editor?

Choose the formatting features first. A notes app might need a heading, a list and a link. Tiptap uses extensions, which add the content or behavior you want the editor to understand. Your app provides the controls and the save experience.

The core editor is MIT-licensed. Hosted collaboration and other managed services have their own terms. Saving an ordinary note in your own database does not require a hosted collaboration account.

Use your own controls or start with Tiptap’s reusable components or a template.

Should you save JSON or HTML?

Tiptap can produce both. JSON is a structured copy of the editor’s content. HTML describes how content is marked up for the web. Tiptap recommends JSON for saving the editable document. Your app still has to write it somewhere and load it again.

Keep the original saved copy before changing extensions. Reopen a note with the features your app supports and compare it with the old version. An export that looks right once is only one part of that check.

How can you plan the first save and reopen check?

Draw a fictional packing note with a heading and two list items. Use no real workspace, connection or customer data.

  1. Name what needs to survive
    Mark the heading and both list items as separate parts of the saved document.
  2. Draw a fresh session
    Start with an empty editor and draw where the saved note comes from. Mark the check as failed if the words return but the list turns into a paragraph.
  3. Keep an export check
    Mark how a second view would display the same note. Keep the original saved copy while testing a new format.