Remote .md and .mdx with astro components

[spring crypt]

I'm currently using a remote headless CMS (strapi) with NextJS to provide my markdown content and render it to React components.

The markdown files contain some html elements that are later transformed to some interactive React components. The format is similar to this:

<div id="calculator" />

Which then is transformed to a fully interactive JSX React component.

The problem is that to achieve this the hole article / page needs to be client-side and contributes to a worse performance.

I would like to render each component server-side or client-side individually as it needs, just like astro works.

Is there any way to compile the remote .md or .mdx to the astro format, converting those html elements to astro components?

Thanks beforehand!

[calm bobcat]

You could try using this library https://github.com/natemoo-re/astro-remote#custom-components-in-markdown

[icy snow]

Docs recommend using an external md library, so no mdx with that approach
https://docs.astro.build/en/guides/markdown-content/#fetching-remote-markdown

Astro-remote is also good, esp for some fancier stuff

Oh I see you need javascript to render some components, unsure if there is a good approach, especially with SSR but also SSG

[spring crypt]

@icy snow @calm bobcat Thanks! I will give astro-remote a try

[silk prairie]

I know this is kind of an old thread but how did things work out? Did you get remote MDX working?