markdown from db

[marble mortar]

Let's say I have a blog, but rather than a .md page on the server, the markdown text is stored in a database. I can fetch the text from the db, and put it into a string variable in the Astro frontmatter, but how can I make Astro render the markdown in the HTML template?

[sturdy radish]

Hi @marble mortar. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:

---

Astro does not include built-in support for remote Markdown, which includes fetching Markdown from a database. To fetch remote Markdown and render it to HTML, you will need to install and configure your own Markdown parser from npm. This will not inherit from any of Astro’s built-in Markdown and MDX settings that you have configured.

Here's an example of how you can fetch Markdown from a remote source and render it to HTML using the "marked" library:

---
// Example: Fetch Markdown from a remote API
// and render it to HTML, at runtime.
// Using "marked" (<https://github.com/markedjs/marked>)
import { marked } from 'marked';

const response = await fetch('<https://raw.githubusercontent.com/wiki/adam-p/markdown-here/Markdown-Cheatsheet.md'>);
const markdown = await response.text();
const content = marked.parse(markdown);
---
<article set:html={content} />

In this example, replace the URL in the fetch function with your API endpoint to fetch the Markdown content from your database. The marked.parse(markdown) function will parse the fetched Markdown text into HTML, which can then be rendered in your Astro component using the set:html directive.

Please note that you need to understand these limitations before implementing this in your project. source (https://docs.astro.build/en/guides/markdown-content/)

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

@marble mortar kapa.ai is still learning and improving, please let us know how it did by reacting below