Skip to main content
Donate to the Python Software Foundation or Purchase a PyCharm License to Benefit the PSF! Donate Now

Refactor HTML in Python

Project description

phtml is a silly python library to generate HTML in Python like you would with a template, but refactor-oriented with a Pythonic React-like pattern based on nested components.

Component base

The base component class is Node:

from phtml import Node

form_layout = Node(
    'form',                     # node.tag
    {                           # node.attrs
        'class': 'foo',         # node.attrs['class']
        'method': 'POST',       # node.attrs['method']
    },
    [                           # node.children
        '{{ form.as_p() }}',    # node.children[0]
        Node('input', {'type': 'submit'}, selfclose=True),
    ],
)

Casting form_layout to string will return the following:

<form class="foo" method="POST">
    {{ form.as_p() }}
    <input type="submit" />
</form>

Rendering

While calling phtml.jinja.render(form_layout, form=YourForm()) will return the phtml output processed with form in the context and produce the final result.

The whole purpose is refactoring HTML generating logic into Python components:

from phtml import Form, Submit

form_layout = Form(
    {'class': 'foo'},
    ['{{ form.as_p() }}', Submit())],
)

Importing on the fly

from phtml import Node

form_layout = Node.factory(
    'phtml.Form', {'class': 'foo'},
    ['{{ form.as_p() }}', Node('phtml.Submit')],
)

Jinja and Materialize for the poor

Suppose you want to make a nice layout for the login form, please don’t repeat boring and verbose code like this because somewhere in the world a cat would probably die because of a side effect in an alternate reality or something:

from phtml import Form, Div

your_layout = Form(
    Div({'class': 'row'}, [
        Div({'class': 'col m6 s12'}, ['{{ form["username"] }}']),
        Div({'class': 'col m6 s12'}, ['{{ form["password"] }}']),
    ]),
)

Refactored components for the rich

Instead make a beautiful layout with reusable components:

from phtml.django.mdc import Form, Row, Col, Input

class YourLoginForm(forms.LoginForm):
    _phtml = Form(
        Row(
            Col(m=6, s=12, Input('username')),
            Col(m=6, s=12, Input('password')),
        )
    )

Note

For the documentation of the constructor of each component, please fill in their docstrings under their signature in Python code, UTSL !

Silly and Stupid context based rendering

You could render as such in jinja (or in Python without the curly braces): {{ form._phtml.jinja(form) }}, since all rendering logic should already be in phtml.

Thank you

Thanks a lot for reading. Hope this will serve as a useful example for anybody on a mission to “refactor HTML in Python”.

Project details


Release history Release notifications

Download files

Download the file for your platform. If you're not sure which to choose, learn more about installing packages.

Filename, size & hash SHA256 hash help File type Python version Upload date
phtml-0.0.1.tar.gz (4.0 kB) Copy SHA256 hash SHA256 Source None

Supported by

Elastic Elastic Search Pingdom Pingdom Monitoring Google Google BigQuery Sentry Sentry Error logging AWS AWS Cloud computing DataDog DataDog Monitoring Fastly Fastly CDN SignalFx SignalFx Supporter DigiCert DigiCert EV certificate StatusPage StatusPage Status page