How to correctly save Markdown in Xano Database?

momue

I am trying to save markdown in a textfield in Xano and render it in React with react-markdown.

If I copy my markdown into the text field it does not get rendered correctly. If I hardcode the same markdown and use it as input for my Renderer it works just fine.

I don't have any filters on the text field in the Database. I will attach screenshots of the rendered content and console logs of the 2 different inputs (1 hardcoded, 1 from Xano)

Is Xano modifying the input per default? (whitespace, line-break)

Ray Deck

The hardcoded version has lots of extra spaces to the left - that makes it use the preformatted tag, which treats everything literally (e.g. not using markdown rules.)

Markdown makes a paragraph break when there are two newline characters in a row. E.g. you have a blank line, and then the next paragraph. When you just press enter and continue, it wants to roll that into the current paragraph.

To make that work in markdown, use two line breaks. To get the same behavior as in your "hardcoded" make sure to add leading spaces to your lines when storing the text in the db.

momue

Thank you for your answer. You are right, there was an issue with copy & pasting markdown in my editor, hence the extra spaces.

If I manually add two line breaks, it works. But I also wanted the ability to only have a new line not a new paragraph

. As far as I know, it should also work with 2 spaces + enter. But it doesn't in Xano.

My goal is to have a simple workflow of copy & pasting markdown from a markdown editor into Xano. I don't want to manually add line breaks.

With the input from Xano a &nbsp is rendered, when using the hardcoded markdown a <br> is rendered.