Use pyodide kernel in JupyterLite to deploy tutorial

Author: ianthomas23

.github/workflows/deploy.yml

@@ -0,0 +1,47 @@
+name: Build and deploy to github pages
+
+on:
+  push:
+    branches:
+      - main
+  pull_request:
+    branches:
+      - '*'
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+      - name: Setup Python
+        uses: actions/setup-python@v5
+        with:
+          python-version: '3.13'
+      - name: Install the dependencies
+        run: |
+          python -m pip install -r requirements.txt
+      - name: Build the JupyterLite site
+        run: |
+          jupyter lite build --contents notebooks --output-dir dist
+      - name: Upload artifact
+        uses: actions/upload-pages-artifact@v3
+        with:
+          path: ./dist
+
+  deploy:
+    needs: build
+    if: github.ref == 'refs/heads/main'
+    permissions:
+      pages: write
+      id-token: write
+
+    environment:
+      name: github-pages
+      url: ${{ steps.deployment.outputs.page_url }}
+
+    runs-on: ubuntu-latest
+    steps:
+      - name: Deploy to GitHub Pages
+        id: deployment
+        uses: actions/deploy-pages@v4

.gitignore

@@ -134,3 +134,7 @@ dmypy.json
 
 # Pyre type checker
 .pyre/
+
+# JupyterLite deployment
+.jupyterlite.doit.db
+_output/

README.md

@@ -1,3 +1,22 @@
+# Work in progress to use pyodide kernel in JupyterLite for tutorial
+
+Deployed to github pages at https://bokeh.github.io/tutorial
+
+To try out locally, create a python virtual environment of your choice (`venv`, `pyenv`,
+'mamba', `conda`, etc) and follow these steps:
+
+```bash
+python -m pip install -r requirements.txt
+jupyter lite build --contents notebooks
+jupyter lite serve
+```
+
+and open a web browser at the URL specified.
+
+------------------------
+
+
+
 # Bokeh tutorial notebooks
 
 ## Setup and run the tutorials

environment.yml

@@ -127,6 +127,8 @@
    "metadata": {},
    "outputs": [],
    "source": [
+    "%pip install -q geopandas\n",
+    "\n",
     "# load and display tutorial dashboard\n",
     "from tutorial_dashboard import dashboard_layout\n",
     "\n",
@@ -245,7 +247,7 @@
     "Python script.\n",
     "This tutorial will reference the data preparation script but will not go into detail\n",
     "about the data preparation itself.\n",
-    "You can find the data processing code in [`carriers_data.py`](../data/carriers_data.py).\n",
+    "You can find the data processing code in [`carriers_data.py`](./data/carriers_data.py).\n",
     "\n",
     "This tutorial is designed to run on [mybinder.org](https://mybinder.readthedocs.io/en/latest/).\n",
     "You can also run this tutorial locally on your computer.\n",
@@ -286,7 +288,7 @@
    "source": [
     "# Next section\n",
     "\n",
-    "<a href=\"02_installation_and_setup.ipynb\" target=\"_blank\">\n",
+    "<a href=\"./02_installation_and_setup.ipynb\" target=\"_blank\">\n",
     "    <img src=\"assets/arrow.svg\" alt=\"Next section\" width=\"100\" align=\"right\">\n",
     "</a>\n",
     "\n",

data/__init__.py renamed to notebooks/.nojekyll

@@ -117,7 +117,7 @@
    "source": [
     "# Next section\n",
     "\n",
-    "<a href=\"03_basic_concepts.ipynb\" target=\"_blank\">\n",
+    "<a href=\"./03_basic_concepts.ipynb\" target=\"_blank\">\n",
     "    <img src=\"assets/arrow.svg\" alt=\"Next section\" width=\"100\" align=\"right\">\n",
     "</a>\n",
     "\n",

notebooks/01_introduction.ipynb

@@ -256,7 +256,7 @@
    "source": [
     "# Next section\n",
     "\n",
-    "<a href=\"04_basic_plots.ipynb\" target=\"_blank\">\n",
+    "<a href=\"./04_basic_plots.ipynb\" target=\"_blank\">\n",
     "    <img src=\"assets/arrow.svg\" alt=\"Next section\" width=\"100\" align=\"right\">\n",
     "</a>\n",
     "\n",

notebooks/02_installation_and_setup.ipynb

@@ -29,6 +29,8 @@
    "metadata": {},
    "outputs": [],
    "source": [
+    "%pip install -q pandas\n",
+    "\n",
     "# load tutorial data\n",
     "from tutorial_data import data"
    ]
@@ -525,7 +527,7 @@
     "This is an example of how you can customize the appearance of the different\n",
     "elements of your plot.\n",
     "\n",
-    "<a href=\"05_styling.ipynb\" target=\"_blank\">\n",
+    "<a href=\"./05_styling.ipynb\" target=\"_blank\">\n",
     "    <img src=\"assets/arrow.svg\" alt=\"Next section\" width=\"100\" align=\"right\">\n",
     "</a>\n",
     "\n",

notebooks/03_basic_concepts.ipynb

@@ -29,6 +29,8 @@
    "metadata": {},
    "outputs": [],
    "source": [
+    "%pip install -q pandas\n",
+    "\n",
     "# load tutorial data\n",
     "from tutorial_data import data"
    ]
@@ -749,7 +751,7 @@
    "source": [
     "# Next section\n",
     "\n",
-    "<a href=\"06_data_sources.ipynb\" target=\"_blank\">\n",
+    "<a href=\"./06_data_sources.ipynb\" target=\"_blank\">\n",
     "    <img src=\"assets/arrow.svg\" alt=\"Next section\" width=\"100\" align=\"right\">\n",
     "</a>\n",
     "\n",