Run the market dashboard

The market dashboard is an advanced producer-to-browser example. It prepares five states from a Yahoo Finance notebook, verifies the notebook export, then opens a vanilla TypeScript application that consumes five output representations.

Prerequisites

Run this example from a repository checkout with:

Requirement	Role
Git	Clones the repository
Python 3.14	Runs the notebook and Python package
uv	Installs locked Python dependencies and runs the CLI
Node.js	Runs the version pinned by the workspace
pnpm	Installs dependencies and runs the example scripts
A POSIX shell and Make	Run the repository targets
HTTPS access to the Python and npm package registries	Downloads dependencies that are absent from local caches
HTTPS access to Yahoo Finance	Retrieves historical prices during preparation
A local browser and loopback network access	Opens the URL printed by the development server

Live market data

The preparation run requests historical prices from Yahoo Finance. Network availability and the returned market data can change the run. Use the deterministic quickstart for the first local workflow.

Build and open the application

Clone the repository if needed, then run the example:

git clone https://github.com/marimo-team/marimo-export.git
cd marimo-export
make bootstrap
cd examples/vite-vanilla
pnpm run export
pnpm run verify:export
pnpm run dev

Open the loopback URL printed by Vite, the development server included in the locked workspace. The dashboard switches among five exported states and loads Parquet rows, a domain-specific market summary, a Vega-Lite chart specification, a PNG image, and an AnyWidget interactive value. The browser runs no Python process.

The example connects three authored sources:

• finance.py owns the analysis and notebook controls.
• finance.export.yaml selects five states and five outputs.
• src/main.ts opens the verified export and owns browser state transitions, loading, rendering, and mount disposal.

The same notebook export can be inspected by an agent, opened from Python, or loaded by another browser application. The dashboard is one consumer of the published outputs.

Inspect reuse

Build the matching export a second time:

pnpm run export

The export repository stores reusable prepared states. The matching ExportSpec, producer identity, and state fingerprints let the second build reuse the prepared export before notebook startup.

Capture the open notebook

Start the notebook from examples/vite-vanilla:

pnpm run notebook

After the notebook finishes loading, list its live sessions from another terminal:

uv run --locked --package marimo-export-vite-vanilla-example \
  marimo-export inspect http://127.0.0.1:2718 --json

Copy the reported session ID into the capture command:

uv run --locked --package marimo-export-vite-vanilla-example \
  marimo-export capture http://127.0.0.1:2718 \
  --session SESSION_ID \
  --spec finance.export.yaml \
  --output public/export \
  --replace \
  --jsonl

capture replaces the same local export and leaves the selected notebook session active. The dashboard consumes the same index.json contract from either producer path.

Next, choose states and outputs for your own notebook or consume a notebook export from another client.