TE
TechEcho
Home24h TopNewestBestAskShowJobs
GitHubTwitter
Home

TechEcho

A tech news platform built with Next.js, providing global tech news and discussions.

GitHubTwitter

Home

HomeNewestBestAskShowJobs

Resources

HackerNews APIOriginal HackerNewsNext.js

© 2025 TechEcho. All rights reserved.

Ask HN: How to write a rich text editor?

3 pointsby patrick91over 2 years ago
Hello there! I was looking into writing my own text editor for my personal notes and daily logging. I wanted to build something that works with markdown and supports rich widgets, for example if I use some special syntax (or &quot;just&quot; the link of the tween) I can render a card for a specific tweet.<p>I&#x27;m looking for any kind of suggestion, I&#x27;m interested in learning new things<p>At the moment I was thinking of using Tauri and to write my UI using some frontend framework, but delegate most of the parsing to Tauri, not sure if that makes sense.

4 comments

anigbrowlover 2 years ago
It&#x27;s hard to answer without more context, eg although you didn&#x27;t say so, it looks like your goal is a desktop app and you want to write it in Rust - or at least so I assume after spending 5 minutes learning about Tauri.<p>Maybe evcxr would give you a head start, it&#x27;s a Rust-based Jupyter Kernel. Jupyter has a fairly mature ecosystem with widgets and it&#x27;s easy to come up with renderers for different MIME types, so you might be able to lift some ideas or connect with other people working on similar tasks.<p><a href="https:&#x2F;&#x2F;github.com&#x2F;google&#x2F;evcxr" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;google&#x2F;evcxr</a>
Leftiumover 2 years ago
<a href="https:&#x2F;&#x2F;prosemirror.net&#x2F;" rel="nofollow">https:&#x2F;&#x2F;prosemirror.net&#x2F;</a>: A toolkit for building rich-text editors on the web<p>ProseMirror was written by Marijn Haverbeke, who also wrote (and rewrote!) the much used [CodeMirror] editor. So the design of his &quot;editor toolkits&quot; are based on years of experience developing and maintaining text editors. Marijn is very responsive on all the respective discussion boards.<p>Examples, including markdown: <a href="https:&#x2F;&#x2F;prosemirror.net&#x2F;examples&#x2F;" rel="nofollow">https:&#x2F;&#x2F;prosemirror.net&#x2F;examples&#x2F;</a><p>Depending on your design, CodeMirror may be the better choice, especially if you want &quot;parsing.&quot; The core of CodeMirror is based on [Lezer], a custom parser designed for editors. ProseMirror is meant to be the rich text editor, but I found my TaskPaper clone was more suited for CodeMirror because it was more focused on plain text. I suppose it would be possible to combine Lezer with ProseMirror, but ProseMirror already has its own [document model].<p>[CodeMirror]: <a href="https:&#x2F;&#x2F;codemirror.net&#x2F;" rel="nofollow">https:&#x2F;&#x2F;codemirror.net&#x2F;</a><p>[Lezer]: <a href="https:&#x2F;&#x2F;lezer.codemirror.net&#x2F;" rel="nofollow">https:&#x2F;&#x2F;lezer.codemirror.net&#x2F;</a><p>[document model]: <a href="https:&#x2F;&#x2F;prosemirror.net&#x2F;docs&#x2F;guide&#x2F;#doc" rel="nofollow">https:&#x2F;&#x2F;prosemirror.net&#x2F;docs&#x2F;guide&#x2F;#doc</a>
Marta_Bover 2 years ago
Check out CKEditor 5, with media embed and Markdown support :)<p><a href="https:&#x2F;&#x2F;ckeditor.com&#x2F;docs&#x2F;ckeditor5&#x2F;latest&#x2F;features&#x2F;media-embed.html" rel="nofollow">https:&#x2F;&#x2F;ckeditor.com&#x2F;docs&#x2F;ckeditor5&#x2F;latest&#x2F;features&#x2F;media-em...</a> Though for Twitter previews you might need to use services like Iframely but there is a ready-to-use integration guide: <a href="https:&#x2F;&#x2F;iframely.com&#x2F;docs&#x2F;ckeditor" rel="nofollow">https:&#x2F;&#x2F;iframely.com&#x2F;docs&#x2F;ckeditor</a><p>As for Markdown, you can switch the default CKEditor 5 output from HTML to Markdown: <a href="https:&#x2F;&#x2F;ckeditor.com&#x2F;docs&#x2F;ckeditor5&#x2F;latest&#x2F;features&#x2F;markdown.html" rel="nofollow">https:&#x2F;&#x2F;ckeditor.com&#x2F;docs&#x2F;ckeditor5&#x2F;latest&#x2F;features&#x2F;markdown...</a> And Markdown input is provided by a customizable autoformatting feature. It&#x27;s enabled by default in all CKEditor 5 builds.
eimrineover 2 years ago
You may be interested in this book <a href="http:&#x2F;&#x2F;www.finseth.com&#x2F;craft&#x2F;" rel="nofollow">http:&#x2F;&#x2F;www.finseth.com&#x2F;craft&#x2F;</a>