monaco-editor on fresh
Hello. First of all, I am a newbie in web development. I played around with Deno for a while. So I thought I will leverage it to finally get into web development via Fresh.
For a toy project, I am trying to build a code playground (like, https://play.yew.rs). I want to use monaco-editor(https://www.npmjs.com/package/monaco-editor). But monaco-editor works with HTMLElement (https://microsoft.github.io/monaco-editor/docs.html#functions/editor.create.html), instead of Preact.
I could make it work as a static code(https://github.com/rnbguy/fresh-playground/blob/264e11813d549fe91b7bf2be38b454610bc5c676/components/Playground.tsx), but I need to add code in the island components to get the value from the editor using monaco API(https://microsoft.github.io/monaco-editor/docs.html#interfaces/editor.ICodeEditor.html#getValue) here - https://github.com/rnbguy/fresh-playground/blob/264e11813d549fe91b7bf2be38b454610bc5c676/islands/Run.tsx#L12.
PS. I am aware of https://www.npmjs.com/package/@monaco-editor/react. Probably I need something similar working with Preact.
1 Reply
i just rewrote it in my site