PyView Live Demos

Basic Counter

Gotta start somewhere, right? This example shows how to send click events to the backend to update state. We also snuck in handling URL params.

Basic Counter with PubSub

The counter example, but with PubSub. Open this example in multiple windows to see the state update in real time across all windows.

Volume Control

Keyboard events!

Registration Form Validation

Form validation using Pydantic

More Form Validation

Table Pagination

Table Pagination, and updating the URL from the backend.

Podcasts

URL Parameters, client navigation updates, and dynamic page titles.

Realtime Status Dashboard

Pushing updates from the backend to the client.

JS Commands

JS Commands let you update the DOM without making a trip to the server.

Web Ping

Another example of pushing updates from the backend to the client.

Presence

A simple example of presence tracking. Open this example in multiple windows.

Maps

A simple example of using Leaflet.js with PyView, and sending information back and forth between the liveview and the JS library.

File Upload

File upload example, with previews and progress bars.

Kanban Board

A simple Kanban board example with drag and drop (another hooks example showing integration w/ SortableJS).

Template Includes

This example shows how to include templates in other templates.

Streams Demo

This example demonstrates Phoenix LiveView streams in PyView. Streams efficiently send only changed items over the websocket.

Flash Messages

Show and dismiss user feedback with flash messages. Flash values live on the socket and are automatically available in your template.

Basic Counter (T-String Version)

Gotta start somewhere, right? This example shows how to send click events to the backend to update state. We also snuck in handling URL params.

Streams Demo (T-String Version)

This example demonstrates streams using Python 3.14+ t-string templates.

Flash Messages (T-String Version)

Show and dismiss user feedback with flash messages. Flash values live on the socket and are automatically available in your template.

JS Commands (T-String Version)

JS Commands let you update the DOM without making a trip to the server. This example demonstrates the new t-string API using the `js` singleton.

Stateless Components Demo

Demonstrates reusable function components that compose together. All events are handled by this parent LiveView.

Stateful Components Demo

Shows multiple independent component instances and parent-child communication.

Slots Demo

Demonstrates how to use slots to pass content into components.