Trame

3.12.0 · active · verified Tue Apr 14

Trame is an easy-to-use, Python-based framework that lets you create web applications with interactive scientific visualization. It simplifies web development by managing UI layout, state, events, and widgets entirely in Python, abstracting away the need for HTML, CSS, or JavaScript. Trame applications can run locally, remotely, in the cloud, in Jupyter, or on HPC. The library maintains an active release cadence, with version 3.12.0 being the latest stable release.

Warnings

breaking Trame v3 changed the default client type from Vue2 to Vue3 in January 2024. Existing applications built with Trame v2 that relied on Vue2 components will need to explicitly set `server.client_type = "vue2"` or migrate to Vue3 components.
Fix: For existing v2 apps, add `server.client_type = "vue2"` after `get_server()`. For new v3 apps, use `vuetify3` imports (e.g., `from trame.ui.vuetify3 import SinglePageLayout`, `from trame.widgets import vuetify3 as v3`).
breaking In Trame v3, 'trame-vuetify' and 'trame-vtk' are no longer bundled by default with the core `trame` package. They must be installed separately if you intend to use Vuetify UI components or VTK visualizations.
Fix: Install optional dependencies explicitly: `pip install trame-vuetify trame-vtk`.
deprecated The `trame.app.jupyter` package has been removed in Trame v3 as Jupyter integration is now directly part of the layouts. The `trame.app.dev` package is also considered deprecated and generally not needed for 99.99% of users.
Fix: Avoid using `trame.app.jupyter` and `trame.app.dev`. Rely on direct Jupyter integration provided by current layouts.
gotcha When combining Trame with custom command-line argument parsers (e.g., `argparse`), ensure that your arguments do not overlap with Trame's built-in server arguments.
Fix: If arguments overlap, use the `--trame-args` flag to pass specific arguments to the Trame server, e.g., `python your_app.py --my-custom-arg 123 --trame-args --port 8081`.
gotcha API changes in underlying front-end libraries (like Vuetify from v2 to v3) can affect Trame widgets, even if Trame itself aims for API compatibility.
Fix: Consult the documentation for `trame-vuetify3` and other specific widget libraries to understand any API differences when migrating or developing for Vue3.

Install

pip install trame Install core Trame library

Imports

get_server
```
from trame.app import get_server
```
SinglePageLayout
```
from trame.ui.vuetify3 import SinglePageLayout
```
For Trame v3+, the default client is Vue3, so import from `vuetify3`. Older Vue2-based layouts or widgets will cause issues.
v3
```
from trame.widgets import vuetify3 as v3
```
Trame v3 defaults to Vue3 widgets. Use `vuetify3` for new projects. Older `vuetify` (Vue2) widgets may still be used if `server.client_type` is explicitly set to 'vue2'.

Quickstart

This quickstart code initializes a Trame server, sets a reactive state variable, and defines a simple single-page layout using Vuetify3 widgets. It creates a card with a title that updates when a button is clicked, demonstrating basic interactivity. The application runs locally and opens in a web browser upon execution.

from trame.app import get_server
from trame.ui.vuetify3 import SinglePageLayout
from trame.widgets import vuetify3 as v3

server = get_server(client_type="vue3") # Explicitly set for clarity in v3+ apps
server.state.name = "Trame"

with SinglePageLayout(server) as layout:
    layout.title.set_text("Hello Trame")
    with layout.content:
        with v3.VContainer(classes="fill-height", fluid=True):
            with v3.VRow(classes="fill-height", align="center", justify="center"):
                with v3.VCol(cols=12, sm=6, md=4):
                    v3.VCard(
                        v3.VCardTitle(classes="headline", children=["Welcome to ", ('name', 'Trame App')]),
                        v3.VCardText("This is a simple Trame application running in Vue3!"),
                        v3.VCardActions(
                            v3.VSpacer(),
                            v3.VBtn('Click me!', click='server.state.name = "Updated Trame"'),
                            v3.VSpacer(),
                        )
                    )

if __name__ == '__main__':
    server.start()

view raw JSON →