WYSIWYG markdown editor in JupyterLab?

I am curious if anyone has worked on or would be interested in an extension that adds WYSIWYG capabilities to JupyterLab.

For example, HackMD lets you switch between full-markdown mode and rendered mode (or has a side by side mode)

There are also lots of nice JS libraries that expose this kinda functionality, e.g. draftjs seems quite popular.

There’s an issue about markdown WYSIWYG in jlab here though it hasn’t moved much recently. It would be great if folks could voice their thoughts/support/concerns/etc!

Note: this has been discussed a bit here as well:

1 Like

Apols for the core dump - rushing on my way out!

Some editors / example envts…

Not sure if/how many of them have js libraries etc that could be tapped into. A lot of them are fully blown editors. If they can tap into Jupyter kernels, then a question arises: where would a JuptyerLab wywiwyg extension fit? Could it compete? Should it? (I think it could be convenient, but it at the risk of making JupyterLab more cluttered? If JupyterLab views are customisable, then is a gallery of different JupyterLab views/setups available?)


https://tiptap.scrumpy.io/collaboration
stencila rationale


http://substance.io/texture/
https://stackblitz.com/docs



https://github.com/Microsoft/monaco-editor https://github.com/codercom/code-server see https://github.com/jupyterlab/jupyterlab-monaco
https://abcjs.net/abcjs-editor.html
https://github.com/saf-dmitry/mdviewer
https://github.com/SVG-Edit/svgedit

http://calca.io/

Those are all super useful, thanks! My thinking is that piggy-backing on a service just for markdown cells in the notebook viewer would be useful in-and-of itself. I agree that for more generic coding tasks, building more connections with other tools like vscode would be a good path too

Up-voting for Markdown rendering in JupyterLab. While it is possible to view a rendered version (can’t remember right now if it updates as you type), the feature is way too hidden! I have a dream of launching a JLab binder that lands on a beautiful README page.

I also like the idea mentioned in this issue where the README is rendered underneath the Notebook files so it looks more like a GitHub repo.

@sgibson91 It is possible to open a binder with a README already displayed, though it takes a bit of work. For some documentation, see this example: https://github.com/ian-r-rose/binder-workspace-demo

1 Like

Using a WYSIWYG editor for markdown in a notebook would be amazing. It would get us one step closer to having an editing experience that is “this is a normal document with a fancy editor that just happens to let me add code blocks” (which eventually will lead to Jupyter being integrated in Word! (my not so secret end goal :grinning:))

I made a proof of concept for nteract a while back https://github.com/nteract/nteract/pull/3699 but stalled because of my lack of JS skills.

1 Like

I am mainly an observer/consumer. Opinions expressed are based on my experience as a user. I have not made many substantive contributions to the jupyter project.

WYSIWYG markdown
I think that WYSIWYG is currently properly designed with jupyterlab’s ability to show a viewer next to an editor.

It is not just markdown
We should not assume what is being changed. We should manage the changes as expected,

I like the existing separation of concerns. To make it work, we need to show the view of the state of the editor. There have been issues with this. The viewer must show the state of the editor and the user needs to be able to recognize whether the change has been persisted.

The view of the existing state must be consistent with the deployable
state.

A rich text editor for markdown cells (and perhaps whole documents outside the notebook UI) might be a great Jupyter Cal Poly intern project this summer. What do y’all think?

1 Like

I would love to see this :slight_smile: I will buy an avocado toast to anybody that makes progress towards this :avocado:

2 Likes