Show HN: Embed Jupyter Notebooks in NextJS/Docusaurus/Fumadocs Docs
For some reason, embedding a Jupyter notebook in a documentation site still means doing one of these: screenshot every cell, run nbconvert and clean up the HTML, copy-paste the code into fenced blocks (losing the output), or iframe in nbviewer. Every time you update the notebook, you redo the whole dance.
notebook-mdx lets you just link the `.ipynb` file and it renders inline in your MDX. No export step, no cleanup, no re-pasting. Update the notebook, rebuild the docs, done.
:::notebook{file="./analysis.ipynb"}
:::
That's the API just link the file. You get authentic Jupyter styling (In/Out prompts, syntax highlighting, rich outputs including images and HTML), build-time rendering so there's zero client-side JS, multi-language support (Python, R, JS, SQL). Works with Next.js, Docusaurus, Fumadocs, and any MDX framework.Example output:
- Example 1: https://notebook-mdx.vercel.app/docs/examples/notebook-demo
- Example 2: https://notebook-mdx.vercel.app/docs/examples/directive-exam...
Repo: https://github.com/abhay-ramesh/notebook-mdx
Docs: https://notebook-mdx.vercel.app
No comments yet.