Rendu Markdown

bext-v8 expose __readFile et __readFileExists comme natifs du bridge, ce qui permet à une page de lire un fichier de contenu depuis le disque au moment du rendu SSR et de le faire passer par n'importe quelle bibliothèque npm — ici, marked. Le résultat est injecté dans le JSX via un enfant <Raw> (la sortie explicite de l'échappement automatique).

Astuce
__readFile lit le fichier à chaque rendu SSR — il n'y a pas de mise en cache intégrée. Combinez-le avec une route en mode ISR (sans force-dynamic) pour que bext mette en cache la page rendue et ne lise le disque qu'une fois par revalidation.

Rendu depuis src/content/example.md

Hello from Markdown

This is a demo .md file rendered through marked at SSR time.

Why this works

bext's V8 isolate exposes a few bridge natives — __readFile and __readFileExists — that let server-side rendered components read files from disk during render. Combined with the marked package from npm, that's enough to ship a small MDX-style content site without a separate build step.

A code block

import { marked } from "marked";

declare function __readFile(path: string): string;

export default function Page(): string {
  return marked.parse(__readFile("./src/content/example.md")) as string;
}

A list, just because

  • bext renders this server-side
  • marked is invoked inside V8 (no Node)
  • the result is an HTML string handed to the JSX runtime via Raw

Real docs sites layer in syntax highlighting, frontmatter, heading anchors, and component injection. This demo keeps it small.

src/app/examples/mdx/page.tsxTSX
// src/app/examples/mdx/page.tsx
import { marked } from "marked";
import { Raw } from "@bext-stack/framework/jsx-runtime";

declare function __readFile(path: string): string;

export default function Page() {
  const md = __readFile("./src/content/example.md");
  const html = marked.parse(md) as string;
  return <article><Raw html={html} /></article>;
}