🏠 back to Observable

Meta: Observable editor in observable

One thing that I would like to do is to create a view with a nice text editor (ideally the same as the one used in observable) where users of my notebook can write some code with another linter (e.g. python), the code in this view should be accessible as a variable a string as any other observable cell,

can I do this?

Yes, absolutely!

Observable’s editor is based on CodeMirror. There’s a nice and simple example of CodeMirror in this notebook by @tom. And you can find several other examples of notebooks using CodeMirror via this search link.

1 Like

@tom’s notebook is probably what you’re looking for, but in case you’re looking to go a bit deeper down the rabbit hole, you might want to look at: https://observablehq.com/@ajbouh/editor

I found building atop CodeMirror’s syntax parsing to be somewhat difficult, so the editor implemented above uses markText and CSS classes driven by a https://github.com/harc/ohm grammar