Explore blazor markdown editors

[digitaldirk]

In #505 I brought up that the markdown editor didn't have dark mode styling, reasoning/response:

3. I am using (an outdated) Blazorise.Markdown package. Newer versions need a licence, which I don't wanna force anybody onto! Therefore sticking with the current version. I am not sure how much we can hook into that or create a new one (i did have a custom markdown editor at first, but that was lacking features!)
   Originally posted by @linkdotnet in #505

Found these two alternatives that are based on the same original simple MDE:

• https://github.com/erossini/BlazorMarkdownEditor (Blazor component, based on EasyMDE which is a fork of https://github.com/sparksuite/simplemde-markdown-editor)
• https://github.com/Ionaru/easy-markdown-editor (Javascript, fork of https://github.com/sparksuite/simplemde-markdown-editor)

From my point of view this would be a lot of work and seems like we would only want to do it to really expand the functionally/control (licensing) of the markdown editor. I can live without dark mode support (and it seems like we could just make some css styling to give dark mode support to the current setup)

What are everyone's thoughts on this topic?

[linkdotnet]

Blazorise is also using EasyMDE under the hood. We could also use Monaco - the VSCode Markdown Editor. But not sure how styling and everything works there. Rolling out a custom solution might be an option too, but that is something which takes a few minutes (or better hours) to. Not something you just "do" next to something.

[digitaldirk]

Monaco would be great for code related purpose, but I think the mobile view would be a challenge as the Monaco repo says mobile browsers are not supported.

• https://github.com/microsoft/monaco-editor
• https://github.com/serdarciplak/BlazorMonaco

Also it seems like we would need to add custom toolbar if we went with Monaco

[linkdotnet]

Yeah not the ideal choice. We could use a "more simplistic" one on mobile. But yeah, someone has to maintain that :D
Maybe a custom version might be something.

[linkdotnet]

@digitaldirk If you feel a bit more experimental I did a very limited POC of a custom Markdown editor that tries to mimick the current version, but supports also dark/light mode as it uses BS5.

You can fetch the custom-markdown-edtior branch (yeah there is a typo :D - noticed that too late).

[digitaldirk]

@digitaldirk If you feel a bit more experimental I did a very limited POC of a custom Markdown editor that tries to mimick the current version, but supports also dark/light mode as it uses BS5.

You can fetch the custom-markdown-edtior branch (yeah there is a typo :D - noticed that too late).

That looks very promising, great work! I think we could go either way with this. If it's exciting to you a custom solution would be cool, but I do worry about edge cases and general weirdness, and an established project could have already solved those or have workarounds. I also really like the code focused font.

1. Do you have any feature ideas that don't already exist in existing options? Runnable code snippets or something like that would be awesome (but probably out of scope of this).
2. If we did go custom, would we split it out into a separate package/project?
3. Storing unsaved changes Save unsaved blog posts in local storage #150 could also be a driving factor.
4. I would say this blog engine is mostly geared towards C# developers (anyone can use it, but most likely you are here because of dotnet/C#) - do we lean into that more and make the markdown editor more developer focused with specific features and that could be a marketing thing for this project? (format code/json, color syntax for code,...)

[linkdotnet]

Good points - and to be honest I don't have an answer to all of them. As you said this is mainly "targeted" to C# devs. So that can also be a bit of a playground for folks to try out things, so if someone wants to either pick up where I left of or just create its own Markdwn-Editor, hey why not.

Runnable code snippets or something like that would be awesome

Heck yeah!!! There are some things one could do with Telerik REPL (for example here with Blazor: https://blazorrepl.telerik.com/GdkwlMbS11AjptTB51). But that seems to be probably easier with Blazor WASM and shield this against the outside world.

If we did go custom, would we split it out into a separate package/project?
Not planned at the moment - mainly because that makes the maintenance easier if we "tailor" it towards that project alone.

That said: I am totally open. The attached branch was "just" my play on ideas. Even #150 can be solved independently (maybe more complex though).