Hey!

I really liked this article. I’ve been further away from web technologies lately, but I’ve experienced the pain of integrating an WYSIWYG editor to an admin panel before. At first it seems easy, just use one of the big names like Editor.js and you’re good. But when one actually tries to use it, it becomes clear that the editing experience is just broken. It have a lot of inconsistencies that will scare non-technical users away quickly. (Last time I’ve checked, even editors that costs $$ does not handle ctrl-v lists correctly…)

I’ve lately been looking at “what you see is what you mean“ model, which seems to describe my long lasting frustration when people create empty paragraphs (or other hidden elements, that they don’t care about) to space out things on page or just because they don’t see the empty line. I mean, it’s not their fault. But this WYSIWYM acronym seems to address exactly this.

After I’ve read this article I think I am going to try to tinker with the prosemirror directly and give it a shot. It’s for a personal project so it doesn’t really matter that much for now.

Thanks for good article!

You’re welcome, Daniel! Glad you like the text and thanks for taking the time to respond. I agree, when developing an editor often less is more. I very much like the WYSIWYM approach too. Then people can stop thinking about formatting and “just write”.

If you happen to get going with ProseMirror, I’d be curious to hear about your experience. Also, if you need a starting point, I can send you the code of editable.website. It’s built with SvelteKit + ProseMirror.

That sounds good! I would be glad to try. I worked with Svelte (before SvelteKit 1.0 was released) before and liked some aspoects of it, so I think I could actually understand the code.

The project for which I am researching editors right now is actually an from scratch implementation of a CMS with backend. I am trying to skip frameworks altogether and work with just backend rendered HTML. On the backend too, reinventing stuff, working with JAI language which is compiled, procedural, manual memory management, (in private beta for now) & fastcgi directly.

It’s just an experiment, however, I’ve decided that I want to implement at least a proof of concept, somewhat usable version, to see how it would behave.

The approach consists of several (I guess rather arbitrary or one could say intuitive) decisions: the admin panel allows to create pages. Pages are created from pre-designed sections (design can not be changed by the CMS user), that have zones of text, rich content & media. So then, when a landing page is designed, sections can be reused to create a sub-page for a product or event, etc… This might not be applicable and/or would require to design the site with it in mind from ground-up.

Then for the problem of data storage, I am currently only working on flat-file part of storing json data (preferably something like output from Editor.js, which I am sure ProseMirror can do). The second way would be the DB / “data model“ binding, in which one would specify which fields of a table will be filled in what zones on specific sections (there could be filters and transformations added to this, generally speaking). This way, the visual aspect is separated from the data it’s displaying. Each zone decides if it’s DB driven or file driven. Each zone has it’s own file.