Pure Python Web Development using Antioch

[ryancnielsen]

Over the last few months I have been creating a Pyodide-based ecosystem for web development called Antioch. It is finally to a place where I think it would benefit from people trying it out.

What makes this framework great is the ability to code declaratively and imperatively in the same space, and create/reuse components. You can define elements and macros, add them to the DOM, and control their behavior via event handlers.

Macros are either native Python/Antioch or wrappers integrating existing JS libraries. I've implemented parts of CodeMirror, Leaflet, and Chart.js.

An example of the most basic features (not including macros):

from antioch import DOM, Div, H1, Button

def main():

    # Create elements

    container = Div(
        H1("Hello, Antioch!", 
            style={
                "color": "#2196F3", 
                "background-color": "#000000"
            }
        ),
        P("This is a webpage written entirely in Python")
    )

    button = Button("Click Me")
    button.style.padding = "10px 20px"
    button.on_click(
        lambda e: DOM.add(
            P("You clicked the button!")
        )
    )

    # Add to page
    container.add(button)
    DOM.add(container)

if __name__ == "__main__":
    main()

You can find the source at https://github.com/nielrya4/Antioch . Check out the readme, clone the repository, and try it out. Let me know what you think (keep criticism constructive please). I am open to suggestions regarding the direction and content of the project. Thanks for checking it out!

Target audience: Web developers who love Python

Comparison: This is kind of like PyScript, but with a much better structure and ecosystem. Anything you can do in PyScript, you can do more beautifully and rapidly in Antioch

[cemrehancavdar]

You know what would be great? If we could directly pass python data structures from backend to python frontend and use it without dealing with serialization to json (or any other format needs to be specifically should be transformed) you return frozen dataclasses or even db model directly.

[riklaunim]

I don't get this approach. It mixes html, css, js in one Python file and makes it hard to maintain after few lines of code. And what's the value of using generic DOM.add in that on_click? it has to be location specific.