UiWizard

UiWizard is a python-based ui-framework for the web. Why create this project? - Learning. I wanted to figure out how to do something simillar but without using websockets - I wanted to try out HTMX - Limited control over the underlaying tech stack but mainly just learning

Example and docs UI-Wizard

Features

  • Tailwind and DaisyUI for the graphics and responsive layout
  • Webbased
  • Quite a lot of standard elements, input fields, dropdown, foot, header, tabs...
  • HTMX for interactivity
  • Hopefully great defaults!

Usage

Install the library

pip install uiwiz

Create a main.py file

import uvicorn

from uiwiz import ui
from uiwiz.app import UiwizApp

app = UiwizApp()


@app.page("/")
async def home_page():
    ui.label("Hello world")


if __name__ == "__main__":
    uvicorn.run(app)

Run it

python main.py

General info

UiWizard is created ontop of FastAPI, which means it has access to all of the normal functionality of FastAPI. Any extension will work with UiWizard. UiWizard extends FastAPI with two concepts

  • app.page
  • app.ui

app.page represents a full html document with links to css and javascript. app.ui represents a partial part of an html document. The partial part is meant as a way to update a part of a app.page html endpoint.

Goals

My overall goal of UiWizard is to be a highly customizable web framework for my own usage. There are a lot of projects like this one but I found most of them lacking to say the least.

Some of my main drivers are as follows

  • Great defaults
  • Customization
  • Somewhat ease of use

HTMX

HTMX works with input fields in HTML and forms. To make it a bit easier to work with the form submit event does not send the data in the normal form format but uses the HTMX extension to convert it to json. This means that endpoints using UiWizard can use pydantic models as the input and have the benefit of validation.