GitHunt
CI

civvic/bridget

FastHTML + HTMX in Jupyter notebooks without server requirements. Enables interactive widgets and real-time notebook introspection.

Bridget

Key Features

  • Serverless HTMX + FastHTML: full FastHTML + HTMX functionality in
    Jupyter environments, with no HTTP server required.
  • Extended FastHTML routing system: integrates seamlessly with
    Python methods.
  • Widget system (WIP): build UI components with minimal JavaScript.
  • Real-time notebook introspection: capture the full notebook
    structure dynamically, without .ipynb files.
  • Environment-agnostic: supports VSCode, JupyterLab, and other
    interfaces.

Bridget relies on companion extensions for JupyterLab/Notebook and
VSCode/Cursor. These capture the live notebook state and feed it
directly to Bridget’s Python kernel.

Installation

As Bridget is in early development, it is not yet on PyPI. A development
installation requires NodeJS and the pnpm package manager.

Clone the repository, install JS dependencies with pnpm, then perform
an editable Python install. This builds the JS components and installs
the nbinspect-lab Jupyter extension automatically.

# 1. Clone the repository
git clone https://github.com/civvic/bridget.git
cd bridget

# 2. Install JavaScript dependencies (JupyterLab extension)
pnpm install

# 3. Install Python package with all dependencies
pip install -e .[dev]

Note: step 2 is only necessary if you are going to use Jupyter
Lab/Notebook. For VSCode, simply install the extension. See below.

VSCode Extension Installation

For VSCode and Cursor, install the nbinspect-vscode extension manually.
The .vsix file is inside packages/nbinspect-vscode.

To install: - Run the command Extensions: Install from VSIX… - Or open
the Extensions view, click the “…” menu, and select Install from VSIX….

Quick Start

A minimal stateful counter component:

from bridget.common import get_app
from fasthtml.components import Button

app, bridget, rt = get_app()  # Initialize Bridget and app

def counter(n=0):
    @rt('/inc')
    def increment(n:int):
        return Button(f"Count: {n+1}", value=f"{n+1}", name='n', hx_post='/inc', hx_swap='outerHTML')
    return increment(n-1)

counter()

For more detailed examples, review the notebooks in the nbs/examples/
directory.

Core Concepts

The Bridge

The Bridge
class (14_bridge.ipynb) provides the low-level
communication layer between Python and JavaScript, replacing the HTTP
transport layer typically used by HTMX.

Bridget and get_app()

The Bridget
class (32_bridget.ipynb) and
get_app()
function provide the high-level API for creating interactive components.
This is your main entry point.

Routing System

Bridget extends FastHTML’s routing system
(04_route_provider.ipynb) to work with Python
methods and class instances, enabling stateful components.

Plugin System

Bridget’s functionality can be extended through plugins
(16_bridge_plugins.ipynb), enabling modular
feature development.

Notebook State

Access live notebook structure and content
(21_nb_state.ipynb) without saving files, enabling
powerful introspection capabilities.

Documentation Structure

Core Components

FastHTML Integration

Notebook State

Components and Widgets

Examples

Compatibility and Development

Bridget is developed with nbdev and requires
Python 3.12+. Core dependencies like fasthtml and anywidget are
installed automatically. It is regularly tested on macOS with VSCode,
Jupyter Notebook, and Jupyter Lab, and is expected to function in any
environment where anywidget/ipywidgets is supported.

Project Status

Bridget is experimental and integrates Jupyter, FastHTML, and HTMX.

Its primary goal, inspired by Donald Knuth’s concept of Literate
Programming, is to create truly dynamic documents where any content
(including cell outputs) can be directly edited and interacted with in
place.

Current status: - ✅ Core architecture for serverless HTMX and notebook
introspection is functional. - ✅ Key HTMX patterns are supported and
demonstrated in the nbs/examples/ notebooks. - ⚠️ The API is unstable
and subject to significant change. - ⛔ Not recommended for use in
production environments. - 📝 Documentation and more complex examples
are in active development.