MonsterUI can display tables from dict lists which is perfect for debugging stuff involving app storing/saving things in the DB

With fastlite (fasthtml default) database:

TableFromDicts(header_data=('title', 'status', 'completed'), body_data=list(db.query('select * from todo')))

header_data sets column order and which columns to show. Skip columns you don't want (like PK).

Useful for dev and debug - make a route that shows what your app sees in the database.

Full example with data

from fasthtml.common import *
from monsterui.all import *

class Todo:
    id: int; title: str; status: str; completed: bool

db = database('todo_example.db')
db.todos = db.create(Todo)

data = [{"title": "Buy groceries", "status": "pending","completed": False},
        {"title": "Finish project report", "status": "in_progress", "completed": False},
        {"title": "Schedule dentist appointment", "status": "pending", "completed": False},
        {"title": "Call mom", "status": "completed", "completed": True},
        {"title": "Update resume", "status": "in_progress", "completed": False},
        {"title": "Pay rent", "status": "completed", "completed": True},
        {"title": "Research new laptop", "status": "pending", "completed": False},
        {"title": "Book flight for vacation", "status": "in_progress", "completed": False}]

app,rt = fast_app(hdrs=Theme.blue.headers())

for item in data: db.todos.insert(Todo(**item))

@rt
def index():
    return TableFromDicts(
        header_data=('title', 'status', 'completed'),
        body_data=list(db.query('select * from todo')))

serve()