jupyter / jupyter/notebook

Support for mdx instead of markdown

Open
#7,376 1 comment 6 reactions 0 assignees View on GitHub
enhancement
Dominant language
Jupyter Notebook
Stars
13.3k
Forks
5.8k
Avg merge
6d 11h
Merged PRs (30d)
7

Description

Hi I need to render some react components which are already supported in mdx, it would be wonderful if I could pass data from python numpy to my react component in mdx in jypyter to render graphs

### Problem

**Integration with mdx:** https://github.com/mdx-js/mdx

`[py]`

```py
import numpy as np
import globals

data = np.array.rand(2,3)

globals.data = data
```
`[mdx]`

```mdx
import {Chart} from './snowfall.js'
export const year = 2013

# Last year’s snowfall

In {year}, the snowfall was above average.
It was followed by a warm spring which caused
flood conditions in many of the nearby rivers.

```

### Proposed Solution

- Add frontend tooling like [vite](https://vitejs.dev/)
- Add [vite-mdx](https://www.npmjs.com/package/vite-plugin-mdx)
- Support for a data connecter through socket to pass data from python to mdx files as variables
- `globals` as common variable to pass data as json
- from python dictionary it can easily be converted to javascript object
- which is what is needed in most of the charting library in react

### Additional context

JSX and react frontend has lot of charting tools like d3 which are very useful, it would be really helpful to show data from python exports to those frontend renders like mdx

```[tasklist]
### Tasks
```

Contributor guide

Open the contributing guide

Research direction

No project files or tests are named. Start by reviewing the Jupyter Notebook frontend architecture and the linked MDX and Vite integration proposals, then trace how Python data could reach a frontend component. Done would require an agreed implementation for MDX rendering and Python-to-JavaScript data transfer, with validation in the relevant notebook workflow.

Written by the indexing model from the issue text.

Assessment

Tech stack
jupyter-notebook, numpy, python, react, vite
Domain
data, frontend, web-dev
Issue type
Feature
Difficulty
5/5
Estimated time
Over a week
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
15/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.