Skip to content

README2.md

Latest commit

 

History

History
71 lines (49 loc) · 2.34 KB

README2.md

File metadata and controls

71 lines (49 loc) · 2.34 KB
Raw

marimo WebAssembly + GitHub Pages Template

This template repository demonstrates how to export marimo notebooks to WebAssembly and deploy them to GitHub Pages.

📚 Included Examples

  • apps/charts.py: Interactive data visualization with Altair
  • notebooks/fibonacci.py: Interactive Fibonacci sequence calculator
  • notebooks/penguins.py: Interactive data analysis with Polars and marimo

🚀 Usage

  1. Fork this repository
  2. Add your marimo files to the notebooks/ or apps/ directory
    1. notebooks/ notebooks are exported with --mode edit
    2. apps/ notebooks are exported with --mode run
  3. Push to main branch
  4. Go to repository Settings > Pages and change the "Source" dropdown to "GitHub Actions"
  5. GitHub Actions will automatically build and deploy to Pages

Including data or assets

To include data or assets in your notebooks, add them to the public/ directory.

For example, the apps/charts.py notebook loads an image asset from the public/ directory.

<img src="public/logo.png" width="200" />

And the notebooks/penguins.py notebook loads a CSV dataset from the public/ directory.

import polars as pl
df = pl.read_csv(mo.notebook_location() / "public" / "penguins.csv")

🖼️ Gallery thumbnails

The landing page (scripts/build.py → generate_index) shows a real screenshot thumbnail for each app. Per-app card copy lives in the APPS table in scripts/build.py; an app missing from the table still appears with a titleized name, and an app missing a thumbnail falls back to a CSS gradient placeholder.

Thumbnails are committed under thumbnails/<stem>.png and regenerated locally (not in CI) with Playwright:

pip install playwright && python -m playwright install chromium
python scripts/screenshots.py            # capture all live apps
python scripts/screenshots.py --only ptychographic_ctf --settle 20  # one app

Commit the resulting PNGs. scripts/build.py copies thumbnails/ into _site/ at build time.

🧪 Testing

To test the export process, run scripts/build.py from the root directory.

python scripts/build.py

This will export all notebooks in a folder called _site/ in the root directory. Then to serve the site, run:

python -m http.server -d _site

This will serve the site at http://localhost:8000.