Search code examples
node.jsexpresstinymcewysiwygpug

Using jade with wysiwyg markdown to allow users to edit content


I believe don't re-invent the wheel unless you absolutely have to. So I don't want to start coding away something that has already been coded, or a lot of people are contributing to it already.

I have just recently emigrated to planet Node.js (sorry php/apache), and need to put resources together to bring things up to speed with other languages.

I am using Node.js as a server listener, with Express.js as middle-ware, and jade js as a template engine.

I would like to use a TinyMCE like features but instead of the code being the usual ugly HTML markup, I would like the code to be the markdown and allow jade to do its majic. I suppose it more or less like stackoverflow edit (which I am typing in) but maybe a little more advanced UI wise.

So for instance if I click on a button B it should make the selected text bold as you would, with any WYSIWYG editors.

References:


Solution

  • You could use any of the HTML generating WYSIWYG editors, and on "save", allow the HTML to pass to the server where you convert it to Jade syntax before storing it.

    You could easily integrate this package, for example, into your Express server:

    https://www.npmjs.org/package/html2jade

    html2jade.convertHtml(html, {}, function (err, jade) {
       // save jade to the DB
    });