JavaScript library for WYSIWYG visual editor allowing a bespoke-coded export and import format

Question

I'd really appreciate any good recommendations for me to explore for the following requirements.

---

A JavaScript library (ideally React) with:

Export: WYSIWYG editor that can export its content to a bespoke-coded format

• The bespoke-coded format would be Freemarker template; e.g. the JavaScript-based editor has flexibility to support “Save As..” or “Export” the content to a custom format. Then we could program an adapter to the custom format (which happens to be a Freemarker “.ftl” file)

Import: WYSIWYG editor that can import its content from a bespoke-coded format

• The bespoke-coded format would be Freemarker template; e.g. the JavaScript-based editor has flexibility to support “Open” or “Export” content from a custom format. Then we could program an adapter for the custom format (which happens to be a Freemarker “.ftl” file)

---

We use the Freemarker templates to generate other files (HTML emails and PDF documents) at run-time. We would use the editor to allow less technical people to create such templates in a safe way in a web browser (i.e. not a raw text editor)!

• Clearly, Freemarker tags such as <#if> are special tokens -- e.g. <#if user.status == 'Banned'>You are banned<#else>HTML here to welcome user</#if> -- so it'd be great for this JavaScript library (ideally React) to allow us to code a bespoke block/widget representing the Freemarker <#if> tokens above. (My analogy is: when you add or edit a hyperlink in an WYSIWYG editor, it is sort of like a bespoke block/widget - you don't directly hack the <a> tag as plain text).

Answer 1

The LEADTOOLS HTML5/JavaScript Toolkit includes a Document Editor that provides a frontend visual interface which allows users to view and edit documents.

Note that this frontend is implemented using Node.js TypeScript with a Microsoft .NET (IIS), .NET Core (Kestrel), or Java (Linux/Apache) hosted back end that is used to perform document format conversion and text recognition, among other processes.

Depending on how your Freemarker adapter works, it might be possible to incorporate your components into this editor and display the document on the frontend. The editor is also able to import/export documents as JSON which could potentially be used for translation to the Freemarker format.

If you wish to look into this further, you can find a live online demo of the editor here

The source code of this editor can be found in the free evaluation of the toolkit which can be obtained here